[Commits] r1601 - in sandbox/cmoullet/ux/RoutingPanel: examples ux/widgets
commits at geoext.org
commits at geoext.org
Mon Dec 21 23:51:03 CET 2009
Author: cmoullet
Date: 2009-12-21 23:51:02 +0100 (Mon, 21 Dec 2009)
New Revision: 1601
Modified:
sandbox/cmoullet/ux/RoutingPanel/examples/RoutingPanelExample.html
sandbox/cmoullet/ux/RoutingPanel/examples/RoutingPanelExample.js
sandbox/cmoullet/ux/RoutingPanel/ux/widgets/RoutingPanel.js
Log:
Add geonames search, as alternative
Provide minimal result feedback
Modified: sandbox/cmoullet/ux/RoutingPanel/examples/RoutingPanelExample.html
===================================================================
--- sandbox/cmoullet/ux/RoutingPanel/examples/RoutingPanelExample.html 2009-12-21 12:24:22 UTC (rev 1600)
+++ sandbox/cmoullet/ux/RoutingPanel/examples/RoutingPanelExample.html 2009-12-21 22:51:02 UTC (rev 1601)
@@ -6,6 +6,7 @@
<link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-2.2.1/examples/shared/examples.css"/>
<script type="text/javascript" src="http://openlayers.org/api/2.8/OpenLayers.js"></script>
<script type="text/javascript" src="../../../trunk/geoext/lib/GeoExt.js"></script>
+ <script type="text/javascript" src="http://svn.geoext.org/ux/GeoNamesSearchCombo/ux/widgets/form/GeoNamesSearchCombo.js"></script>
<script type="text/javascript" src="../ux/widgets/RoutingPanel.js"></script>
<script type="text/javascript" src="RoutingPanelExample.js"></script>
</head>
Modified: sandbox/cmoullet/ux/RoutingPanel/examples/RoutingPanelExample.js
===================================================================
--- sandbox/cmoullet/ux/RoutingPanel/examples/RoutingPanelExample.js 2009-12-21 12:24:22 UTC (rev 1600)
+++ sandbox/cmoullet/ux/RoutingPanel/examples/RoutingPanelExample.js 2009-12-21 22:51:02 UTC (rev 1601)
@@ -46,7 +46,7 @@
{
layout:'accordion',
region: "west",
- width: 300,
+ width: 350,
items: [
{
id: "routingpanel",
@@ -85,7 +85,8 @@
map: map,
// Key for dev.geoext.org: 187a9f341f70406a8064d07a30e5695c
// Key for localhost: BC9A493B41014CAABB98F0471D759707
- cloudmadeKey: '187a9f341f70406a8064d07a30e5695c'
+ cloudmadeKey: '187a9f341f70406a8064d07a30e5695c',
+ geocodingType: 'geonames'
};
treePanel = Ext.getCmp("treepanel");
treePanel.add(treePanelItem);
Modified: sandbox/cmoullet/ux/RoutingPanel/ux/widgets/RoutingPanel.js
===================================================================
--- sandbox/cmoullet/ux/RoutingPanel/ux/widgets/RoutingPanel.js 2009-12-21 12:24:22 UTC (rev 1600)
+++ sandbox/cmoullet/ux/RoutingPanel/ux/widgets/RoutingPanel.js 2009-12-21 22:51:02 UTC (rev 1601)
@@ -32,10 +32,12 @@
routingStartFeature: null,
routingEndFeature: null,
routingPointDrawControl: null,
+ routingResultPanel: null,
cloudmadeKey: null,
statusLabel: null,
+ // cloudmade or geonames
geocodingType: 'cloudmade',
geocodingQueryParam: 'query',
geocodingMaxRows: 20,
@@ -158,6 +160,44 @@
});
}
+ this.routingResultPanel = new Ext.Panel({
+ border: false,
+ html: '',
+ bodyStyle: 'padding:5px 5px 5px 5px;'
+ });
+
+ if (this.geocodingType == 'geonames') {
+ this.startLocationCombo = new GeoExt.ux.form.GeoNamesSearchCombo({
+ fieldLabel: OpenLayers.i18n('A'),
+ map: this.map,
+ zoom: 13
+ });
+ this.startLocationCombo.on(
+ "select", function(combo, record, index) {
+ if (this.routingStartFeature) {
+ this.routingLayer.removeFeatures([this.routingStartFeature]);
+ }
+ this.startLocationCombo.locationString = record.data.lat + ',' + record.data.lng;
+ }, this
+ );
+
+
+ this.endLocationCombo = new GeoExt.ux.form.GeoNamesSearchCombo({
+ fieldLabel: OpenLayers.i18n('B'),
+ map: this.map,
+ zoom: 13
+ });
+ this.endLocationCombo.on("select", function(combo, record, index) {
+ if (this.routingEndFeature) {
+ this.routingLayer.removeFeatures([this.routingEndFeature]);
+ }
+ this.endLocationCombo.locationString = record.data.lat + ',' + record.data.lng;
+ }, this);
+ }
+
+ this.startLocationCombo.locationString = '47.25976,9.58423';
+ this.endLocationCombo.locationString = '47.26117,9.59882';
+
this.items = [
{
layout: 'form',
@@ -170,11 +210,12 @@
defaults:{
layout:'form',
border:false,
- labelWidth: 10
+ labelWidth: 10,
+ bodyStyle:'padding:5px 0px 0px 5px'
},
items:[
{
- columnWidth:0.8,
+ columnWidth:0.75,
defaults:{
anchor:'100%'
},
@@ -183,11 +224,11 @@
]
},
{
- columnWidth:0.2,
+ columnWidth:0.25,
items: [
{
xtype:'button',
- text: OpenLayers.i18n('Get'),
+ text: OpenLayers.i18n('Get Point'),
handler: function(button, event) {
this.routingPointDrawControl.type = 'GetStartPoint';
this.routingPointDrawControl.activate();
@@ -204,11 +245,12 @@
defaults:{
layout:'form',
border:false,
- labelWidth: 10
+ labelWidth: 10,
+ bodyStyle:'padding:0px 0px 0px 5px;'
},
items:[
{
- columnWidth:0.8,
+ columnWidth:0.75,
defaults:{
anchor:'100%'
},
@@ -217,11 +259,11 @@
]
},
{
- columnWidth:0.2,
+ columnWidth:0.25,
items: [
{
xtype:'button',
- text: OpenLayers.i18n('Get'),
+ text: OpenLayers.i18n('Get Point'),
handler: function(button, event) {
this.routingPointDrawControl.type = 'GetEndPoint';
this.routingPointDrawControl.activate();
@@ -233,20 +275,38 @@
]
}
]
- }
- ];
+ },
+ {
+ layout: 'column',
+ border: false,
+ items: [
+ {
+ columnWidth: 1,
+ border: false,
+ bodyCfg: {tag:'center'},
+ items: [
+ {
+ xtype:'button',
+ text: OpenLayers.i18n('Compute itinerary'),
+ handler: function() {
+ this.getItinerary();
+ },
+ scope: this
+ }
+ ]
+ }
+ ]
- this.buttons = [
+ },
{
- text: OpenLayers.i18n('Itinerary'),
- handler: function() {
- this.getItinerary();
- },
- scope: this
+ border: false,
+ items: [
+ this.routingResultPanel
+ ]
}
+
];
-
GeoExt.ux.RoutingPanel.superclass.initComponent.call(this);
},
@@ -258,34 +318,41 @@
//http://routes.cloudmade.com/BC9A493B41014CAABB98F0471D759707/api/0.3/47.25976,9.58423,47.26117,9.59882/car/shortest.js
this.proxy.on(
'beforeload', function() {
+ this.routingResultPanel.html = OpenLayers.i18n('Computation ongoing....');
+ this.routingResultPanel.body.update(this.routingResultPanel.html);
var newUrl = this.startLocationCombo.locationString + ',' + this.endLocationCombo.locationString;
newUrl = newUrl + "/car/shortest.js?lang=" + this.lang;
this.proxy.url = "http://routes.cloudmade.com/" + this.cloudmadeKey + "/api/0.3/" + newUrl;
- }, this)
+ }, this);
this.routingLayer = new OpenLayers.Layer.Vector("Routing", {styleMap: this.vectorStyle});
this.map.addLayer(this.routingLayer);
this.routingPointDrawControl = new OpenLayers.Control.DrawFeature(this.routingLayer, OpenLayers.Handler.Point);
this.map.addControl(this.routingPointDrawControl);
this.routingPointDrawControl.events.on({ "featureadded": function(events) {
+ var featureLocation = null;
if (this.routingPointDrawControl.type == 'GetStartPoint') {
if (this.routingStartFeature) {
this.routingLayer.removeFeatures([this.routingStartFeature]);
+ this.routingStartFeature = null;
}
this.routingStartFeature = events.feature;
- var featureLocation = this.routingStartFeature.geometry;
+ featureLocation = this.routingStartFeature.geometry.clone();
featureLocation.transform(this.map.getProjectionObject(), this.routingProjection);
this.startLocationCombo.locationString = featureLocation.y + ',' + featureLocation.x;
- this.startLocationCombo.setValue(OpenLayers.i18n('Position: ') + featureLocation.y + ',' + featureLocation.x);
+ this.startLocationCombo.emptyText = OpenLayers.i18n('Position: ') + Math.round(featureLocation.y * 100000) / 100000 + ',' + Math.round(featureLocation.x * 100000) / 100000;
+ this.startLocationCombo.clearValue();
}
if (this.routingPointDrawControl.type == 'GetEndPoint') {
if (this.routingEndFeature) {
this.routingLayer.removeFeatures([this.routingEndFeature]);
+ this.routingEndFeature = null;
}
this.routingEndFeature = events.feature;
- var featureLocation = this.routingEndFeature.geometry;
+ featureLocation = this.routingEndFeature.geometry.clone();
featureLocation.transform(this.map.getProjectionObject(), this.routingProjection);
this.endLocationCombo.locationString = featureLocation.y + ',' + featureLocation.x;
- this.endLocationCombo.setValue(OpenLayers.i18n('Position: ') + featureLocation.y + ',' + featureLocation.x);
+ this.endLocationCombo.emptyText = OpenLayers.i18n('Position: ') + Math.round(featureLocation.y * 100000) / 100000 + ',' + Math.round(featureLocation.x * 100000) / 100000;
+ this.endLocationCombo.clearValue();
}
this.routingPointDrawControl.deactivate();
},
@@ -297,7 +364,7 @@
this.routingStore = new Ext.data.Store({
proxy: this.proxy,
reader: new Ext.data.JsonReader({
- root: 'route_summary',
+ root: 'version',
fields: [
{
name: 'total_length'
@@ -325,8 +392,11 @@
}
if (this.routingStatus == '0') {
this.drawRoute();
+ this.routingResultPanel.html = OpenLayers.i18n('Total length: ') + Math.round(this.routingRouteSummary.total_distance/1000) + ' [km]';
+ this.routingResultPanel.body.update(this.routingResultPanel.html);
} else {
- alert('No route found');
+ this.routingResultPanel.html = this.routingStatusMessage;
+ this.routingResultPanel.body.update(this.routingResultPanel.html);
}
}, this
);
More information about the Commits
mailing list