=== added file 'dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/images/measure.png' Binary files dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/images/measure.png 1970-01-01 00:00:00 +0000 and dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/images/measure.png 2011-05-19 12:31:31 +0000 differ === modified file 'dhis-2/dhis-web/dhis-web-mapping/src/main/resources/org/hisp/dhis/mapping/i18n_module.properties' --- dhis-2/dhis-web/dhis-web-mapping/src/main/resources/org/hisp/dhis/mapping/i18n_module.properties 2011-04-28 15:43:17 +0000 +++ dhis-2/dhis-web/dhis-web-mapping/src/main/resources/org/hisp/dhis/mapping/i18n_module.properties 2011-05-19 12:57:09 +0000 @@ -246,4 +246,5 @@ characters = characters geojson_file = GeoJSON file history = History -api_key = API key \ No newline at end of file +api_key = API key +measure_distance = Measure distance \ No newline at end of file === modified file 'dhis-2/dhis-web/dhis-web-mapping/src/main/webapp/dhis-web-mapping/i18n.vm' --- dhis-2/dhis-web/dhis-web-mapping/src/main/webapp/dhis-web-mapping/i18n.vm 2011-04-28 15:43:17 +0000 +++ dhis-2/dhis-web/dhis-web-mapping/src/main/webapp/dhis-web-mapping/i18n.vm 2011-05-19 12:57:09 +0000 @@ -248,5 +248,6 @@ characters: '$encoder.jsEscape($i18n.getString( 'characters' ) , "'")', geojson_file: '$encoder.jsEscape($i18n.getString( 'geojson_file' ) , "'")', history: '$encoder.jsEscape($i18n.getString( 'history' ) , "'")', - api_key: '$encoder.jsEscape($i18n.getString( 'api_key' ) , "'")' + api_key: '$encoder.jsEscape($i18n.getString( 'api_key' ) , "'")', + measure_distance: '$encoder.jsEscape($i18n.getString( 'measure_distance' ) , "'")' }; \ No newline at end of file === modified file 'dhis-2/dhis-web/dhis-web-mapping/src/main/webapp/dhis-web-mapping/mapping/css/style.css' --- dhis-2/dhis-web/dhis-web-mapping/src/main/webapp/dhis-web-mapping/mapping/css/style.css 2011-05-16 15:25:26 +0000 +++ dhis-2/dhis-web/dhis-web-mapping/src/main/webapp/dhis-web-mapping/mapping/css/style.css 2011-05-19 12:31:31 +0000 @@ -68,6 +68,9 @@ .x-date-inner .x-date-today a { border-color:#999999; } +.x-border-layout-ct { + background-color: #fcfcfc; +} /* OpenLayers (include in lib) */ /* @@ -235,6 +238,9 @@ .x-btn .icon-labels { background-image:url('../../../images/labels.png'); } +.x-btn .icon-measure { + background-image:url('../../../images/measure.png'); +} .x-btn-noicon .x-btn-small .x-btn-text { height:16px; padding:0 5px; @@ -328,6 +334,12 @@ font:bold 11px arial; color:#111; } +#window-measure-title { + padding:0 0 3px 21px; + background:url('../../../images/measure.png') no-repeat 0 0 transparent; + font:bold 11px arial; + color:#111; +} /* Ext Panel */ .panel-title { @@ -436,3 +448,7 @@ -moz-border-radius-topright: 2px; -webkit-border-top-right-radius: 2px; } +#measureDistanceDiv { + padding:0 0 0 5px; + color:#222222; +} === modified file 'dhis-2/dhis-web/dhis-web-mapping/src/main/webapp/dhis-web-mapping/mapping/javascript/global.js' --- dhis-2/dhis-web/dhis-web-mapping/src/main/webapp/dhis-web-mapping/mapping/javascript/global.js 2011-04-12 17:22:06 +0000 +++ dhis-2/dhis-web/dhis-web-mapping/src/main/webapp/dhis-web-mapping/mapping/javascript/global.js 2011-05-19 13:25:14 +0000 @@ -85,7 +85,34 @@ defaultLayerOpacity: 0.8, - defaultLayerZIndex: 10000 + defaultLayerZIndex: 10000, + +// Measure + + sketchSymbolizers: { + "Point": { + pointRadius: 4, + graphicName: "square", + fillColor: "white", + fillOpacity: 1, + strokeWidth: 1, + strokeOpacity: 1, + strokeColor: "#333333" + }, + "Line": { + strokeWidth: 2, + strokeOpacity: 1, + strokeColor: "#444444", + strokeDashstyle: "dash" + }, + "Polygon": { + strokeWidth: 2, + strokeOpacity: 1, + strokeColor: "#666666", + fillColor: "white", + fillOpacity: 0.3 + } + } }; G.util = { @@ -161,7 +188,7 @@ return tmp.indexOf(dec_sep) > -1 ? tmp.length-tmp.indexOf(dec_sep) - 1 : 0; }, - labels: { + labels: { getActivatedOpenLayersStyleMap: function(fsize, fweight, fstyle, fcolor) { return new OpenLayers.StyleMap({ 'default' : new OpenLayers.Style( @@ -222,6 +249,20 @@ widget.applyValues(); } }, + + measureDistance: { + getMeasureStyleMap: function() { + var style = new OpenLayers.Style(); + style.addRules([new OpenLayers.Rule({symbolizer: G.conf.sketchSymbolizers})]); + return new OpenLayers.StyleMap({"default": style}); + }, + + handleMeasurements: function(e) { + if (e.measure) { + document.getElementById('measureDistanceDiv').innerHTML = e.measure.toFixed(2) + ' ' + e.units; + } + } + }, sortByValue: function(a,b) { return b.value-a.value; === modified file 'dhis-2/dhis-web/dhis-web-mapping/src/main/webapp/dhis-web-mapping/mapping/javascript/index.js' --- dhis-2/dhis-web/dhis-web-mapping/src/main/webapp/dhis-web-mapping/mapping/javascript/index.js 2011-05-19 08:48:09 +0000 +++ dhis-2/dhis-web/dhis-web-mapping/src/main/webapp/dhis-web-mapping/mapping/javascript/index.js 2011-05-19 13:25:14 +0000 @@ -2496,7 +2496,7 @@ iconCls: 'icon-zoomout', tooltip: G.i18n.zoom_out, style: 'margin-top:1px', - handler:function() { + handler: function() { G.vars.map.zoomOut(); } }); @@ -2517,7 +2517,7 @@ } } } - }); + }); var viewHistoryButton = new Ext.Button({ id: 'viewhistory_b', @@ -2614,6 +2614,27 @@ } }); + var predefinedMapLegendSetButton = new Ext.Button({ + iconCls: 'icon-predefinedlegendset', + tooltip: G.i18n.predefined_legend_sets, + disabled: !G.user.isAdmin, + style: 'margin-top:1px', + handler: function() { + if (!predefinedMapLegendSetWindow.hidden) { + predefinedMapLegendSetWindow.hide(); + } + else { + var x = Ext.getCmp('center').x + G.conf.window_position_x; + var y = Ext.getCmp('center').y + G.conf.window_position_y; + predefinedMapLegendSetWindow.setPosition(x,y); + predefinedMapLegendSetWindow.show(); + if (!G.stores.predefinedMapLegend.isLoaded) { + G.stores.predefinedMapLegend.load(); + } + } + } + }); + var exportImageButton = new Ext.Button({ iconCls: 'icon-image', tooltip: G.i18n.export_map_as_image, @@ -2635,34 +2656,62 @@ } } }); - - var predefinedMapLegendSetButton = new Ext.Button({ - iconCls: 'icon-predefinedlegendset', - tooltip: G.i18n.predefined_legend_sets, - disabled: !G.user.isAdmin, + + var measureDistanceButton = new Ext.Button({ + iconCls: 'icon-measure', + tooltip: G.i18n.measure_distance, style: 'margin-top:1px', - handler: function() { - if (!predefinedMapLegendSetWindow.hidden) { - predefinedMapLegendSetWindow.hide(); - } - else { - var x = Ext.getCmp('center').x + G.conf.window_position_x; - var y = Ext.getCmp('center').y + G.conf.window_position_y; - predefinedMapLegendSetWindow.setPosition(x,y); - predefinedMapLegendSetWindow.show(); - if (!G.stores.predefinedMapLegend.isLoaded) { - G.stores.predefinedMapLegend.load(); + handler: function() { + var control = G.vars.map.getControl('measuredistance'); + + if (!control.active) { + control.activate(); + + if (!control.window) { + control.window = new Ext.Window({ + title: '' + G.i18n.measure_distance + '', + layout: 'fit', + closeAction: 'hide', + width: 150, + height: 90, + items: [ + { + xtype: 'panel', + layout: 'anchor', + bodyStyle: 'padding:8px', + items: [ + {html: '
Total distance
'}, + {html: '
'} + ] + } + ], + listeners: { + 'hide': function() { + G.vars.map.getControl('measuredistance').deactivate(); + } + } + }); } - } - } - }); + control.window.setPagePosition(Ext.getCmp('east').x - (control.window.width + 15 + 5), Ext.getCmp('center').y + 41); + control.window.show(); + document.getElementById('measureDistanceDiv').innerHTML = '0 km'; + control.setImmediate(true); + control.geodesic = true; + control.activate(); + } + else { + control.deactivate(); + control.window.hide(); + } + } + }); var adminButton = new Ext.Button({ iconCls: 'icon-admin', tooltip: 'Administrator settings', disabled: !G.user.isAdmin, style: 'margin-top:1px', - handler: function() { + handler: function() { if (!adminWindow.hidden) { adminWindow.hide(); } @@ -2716,6 +2765,7 @@ favoritesButton, predefinedMapLegendSetButton, exportImageButton, + measureDistanceButton, '-', adminButton, helpButton, @@ -2873,5 +2923,18 @@ slideFactor: 100 })); + G.vars.map.addControl(new OpenLayers.Control.Measure( OpenLayers.Handler.Path, { + id: 'measuredistance', + persist: true, + handlerOptions: { + layerOptions: {styleMap: G.util.measureDistance.getMeasureStyleMap()} + } + })); + + G.vars.map.getControl('measuredistance').events.on({ + "measurepartial": G.util.measureDistance.handleMeasurements, + "measure": G.util.measureDistance.handleMeasurements + }); + }}); });