[Commits] r339 - in apps/opengeo/geoexplorer/trunk: . lib

commits at geoext.org commits at geoext.org
Fri Apr 3 00:29:20 CEST 2009


Author: dwins
Date: 2009-04-03 00:29:20 +0200 (Fri, 03 Apr 2009)
New Revision: 339

Added:
   apps/opengeo/geoexplorer/trunk/lib/MapToolMenu.js
   apps/opengeo/geoexplorer/trunk/lib/MapToolSplitToggle.js
   apps/opengeo/geoexplorer/trunk/lib/MapToolToggle.js
Modified:
   apps/opengeo/geoexplorer/trunk/debug.html
   apps/opengeo/geoexplorer/trunk/lib/GeoExplorer.js
Log:
Add Measure tool, with some support classes for buttons that wrap OL controls.


Modified: apps/opengeo/geoexplorer/trunk/debug.html
===================================================================
--- apps/opengeo/geoexplorer/trunk/debug.html	2009-04-02 21:45:54 UTC (rev 338)
+++ apps/opengeo/geoexplorer/trunk/debug.html	2009-04-02 22:29:20 UTC (rev 339)
@@ -22,6 +22,9 @@
         <script type="text/javascript" src="lib/Viewer.js"></script> 
         <script type="text/javascript" src="lib/GeoExplorer.js"></script> 
         <script type="text/javascript" src="lib/GeoExplorer/dispatch.js"></script> 
+        <script type="text/javascript" src="lib/MapToolMenu.js"></script> 
+        <script type="text/javascript" src="lib/MapToolToggle.js"></script> 
+        <script type="text/javascript" src="lib/MapToolSplitToggle.js"></script> 
 
         <script>
             var app = new GeoExplorer({

Modified: apps/opengeo/geoexplorer/trunk/lib/GeoExplorer.js
===================================================================
--- apps/opengeo/geoexplorer/trunk/lib/GeoExplorer.js	2009-04-02 21:45:54 UTC (rev 338)
+++ apps/opengeo/geoexplorer/trunk/lib/GeoExplorer.js	2009-04-02 22:29:20 UTC (rev 339)
@@ -244,7 +244,9 @@
         var mapControls = { 
             getFeatureInfo: new OpenLayers.Control.WMSGetFeatureInfo(this.initialConfig.ows, {
                 queryVisible: true
-            })
+            }),
+            measureLength: this.createMeasureTool(OpenLayers.Handler.Path, 'Length'),
+            measureArea: this.createMeasureTool(OpenLayers.Handler.Polygon, 'Area')
         };
 
         mapControls.getFeatureInfo.events.register("getfeatureinfo", this, this.displayPopup);
@@ -254,30 +256,106 @@
         }
 
         var toolGroup = "toolGroup";
+
         var toolbarItems = [
             new Ext.Button({
                 text: "Bookmark",
                 handler: this.bookmark,
                 scope: this
             }),
-            new Ext.Button({
-                text: "GetFeatureInfo",
+            new MapToolToggle({
+                text: "Get Feature Info", 
+                iconCls: null,
+                toggleGroup: toolGroup, 
+                tool: mapControls.getFeatureInfo
+            }),
+            new MapToolSplitToggle({
+                text: "Measure",
+                iconCls: null,
+                defaultTool: mapControls.measureLength,
+                tools: [
+                    {text: 'Length', tool: mapControls.measureLength, iconCls: null}, 
+                    {text: 'Area', tool: mapControls.measureArea, iconCls: null}
+                ],
                 enableToggle: true,
-                toggleGroup: toolGroup,
-                handler: function(toggled, item) { 
-                    if (toggled){
-                        mapControls.getFeatureInfo.activate(); 
-                    } else {
-                        mapControls.getFeatureInfo.deactivate();
-                    }
-                },
-                scope: this
+                toggleGroup: toolGroup 
             })
         ];
 
         return toolbarItems;
     },
 
+    createMeasureTool: function(handlerType, title) {
+        var measureControl = new OpenLayers.Control.Measure(handlerType, {persist: true});
+
+        var measureToolTip; 
+        
+        var tooltipTitle = title;
+
+        var cleanup = OpenLayers.Function.bind(function() {
+            if (measureToolTip) {
+                measureToolTip.destroy();
+            }   
+        }, this);
+
+        var makeString = OpenLayers.Function.bind(function(metricData) {
+            var metric = metricData.measure;
+            var metricUnit = metricData.units;
+            
+            measureControl.displaySystem = "english";
+            
+            var englishData = metricData.geometry.CLASS_NAME.indexOf("LineString") > -1 
+                ? measureControl.getBestLength(metricData.geometry)
+                : measureControl.getBestArea(metricData.geometry);
+
+            var english = englishData[0];
+            var englishUnit = englishData[1];
+            
+            measureControl.displaySystem = "metric";
+            
+            return metric.toFixed(2) + " " + metricUnit + "<br>" 
+                + english.toFixed(2) + " " + englishUnit;
+        }, this);
+
+
+        measureControl.events.register("measurepartial", this, function(data) {
+            cleanup();
+            
+            measureToolTip = new Ext.ToolTip({
+                target: Ext.getBody(),
+                html: makeString(data),
+                title: tooltipTitle,
+                autoHide: false,
+                draggable: false,
+                showDelay: 5
+            });
+        });
+
+        measureControl.events.register("measure", this, function(data) {
+            cleanup();
+            
+            measureToolTip = new Ext.ToolTip({
+                target: Ext.getBody(),
+                html: makeString(data),
+                title: tooltipTitle,
+                autoHide: false,
+                closable: true,
+                draggable: false,
+                showDelay: 5
+            });
+            
+            feature = new OpenLayers.Feature.Vector(data.geometry, {}, {});
+            
+            measureToolTip.on("hide", function() {
+                data.clearDisplay();
+                cleanup();
+            }, this);
+        });
+        
+        measureControl.events.register("deactivate", this, cleanup);
+        return measureControl;
+    },
+
     displayPopup: function(evt){
         var html;
         if (evt.features && evt.features.length) {
@@ -307,7 +385,6 @@
      *{String} The URL displayed to the user.
      */ 
     bookmark: function(){
-
         var config = this.extractConfiguration();
 
         var query = Ext.urlEncode({q: Ext.util.JSON.encode(config)});
@@ -332,7 +409,6 @@
         win.show();
 
         return url;
-
     },
     
     /**

Added: apps/opengeo/geoexplorer/trunk/lib/MapToolMenu.js
===================================================================
--- apps/opengeo/geoexplorer/trunk/lib/MapToolMenu.js	                        (rev 0)
+++ apps/opengeo/geoexplorer/trunk/lib/MapToolMenu.js	2009-04-02 22:29:20 UTC (rev 339)
@@ -0,0 +1,34 @@
+/**
+ * Copyright (c) 2008 The Open Planning Project
+ */
+
+var MapToolMenu = function(options) { 
+    options.items = options.items || [];
+
+    var disableTools = function() {
+        for (var i = 0, len = options.tools.length; i < len; i++) {
+            var t = options.tools[i].tool || options.tools[i];
+            t.deactivate();
+        }
+    };
+
+    for (var i = 0, len = options.tools.length; i < len; i++) {
+        console.log(options.tools[i]);
+        var conf = options.tools[i];
+        var t = conf.tool || conf;
+        options.items.push(Ext.applyIf(conf, {
+            text: t.CLASS_NAME,
+            iconCls: t.CLASS_NAME,
+            handler: (function(tool){
+                return function() {
+                    disableTools();
+                    tool.activate();
+                };
+            })(t),
+            scope: this
+        }));
+    }
+    MapToolMenu.superclass.constructor.call(this, options);
+};
+
+Ext.extend(MapToolMenu, Ext.menu.Menu);

Added: apps/opengeo/geoexplorer/trunk/lib/MapToolSplitToggle.js
===================================================================
--- apps/opengeo/geoexplorer/trunk/lib/MapToolSplitToggle.js	                        (rev 0)
+++ apps/opengeo/geoexplorer/trunk/lib/MapToolSplitToggle.js	2009-04-02 22:29:20 UTC (rev 339)
@@ -0,0 +1,61 @@
+/**
+ * Copyright (c) 2008 The Open Planning Project
+ * @requires MapToolMenu.js
+ */
+
+var MapToolSplitToggle = function(options) { 
+    this.lastActiveTool = options.defaultTool;
+    this.tools = options.tools;
+
+    Ext.applyIf(options, {
+        text: this.findLabel(),
+        enableToggle: true,
+        iconCls: this.findIconCls(),
+        toggleHandler: this.handleEvent,
+        handler: this.handleEvent,
+        scope: this,
+        menu: new MapToolMenu({tools: options.tools})
+    });
+
+    options.menu.on("itemclick", this.handleMenu, this);
+
+    MapToolSplitToggle.superclass.constructor.call(this, options);
+
+    if (options.toggleGroup) {
+        this.on("render", function() {Ext.ButtonToggleMgr.register(this);}, this);
+    }
+};
+
+Ext.extend(MapToolSplitToggle, Ext.SplitButton, {
+    /**
+     * Property: lastActiveTool
+     * The most recently selected OpenLayers Control, to be toggled when the main button is.
+     */
+    lastActiveTool: null,
+
+    handleEvent: function(item) {
+        if (item.pressed) {
+            this.lastActiveTool.activate();
+        } else { 
+            this.lastActiveTool.deactivate();
+        }
+    }, 
+
+    handleMenu: function(item, evt) {
+        for (var i = 0, len = this.tools.length; i < len; i++) {
+            var t = this.tools[i].tool || this.tools[i];
+            if (t.active) {
+               this.toggle(true);
+               this.lastActiveTool = t;
+            }
+        }
+    },
+    
+    findIconCls: function() {
+        return this.lastActiveTool.CLASS_NAME;
+    },
+
+    findLabel: function() {
+        return this.lastActiveTool.CLASS_NAME;
+    }
+});

Added: apps/opengeo/geoexplorer/trunk/lib/MapToolToggle.js
===================================================================
--- apps/opengeo/geoexplorer/trunk/lib/MapToolToggle.js	                        (rev 0)
+++ apps/opengeo/geoexplorer/trunk/lib/MapToolToggle.js	2009-04-02 22:29:20 UTC (rev 339)
@@ -0,0 +1,39 @@
+/**
+ * Copyright (c) 2008 The Open Planning Project
+ */
+
+var MapToolToggle = function(options) {
+    this.mapTool = options.tool;
+    Ext.applyIf(options, {
+        text: this.findLabel(),
+        enableToggle: true,
+        iconCls: this.findIconCls(),
+        handler: this.handleEvent,
+        scope: this
+    });
+    MapToolToggle.superclass.constructor.call(this, options);
+};
+
+Ext.extend(MapToolToggle, Ext.Button, {
+    /**
+     * Property: mapTool
+     * The OpenLayers Control that this Action toggles.
+     */
+    mapTool: null,
+
+    handleEvent: function(item) {
+        if (item.pressed) {
+            this.mapTool.activate();
+        } else { 
+            this.mapTool.deactivate();
+        }
+    }, 
+    
+    findIconCls: function() {
+        return this.mapTool.CLASS_NAME;
+    },
+
+    findLabel: function() {
+        return this.mapTool.CLASS_NAME;
+    }
+});



More information about the Commits mailing list