[Commits] r1563 - in sandbox/cmoullet/ux/GoogleEarthPanel: examples ux/widgets

commits at geoext.org commits at geoext.org
Sun Dec 6 08:01:23 CET 2009


Author: cmoullet
Date: 2009-12-06 08:01:22 +0100 (Sun, 06 Dec 2009)
New Revision: 1563

Modified:
   sandbox/cmoullet/ux/GoogleEarthPanel/examples/GoogleEarthPanelWmsExample.html
   sandbox/cmoullet/ux/GoogleEarthPanel/ux/widgets/GoogleEarthPanel.js
Log:
Refactor modes. Add navigation3Dmode.

Modified: sandbox/cmoullet/ux/GoogleEarthPanel/examples/GoogleEarthPanelWmsExample.html
===================================================================
--- sandbox/cmoullet/ux/GoogleEarthPanel/examples/GoogleEarthPanelWmsExample.html	2009-12-06 05:14:28 UTC (rev 1562)
+++ sandbox/cmoullet/ux/GoogleEarthPanel/examples/GoogleEarthPanelWmsExample.html	2009-12-06 07:01:22 UTC (rev 1563)
@@ -1,6 +1,6 @@
 <html>
 <head>
-    <title>GeoExt Google Earth Panel UX with WMS / WFS Example</title>
+    <title>GeoExt Google Earth Panel UX with WMS Example</title>
     <script type="text/javascript" src="http://extjs.cachefly.net/builds/ext-cdn-771.js"></script>
     <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-2.2.1/resources/css/ext-all.css" />
     <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-2.2.1/examples/shared/examples.css" />

Modified: sandbox/cmoullet/ux/GoogleEarthPanel/ux/widgets/GoogleEarthPanel.js
===================================================================
--- sandbox/cmoullet/ux/GoogleEarthPanel/ux/widgets/GoogleEarthPanel.js	2009-12-06 05:14:28 UTC (rev 1562)
+++ sandbox/cmoullet/ux/GoogleEarthPanel/ux/widgets/GoogleEarthPanel.js	2009-12-06 07:01:22 UTC (rev 1563)
@@ -8,8 +8,6 @@
 
 Ext.namespace('GeoExt.ux');
 
-// TODO: permalink manage in this class
-// TODO: add kml layer (see ticket)
 // TODO: improve hide / show
 
 GeoExt.ux.GoogleEarthPanel = Ext.extend(Ext.Panel, {
@@ -57,19 +55,22 @@
      */
     showBuildingsLowResolutionLayer: false,
 
-    /** api: config[navigationMode2D]
+    /** api: config[show2DNavigationTool]
      *  This mode will show a 2D navigation that allows the user to manage the range and the heading of the Google Earth Instance.
      *  This requires a map.
      */
-    navigationMode2D: true,
+    show2DNavigationTool: true,
 
-    /** api: config[navigationModeFrom2D]
+    /** api: config[navigationMode2D]
      *  This mode will synchronize the center of the 2D map with the lookAt point of the Google Earth Instance
      *  This requires a map.
      */
-    navigationModeFrom2D: false,
+    navigationMode2D: false,
 
-    // TO IMPLEMENT
+    /** api: config[navigationMode3D]
+     *  This mode will synchronize the lookAt of the of the Google Earth Instance with the center of the 2D map
+     *  This requires a map.
+     */
     navigationMode3D: false,
 
     /** api: config[clickMode]
@@ -253,9 +254,9 @@
         this.manageLayers();
 
         // Set the 2D navigation tool
+        this.setShow2DNavigationTool(this.show2DNavigationTool);
+        this.setClickMode(this.clickMode);
         this.setNavigationMode2D(this.navigationMode2D);
-        this.setClickMode(this.clickMode);
-        this.setNavigationModeFrom2D(this.navigationModeFrom2D);
 
         // Downloads KML
         if (this.kmlUrl) {
@@ -265,7 +266,7 @@
         }
 
         if (this.layers) {
-            for (i = 0; i< this.layers.length; i++) {
+            for (i = 0; i < this.layers.length; i++) {
                 var layer = this.layers[i];
                 this.addLayer(layer);
                 layer.events.on({
@@ -337,8 +338,8 @@
         }
     },
 
-    setNavigationMode2D: function(state) {
-        this.navigationMode2D = state;
+    setShow2DNavigationTool: function(state) {
+        this.show2DNavigationTool = state;
         if (state) {
             if (this.map) {
                 // Vector layer
@@ -388,7 +389,7 @@
                 this.map.addControl(this.drag);
                 this.drag.activate();
             } else {
-                this.navigationMode2D = false;
+                this.show2DNavigationTool = false;
             }
         }
         else {
@@ -401,13 +402,13 @@
                     this.features = null;
                 }
             } else {
-                this.navigationMode2D = false;
+                this.show2DNavigationTool = false;
             }
         }
     },
 
-    getNavigationMode2D: function() {
-        return this.navigationMode2D;
+    getshow2DNavigationTool: function() {
+        return this.show2DNavigationTool;
     },
 
     setClickMode: function(state) {
@@ -441,8 +442,8 @@
         return this.clickMode;
     },
 
-    setNavigationModeFrom2D: function(state) {
-        this.navigationModeFrom2D = state;
+    setNavigationMode2D: function(state) {
+        this.navigationMode2D = state;
         if (state) {
             if (this.map) {
                 this.map.events.on({
@@ -450,7 +451,7 @@
                     scope: this
                 });
             } else {
-                this.navigationModeFrom2D = false;
+                this.navigationMode2D = false;
             }
         } else {
             if (this.map) {
@@ -459,13 +460,13 @@
                     scope: this
                 });
             } else {
-                this.navigationModeFrom2D = false;
+                this.navigationMode2D = false;
             }
         }
     },
 
-    getNavigationModeFrom2D: function() {
-        return this.navigationModeFrom2D;
+    getNavigationMode2D: function() {
+        return this.navigationMode2D;
     },
 
     /*
@@ -590,8 +591,8 @@
         permalink = permalink + "&geshowRoadsLayer=" + this.showRoadsLayer;
         permalink = permalink + "&geshowBuildingsLayer=" + this.showBuildingsLayer;
         permalink = permalink + "&geshowBuildingsLowResolutionLayer=" + this.showBuildingsLowResolutionLayer;
+        permalink = permalink + "&geshow2DNavigationTool=" + this.show2DNavigationTool;
         permalink = permalink + "&genavigationMode2D=" + this.navigationMode2D;
-        permalink = permalink + "&genavigationModeFrom2D=" + this.navigationModeFrom2D;
         permalink = permalink + "&genavigationMode3D=" + this.navigationMode3D;
         permalink = permalink + "&geclickMode=" + this.clickMode;
         if (this.map) {
@@ -648,12 +649,12 @@
         if (parameters.geshowBuildingsLowResolutionLayer) {
             this.showBuildingsLowResolutionLayer = this.stringToBoolean(parameters.geshowBuildingsLowResolutionLayer);
         }
+        if (parameters.geshow2DNavigationTool) {
+            this.show2DNavigationTool = this.stringToBoolean(parameters.geshow2DNavigationTool);
+        }
         if (parameters.genavigationMode2D) {
             this.navigationMode2D = this.stringToBoolean(parameters.genavigationMode2D);
         }
-        if (parameters.genavigationModeFrom2D) {
-            this.navigationModeFrom2D = this.stringToBoolean(parameters.genavigationModeFrom2D);
-        }
         if (parameters.genavigationMode3D) {
             this.navigationMode3D = this.stringToBoolean(parameters.genavigationMode3D);
         }
@@ -684,9 +685,9 @@
     },
 
     beforeDestroy: function() {
+        this.setShow2DNavigationTool(false);
+        this.setClickMode(false);
         this.setNavigationMode2D(false);
-        this.setClickMode(false);
-        this.setNavigationModeFrom2D(false);
         google.earth.removeEventListener(this.ge, "frameend", function() {
             self.onFrameEnd();
         });
@@ -714,9 +715,13 @@
         this.heading = lookAt.getHeading();
         this.altitude = lookAt.getAltitude();
         this.altitudeMode = lookAt.getAltitudeMode();
-        if (this.map && this.navigationMode2D) {
-            this.refreshMap();
+        if (this.map && this.show2DNavigationTool) {
+            this.refreshNavigation2DTool();
         }
+        if (this.map && this.navigationMode3D) {
+            this.transformFromGE(this.lookAt);
+            this.map.setCenter(this.lookAt);
+        }
     },
 
     /**
@@ -772,21 +777,34 @@
         this.ge.getView().setAbstractView(lookAt);
     },
 
+    // Get the Camera Position as ''OpenLayers.LonLat'' in Google Earth Coordinate System
+    getCameraPosition: function() {
+        if (this.ge) {
+            var camera = this.ge.getView().copyAsCamera(this.altitudeMode);
+            return new OpenLayers.LonLat(camera.getLongitude(), camera.getLatitude());
+        }
+    },
+    // Get the LookAt Position as ''OpenLayers.LonLat'' in Google Earth Coordinate System
+    getLookAtPosition: function() {
+        if (this.ge) {
+            var lookAt = this.ge.getView().copyAsLookAt(this.altitudeMode);
+            return new OpenLayers.LonLat(lookAt.getLongitude(), lookAt.getLatitude());
+        }
+    },
+
     /**
-     * Function refreshMap
-     * Refreshes camera and lookAt drawings in 2D map
+     * Function refreshNavigation2DTool
+     * Refreshes navigation tool in 2D map
      */
-    refreshMap: function() {
+    refreshNavigation2DTool: function() {
         if (!this.ge) {
             return;
         }
 
-        // Gets current camera ans lookAt positions
-        var lookAt = this.ge.getView().copyAsLookAt(this.altitudeMode);
-        var pl = new OpenLayers.LonLat(lookAt.getLongitude(), lookAt.getLatitude());
+        // Gets current camera and lookAt positions
+        var pl = this.getLookAtPosition();
         this.transformFromGE(pl);
-        var camera = this.ge.getView().copyAsCamera(this.altitudeMode);
-        var pc = new OpenLayers.LonLat(camera.getLongitude(), camera.getLatitude());
+        var pc = this.getCameraPosition();
         this.transformFromGE(pc);
 
         // Refresh map only if camera has moved



More information about the Commits mailing list