[Commits] r1549 - sandbox/cmoullet/ux/GoogleEarthPanel/ux/widgets
commits at geoext.org
commits at geoext.org
Fri Dec 4 07:19:43 CET 2009
Author: cmoullet
Date: 2009-12-04 07:19:43 +0100 (Fri, 04 Dec 2009)
New Revision: 1549
Modified:
sandbox/cmoullet/ux/GoogleEarthPanel/ux/widgets/GoogleEarthPanel.js
Log:
Huge refactoring to expose get/set methods
Modified: sandbox/cmoullet/ux/GoogleEarthPanel/ux/widgets/GoogleEarthPanel.js
===================================================================
--- sandbox/cmoullet/ux/GoogleEarthPanel/ux/widgets/GoogleEarthPanel.js 2009-12-04 00:23:43 UTC (rev 1548)
+++ sandbox/cmoullet/ux/GoogleEarthPanel/ux/widgets/GoogleEarthPanel.js 2009-12-04 06:19:43 UTC (rev 1549)
@@ -23,10 +23,10 @@
*/
ge: null,
- /** private: property[ge]
- * Google earth instance
+ /** private: property[geProjection]
+ * Google earth projection
*/
- geProperties: {},
+ geProjection: new OpenLayers.Projection("EPSG:4326"),
/** api: config[showBordersLayer]
*
@@ -50,16 +50,16 @@
showBuildingsLowResolutionLayer: false,
// Show the 2D navigator in the map
- navigationMode2D: true,
+ navigationMode2D: false,
// Move Google Earth when 2D map is moved
- navigationModeFrom2D: false,
+ navigationModeFrom2D: true,
// Check that the targer and camera points are always in the map: not implemented
navigationMode3D: false,
// Click in the map to set the camera point: not implemented
- clickMode: true,
+ clickMode: false,
/** property[earthAvailable]
* Defines if Google Earth is available
@@ -82,6 +82,14 @@
*/
altitude: 100,
+ /** api: config[altitudeMode]
+ * Initial altitude mode (default: 1 ALTITUDE_RELATIVE_TO_GROUND)
+ */
+ /** private: property[altitudeMode]
+ * Initial altitude mode
+ */
+ altitudeMode: 1,
+
/** api: config[heading]
* Initial heading in degrees (default: 0)
*/
@@ -119,6 +127,7 @@
border: true
};
Ext.applyIf(this, defConfig);
+
GeoExt.ux.GoogleEarthPanel.superclass.initComponent.call(this);
},
@@ -136,6 +145,7 @@
}
},
+ // Set the lookAt position of the Google Earth Plug-in
setLookAt: function (lat, lon, altitude, altitudeMode, heading, tilt, range) {
if (this.ge) {
var lookAt = this.ge.createLookAt('');
@@ -156,8 +166,6 @@
// Set Google Earth Properties
this.ge.getWindow().setVisibility(true);
- this.geProperties.geProjection = new OpenLayers.Projection("EPSG:4326");
- this.altitudeMode = this.ge.ALTITUDE_RELATIVE_TO_GROUND;
this.setLookAt(this.lookAt.lat,
this.lookAt.lon,
this.altitude,
@@ -167,77 +175,13 @@
this.range);
this.ge.getNavigationControl().setVisibility(this.ge.VISIBILITY_SHOW);
this.ge.getOptions().setFlyToSpeed(this.ge.SPEED_TELEPORT);
- this.showGeLayers();
+ this.manageLayers();
// Set the 2D navigation tool
- if (this.map && this.navigationMode2D) {
- // Vector layer
- this.earthLayer = new OpenLayers.Layer.Vector("earthLayer");
- this.map.addLayer(this.earthLayer);
+ this.setNavigationMode2D(this.navigationMode2D);
+ this.setClickMode(this.clickMode);
+ this.setNavigationModeFrom2D(this.navigationModeFrom2D);
- // Camera and lookAt points to display
- this.features = [
- new OpenLayers.Feature.Vector(null, {role: 'line'}, {strokeColor: '#ff0000',
- strokeWidth: 3,
- pointRadius: 6}),
- new OpenLayers.Feature.Vector(null, {role: 'lookAt'}, {pointRadius: 8,
- fillColor: '#ff0000'}),
- new OpenLayers.Feature.Vector(null, {role: 'camera'}, {externalGraphic: '../resources/eye.png',
- graphicHeight: 18,
- graphicWidth: 31,
- graphicYOffset: -3,
- rotation: 0})];
-
- // Drag control to move camera ans lookAt points
- this.drag = new OpenLayers.Control.DragFeature(this.earthLayer, {
- earth: this,
- downFeature: function(pixel) {
- this.lastPixel = pixel;
- this.firstPixel = pixel;
- this.firstGeom = this.feature.geometry;
- },
- moveFeature: function(pixel) {
- if (this.feature === null) {
- return;
- }
- if (this.feature.attributes.role != 'line') {
- var res = this.map.getResolution();
- var x = res * (pixel.x - this.firstPixel.x) + this.firstGeom.x;
- var y = res * (this.firstPixel.y - pixel.y) + this.firstGeom.y;
- var lonLat = new OpenLayers.LonLat(x, y);
-
- if (this.feature.attributes.role == 'lookAt') {
- this.earth.lookTo(lonLat);
- } else if (this.feature.attributes.role == 'camera') {
- this.earth.lookFrom(lonLat);
- }
- }
- this.lastPixel = pixel;
- }
- });
- this.map.addControl(this.drag);
- this.drag.activate();
- }
-
- if (this.map && this.clickMode) {
- this.clickControl = new GeoExt.ux.GoogleEarthClick({
- handlerOptions: {
- "single": true
- },
- gePanel: this
- });
- this.map.addControl(this.clickControl);
- this.clickControl.activate();
- }
-
- // Refreshes GE on map move
- if (this.map && this.navigationModeFrom2D) {
- this.map.events.on({
- moveend: this.onMoveEnd,
- scope: this
- });
- }
-
// Downloads KML
if (this.kmlUrl) {
google.earth.fetchKml(this.ge, this.kmlUrl, function(obj) {
@@ -255,34 +199,223 @@
failureCallback: function(object) {
this.earthAvailable = false;
},
+
+ setNavigationMode2D: function(state) {
+ this.navigationMode2D = state;
+ if (state) {
+ if (this.map) {
+ // Vector layer
+ this.earthLayer = new OpenLayers.Layer.Vector("earthLayer");
+ this.map.addLayer(this.earthLayer);
+
+ // Camera and lookAt points to display
+ this.features = [
+ new OpenLayers.Feature.Vector(null, {role: 'line'}, {strokeColor: '#ff0000',
+ strokeWidth: 3,
+ pointRadius: 6}),
+ new OpenLayers.Feature.Vector(null, {role: 'lookAt'}, {pointRadius: 8,
+ fillColor: '#ff0000'}),
+ new OpenLayers.Feature.Vector(null, {role: 'camera'}, {externalGraphic: '../resources/eye.png',
+ graphicHeight: 18,
+ graphicWidth: 31,
+ graphicYOffset: -3,
+ rotation: 0})];
+
+ // Drag control to move camera ans lookAt points
+ this.drag = new OpenLayers.Control.DragFeature(this.earthLayer, {
+ earth: this,
+ downFeature: function(pixel) {
+ this.lastPixel = pixel;
+ this.firstPixel = pixel;
+ this.firstGeom = this.feature.geometry;
+ },
+ moveFeature: function(pixel) {
+ if (this.feature === null) {
+ return;
+ }
+ if (this.feature.attributes.role != 'line') {
+ var res = this.map.getResolution();
+ var x = res * (pixel.x - this.firstPixel.x) + this.firstGeom.x;
+ var y = res * (this.firstPixel.y - pixel.y) + this.firstGeom.y;
+ var lonLat = new OpenLayers.LonLat(x, y);
+
+ if (this.feature.attributes.role == 'lookAt') {
+ this.earth.lookTo(lonLat);
+ } else if (this.feature.attributes.role == 'camera') {
+ this.earth.lookFrom(lonLat);
+ }
+ }
+ this.lastPixel = pixel;
+ }
+ });
+ this.map.addControl(this.drag);
+ this.drag.activate();
+ } else {
+ this.navigationMode2D = false;
+ }
+ }
+ else {
+ if (this.map) {
+ if (this.drag) {
+ this.drag.deactivate();
+ this.map.removeControl(this.drag);
+ this.map.removeLayer(this.earthLayer);
+ this.earthLayer.destroy();
+ this.features = null;
+ }
+ } else {
+ this.navigationMode2D = false;
+ }
+ }
+ },
+
+ getNavigationMode2D: function() {
+ return this.navigationMode2D;
+ },
+
+ setClickMode: function(state) {
+ this.clickMode = state;
+ if (state) {
+ if (this.map) {
+ this.clickControl = new GeoExt.ux.GoogleEarthClick({
+ handlerOptions: {
+ "single": true
+ },
+ gePanel: this
+ });
+ this.map.addControl(this.clickControl);
+ this.clickControl.activate();
+ } else {
+ this.clickMode = false;
+ }
+ } else {
+ if (this.map) {
+ if (this.clickControl) {
+ this.clickControl.deactivate();
+ this.map.removeControl(this.clickControl);
+ }
+ } else {
+ this.clickMode = false;
+ }
+ }
+ },
+
+ getClickMode: function() {
+ return this.clickMode;
+ },
+
+ setNavigationModeFrom2D: function(state) {
+ this.navigationModeFrom2D = state;
+ if (state) {
+ if (this.map) {
+ this.map.events.on({
+ moveend: this.onMoveEnd,
+ scope: this
+ });
+ } else {
+ this.navigationModeFrom2D = false;
+ }
+ } else {
+ if (this.map) {
+ this.map.events.un({
+ move: this.onMoveEnd,
+ scope: this
+ });
+ } else {
+ this.navigationModeFrom2D = false;
+ }
+ }
+ },
+
+ getNavigationModeFrom2D: function() {
+ return this.navigationModeFrom2D;
+ },
+
/*
* Define which Google Earth Layers are shown
*/
- showGeLayers: function() {
- if (this.showBuildingsLayer) {
+ manageLayers: function() {
+ if (this.ge) {
+ this.setBuildingsLayer(this.showBuildingsLayer);
+ this.setBordersLayer(this.showBordersLayer);
+ this.setTerrainLayer(this.showTerrainLayer);
+ this.setRoadsLayer(this.showRoadsLayer);
+ this.setBuildingsLowResolutionLayer(this.showBuildingsLowResolutionLayer);
+ }
+ },
+
+ setBuildingsLayer: function(state) {
+ this.showBuildingsLayer = state;
+ if (state) {
this.ge.getLayerRoot().enableLayerById(this.ge.LAYER_BUILDINGS, true);
+ } else {
+ this.ge.getLayerRoot().enableLayerById(this.ge.LAYER_BUILDINGS, false);
}
- if (this.showBordersLayer) {
+ },
+
+ getBuildingsLayer: function() {
+ return this.showBuildingsLayer;
+ },
+
+ setBordersLayer: function(state) {
+ this.showBordersLayer = state;
+ if (state) {
this.ge.getLayerRoot().enableLayerById(this.ge.LAYER_BORDERS, true);
+ } else {
+ this.ge.getLayerRoot().enableLayerById(this.ge.LAYER_BORDERS, false);
}
- if (this.showTerrainLayer) {
+ },
+
+ getBordersLayer: function() {
+ return this.showBordersLayer;
+ },
+
+ setTerrainLayer: function(state) {
+ this.showTerrainLayer = state;
+ if (state) {
this.ge.getLayerRoot().enableLayerById(this.ge.LAYER_TERRAIN, true);
+ } else {
+ this.ge.getLayerRoot().enableLayerById(this.ge.LAYER_TERRAIN, false);
}
- if (this.showRoadsLayer) {
+ },
+
+ getTerrainLayer: function() {
+ return this.showTerrainLayer;
+ },
+
+ setRoadsLayer: function(state) {
+ this.showRoadsLayer = state;
+ if (state) {
this.ge.getLayerRoot().enableLayerById(this.ge.LAYER_ROADS, true);
+ } else {
+ this.ge.getLayerRoot().enableLayerById(this.ge.LAYER_ROADS, false);
}
- if (this.showBuildingsLowResolutionLayer) {
+ },
+
+ getRoadsLayer: function() {
+ return this.showRoadsLayer;
+ },
+
+ setBuildingsLowResolutionLayer: function(state) {
+ this.showBuildingsLowResolutionLayer = state;
+ if (state) {
this.ge.getLayerRoot().enableLayerById(this.ge.LAYER_BUILDINGS_LOW_RESOLUTION, true);
+ } else {
+ this.ge.getLayerRoot().enableLayerById(this.ge.LAYER_BUILDINGS_LOW_RESOLUTION, false);
}
},
+ getBuildingsLowResolutionLayer: function() {
+ return this.showBuildingsLowResolutionLayer;
+ },
+
/**
* Function transformToGE
* Transforms a LonLat from map projection to GE projection
*/
transformToGE: function(lonLat) {
lonLat.transform(this.map.getProjectionObject(),
- this.geProperties.geProjection);
+ this.geProjection);
},
/**
@@ -290,7 +423,7 @@
* Transforms a LonLat from GE projection to map projection
*/
transformFromGE: function(geLonLat) {
- geLonLat.transform(this.geProperties.geProjection,
+ geLonLat.transform(this.geProjection,
this.map.getProjectionObject());
},
@@ -308,87 +441,87 @@
}
var lookAt = this.ge.getView().copyAsLookAt(this.altitudeMode);
- permalink = permalink + "lookAtLatitude=" + lookAt.getLatitude();
- permalink = permalink + "&lookAtLongitude=" + lookAt.getLongitude();
- permalink = permalink + "&range=" + lookAt.getRange();
- permalink = permalink + "&tilt=" + lookAt.getTilt();
- permalink = permalink + "&heading=" + lookAt.getHeading();
- permalink = permalink + "&altitude=" + lookAt.getAltitude();
- permalink = permalink + "&altitudeMode=" + lookAt.getAltitudeMode();
- permalink = permalink + "&showBordersLayer=" + this.showBordersLayer;
- permalink = permalink + "&showTerrainLayer=" + this.showTerrainLayer;
- permalink = permalink + "&showRoadsLayer=" + this.showRoadsLayer;
- permalink = permalink + "&showBuildingsLayer=" + this.showBuildingsLayer;
- permalink = permalink + "&showBuildingsLowResolutionLayer=" + this.showBuildingsLowResolutionLayer;
- permalink = permalink + "&navigationMode2D=" + this.navigationMode2D;
- permalink = permalink + "&navigationModeFrom2D=" + this.navigationModeFrom2D;
- permalink = permalink + "&navigationMode3D=" + this.navigationMode3D;
- permalink = permalink + "&clickMode=" + this.clickMode;
+ permalink = permalink + "gelookAtLatitude=" + lookAt.getLatitude();
+ permalink = permalink + "&gelookAtLongitude=" + lookAt.getLongitude();
+ permalink = permalink + "&gerange=" + lookAt.getRange();
+ permalink = permalink + "&getilt=" + lookAt.getTilt();
+ permalink = permalink + "&geheading=" + lookAt.getHeading();
+ permalink = permalink + "&gealtitude=" + lookAt.getAltitude();
+ permalink = permalink + "&gealtitudeMode=" + lookAt.getAltitudeMode();
+ permalink = permalink + "&geshowBordersLayer=" + this.showBordersLayer;
+ permalink = permalink + "&geshowTerrainLayer=" + this.showTerrainLayer;
+ permalink = permalink + "&geshowRoadsLayer=" + this.showRoadsLayer;
+ permalink = permalink + "&geshowBuildingsLayer=" + this.showBuildingsLayer;
+ permalink = permalink + "&geshowBuildingsLowResolutionLayer=" + this.showBuildingsLowResolutionLayer;
+ permalink = permalink + "&genavigationMode2D=" + this.navigationMode2D;
+ permalink = permalink + "&genavigationModeFrom2D=" + this.navigationModeFrom2D;
+ permalink = permalink + "&genavigationMode3D=" + this.navigationMode3D;
+ permalink = permalink + "&geclickMode=" + this.clickMode;
if (this.map) {
- permalink = permalink + "&easting=" + this.map.getCenter().lon;
- permalink = permalink + "&northing=" + this.map.getCenter().lat;
- permalink = permalink + "&zoom=" + this.map.getZoom();
+ permalink = permalink + "&geeasting=" + this.map.getCenter().lon;
+ permalink = permalink + "&genorthing=" + this.map.getCenter().lat;
+ permalink = permalink + "&gezoom=" + this.map.getZoom();
}
return permalink;
},
// Set the permalink
setPermalink: function(parameters) {
- if (parameters.easting && parameters.northing) {
- var position = new OpenLayers.LonLat(parseFloat(parameters.easting), parseFloat(parameters.northing));
+ if (parameters.geeasting && parameters.genorthing) {
+ var position = new OpenLayers.LonLat(parseFloat(parameters.geeasting), parseFloat(parameters.genorthing));
if (this.map) {
this.map.setCenter(position);
}
}
- if (parameters.zoom) {
+ if (parameters.gezoom) {
if (this.map) {
- this.map.zoomTo(parseInt(parameters.zoom, 10));
+ this.map.zoomTo(parseInt(parameters.gezoom, 10));
}
}
- if (parameters.lookAtLatitude && parameters.lookAtLongitude) {
- this.lookAt = new OpenLayers.LonLat(parseFloat(parameters.lookAtLongitude), parseFloat(parameters.lookAtLatitude));
+ if (parameters.gelookAtLatitude && parameters.gelookAtLongitude) {
+ this.lookAt = new OpenLayers.LonLat(parseFloat(parameters.gelookAtLongitude), parseFloat(parameters.gelookAtLatitude));
}
- if (parameters.altitude) {
- this.altitude = parseFloat(parameters.altitude);
+ if (parameters.gealtitude) {
+ this.altitude = parseFloat(parameters.gealtitude);
}
- if (parameters.heading) {
- this.heading = parseFloat(parameters.heading);
+ if (parameters.geheading) {
+ this.heading = parseFloat(parameters.geheading);
}
- if (parameters.tilt) {
- this.tilt = parseFloat(parameters.tilt);
+ if (parameters.getilt) {
+ this.tilt = parseFloat(parameters.getilt);
}
- if (parameters.range) {
- this.range = parseFloat(parameters.range);
+ if (parameters.gerange) {
+ this.range = parseFloat(parameters.gerange);
}
- if (parameters.altitudeMode) {
- this.altitudeMode = parseInt(parameters.altitudeMode, 10);
+ if (parameters.gealtitudeMode) {
+ this.altitudeMode = parseInt(parameters.gealtitudeMode, 10);
}
- if (parameters.showBordersLayer) {
- this.showBordersLayer = this.stringToBoolean(parameters.showBordersLayer);
+ if (parameters.geshowBordersLayer) {
+ this.showBordersLayer = this.stringToBoolean(parameters.geshowBordersLayer);
}
- if (parameters.showTerrainLayer) {
- this.showTerrainLayer = this.stringToBoolean(parameters.showTerrainLayer);
+ if (parameters.geshowTerrainLayer) {
+ this.showTerrainLayer = this.stringToBoolean(parameters.geshowTerrainLayer);
}
- if (parameters.showRoadsLayer) {
- this.showRoadsLayer = this.stringToBoolean(parameters.showRoadsLayer);
+ if (parameters.geshowRoadsLayer) {
+ this.showRoadsLayer = this.stringToBoolean(parameters.geshowRoadsLayer);
}
- if (parameters.showBuildingsLayer) {
- this.showBuildingsLayer = this.stringToBoolean(parameters.showBuildingsLayer);
+ if (parameters.geshowBuildingsLayer) {
+ this.showBuildingsLayer = this.stringToBoolean(parameters.geshowBuildingsLayer);
}
- if (parameters.showBuildingsLowResolutionLayer) {
- this.showBuildingsLowResolutionLayer = this.stringToBoolean(parameters.showBuildingsLowResolutionLayer);
+ if (parameters.geshowBuildingsLowResolutionLayer) {
+ this.showBuildingsLowResolutionLayer = this.stringToBoolean(parameters.geshowBuildingsLowResolutionLayer);
}
- if (parameters.navigationMode2D) {
- this.navigationMode2D = this.stringToBoolean(parameters.navigationMode2D);
+ if (parameters.genavigationMode2D) {
+ this.navigationMode2D = this.stringToBoolean(parameters.genavigationMode2D);
}
- if (parameters.navigationModeFrom2D) {
- this.navigationModeFrom2D = this.stringToBoolean(parameters.navigationModeFrom2D);
+ if (parameters.genavigationModeFrom2D) {
+ this.navigationModeFrom2D = this.stringToBoolean(parameters.genavigationModeFrom2D);
}
- if (parameters.navigationMode3D) {
- this.navigationMode3D = this.stringToBoolean(parameters.navigationMode3D);
+ if (parameters.genavigationMode3D) {
+ this.navigationMode3D = this.stringToBoolean(parameters.genavigationMode3D);
}
- if (parameters.clickMode) {
- this.clickMode = this.stringToBoolean(parameters.clickMode);
+ if (parameters.geclickMode) {
+ this.clickMode = this.stringToBoolean(parameters.geclickMode);
}
if (this.ge) {
google.earth.createInstance(this.body.dom, this.initCallback.createDelegate(this), this.failureCallback.createDelegate(this));
@@ -411,27 +544,10 @@
}
},
-
-
beforeDestroy: function() {
- //Delete object
- if (this.map && this.navigationMode2D) {
- this.drag.deactivate();
- this.map.removeControl(this.drag);
- this.map.removeLayer(this.earthLayer);
- this.earthLayer.destroy();
- this.features = null;
- }
- if (this.map && this.clickMode) {
- this.clickControl.deactivate();
- this.map.removeControl(this.clickControl);
- }
- if (this.map && this.navigationModeFrom2D) {
- this.map.events.un({
- move: this.onMoveEnd,
- scope: this
- });
- }
+ this.setNavigationMode2D(false);
+ this.setClickMode(false);
+ this.setNavigationModeFrom2D(false);
google.earth.removeEventListener(this.ge, "frameend", function() {
self.onFrameEnd();
});
More information about the Commits
mailing list