[Lada-commits] [PATCH 1 of 2] Working version of selectable 'ort' in map and grid
Wald Commits
scm-commit at wald.intevation.org
Tue Mar 1 13:16:19 CET 2016
# HG changeset patch
# User Raimund Renkert <raimund.renkert at intevation.de>
# Date 1456829439 -3600
# Branch stammdatengrids
# Node ID 1bd4c0709bd6d502ca5539fd9234a7be541192ac
# Parent 2e7adc19b4fe60aa8bafec82fcf45dac61c70437
Working version of selectable 'ort' in map and grid.
diff -r 2e7adc19b4fe -r 1bd4c0709bd6 app.js
--- a/app.js Tue Feb 16 09:04:05 2016 +0100
+++ b/app.js Tue Mar 01 11:50:39 2016 +0100
@@ -204,6 +204,7 @@
'Lada.controller.Filter',
'Lada.controller.ModeSwitcher',
'Lada.controller.Map',
+ 'Lada.controller.Ort',
'Lada.controller.form.Probe',
'Lada.controller.form.Messung',
'Lada.controller.form.Ortszuordnung',
diff -r 2e7adc19b4fe -r 1bd4c0709bd6 app/controller/Filter.js
--- a/app/controller/Filter.js Tue Feb 16 09:04:05 2016 +0100
+++ b/app/controller/Filter.js Tue Mar 01 11:50:39 2016 +0100
@@ -302,6 +302,11 @@
if (store) {
store.addListener('beforeload', this.loadingAnimationOn, resultGrid);
store.addListener('load', this.loadingAnimationOff, resultGrid);
+ if (type === 'ort') {
+ var panel = resultGrid.up('ortpanel');
+ store.addListener('load', panel.down('map').addLocations, panel.down('map'));
+ panel.connectListeners();
+ }
resultGrid.setStore(store);
//TODO: Check if this is still necessary, as a Grid exists
diff -r 2e7adc19b4fe -r 1bd4c0709bd6 app/controller/Ort.js
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/app/controller/Ort.js Tue Mar 01 11:50:39 2016 +0100
@@ -0,0 +1,120 @@
+/**
+ *
+ */
+Ext.define('Lada.controller.Ort', {
+ extend: 'Ext.app.Controller',
+
+ /**
+ * @private
+ * Initialize the controller.
+ */
+ init: function() {
+ var me = this;
+ this.control({
+ 'ortpanel button[action=addMap]': {
+ click: me.addFeature
+ },
+ 'ortpanel button[action=add]': {
+ click: me.addRecord
+ },
+ 'ortpanel button[action=delete]': {
+ click: me.deleteItem
+ },
+ 'ortpanel ortstammdatengrid': {
+ edit: me.gridSave,
+ canceledit: me.cancelEdit,
+ select: me.activateButtons,
+ deselect: me.deactivateButtons
+ }
+ });
+ },
+
+ addFeature: function(button) {
+ console.log('add feature');
+ },
+
+ addRecord: function(button) {
+ console.log('add record');
+ },
+
+ deleteItem: function(button) {
+ console.log('delete item');
+ },
+
+ /**
+ * This function is called when the grids roweditor saves
+ * the record.
+ * On success it refreshes the windows which contains the grid
+ * On failure it displays a message
+ */
+ gridSave: function(editor, context) {
+ var i18n = Lada.getApplication().bundle;
+ context.record.save({
+ success: function(record, response) {
+ //Do Nothing
+ },
+ failure: function(record, response) {
+ var json = response.request.scope.reader.jsonData;
+ if (json) {
+ if (json.message){
+ Ext.Msg.alert(i18n.getMsg('err.msg.save.title')
+ +' #'+json.message,
+ i18n.getMsg(json.message));
+ } else {
+ Ext.Msg.alert(i18n.getMsg('err.msg.save.title'),
+ i18n.getMsg('err.msg.generic.body'));
+ }
+ }
+ }
+ });
+ },
+
+ /**
+ * When the edit was canceled,
+ * the empty row might have been created by the roweditor is removed
+ */
+ cancelEdit: function(editor, context) {
+ if (!context.record.get('id') ||
+ context.record.get('id') === '') {
+ editor.getCmp().store.remove(context.record);
+ }
+ context.grid.getSelectionModel().deselect(context.record);
+ },
+ /**
+ * Toggles the buttons in the toolbar
+ **/
+ activateButtons: function(rowModel, record) {
+ var panel = rowModel.view.up('ortpanel');
+ this.buttonToggle(true, panel);
+ },
+
+ /**
+ * Toggles the buttons in the toolbar
+ **/
+ deactivateButtons: function(rowModel, record) {
+ var panel = rowModel.view.up('ortpanel');
+ // Only disable buttons when nothing is selected
+ if (rowModel.selected.items == 0) {
+ this.buttonToggle(false, panel);
+ }
+ },
+
+ /**
+ * Enables/Disables a set of buttons
+ **/
+ buttonToggle: function(enabled, panel) {
+ if (!enabled) {
+ panel.down('button[action=delete]').disable();
+ }
+ else {
+ if (!panel.down('ortstammdatengrid').getPlugin('rowedit').editing) {
+ //only enable buttons, when grid is not beeing edited
+ panel.down('button[action=delete]').enable();
+ }
+ //else turn them off again!
+ else {
+ this.buttonToggle(false, panel);
+ }
+ }
+ }
+});
diff -r 2e7adc19b4fe -r 1bd4c0709bd6 app/view/form/Ortszuordnung.js
--- a/app/view/form/Ortszuordnung.js Tue Feb 16 09:04:05 2016 +0100
+++ b/app/view/form/Ortszuordnung.js Tue Mar 01 11:50:39 2016 +0100
@@ -71,16 +71,19 @@
items: [{
layout: 'vbox',
border: 0,
+ margin: '0, 10, 0, 0',
items: [{
xtype: 'tfield',
+ labelWidth: 125,
maxLength: 100,
name: 'ortszusatztext',
- fieldLabel: i18n.getMsg('ortszuordnung.form.field.ortszusatztext'),
+ fieldLabel: i18n.getMsg('ortszuordnung.form.field.ortszusatztext')
}, {
xtype: 'tfield',
+ labelWidth: 125,
maxLength: 100,
name: 'ortszuordnungTyp',
- fieldLabel: i18n.getMsg('ortszuordnung.form.field.ortszuordnungtyp'),
+ fieldLabel: i18n.getMsg('ortszuordnung.form.field.ortszuordnungtyp')
}, {
xtype: 'textfield',
submitValue: true,
@@ -90,20 +93,36 @@
}]
}, {
layout: 'vbox',
+ flex: 1,
+ margin: '0, 10, 0, 0',
border: 0,
items: [{
xtype: 'displayfield',
- fieldLabel: i18n.getMsg('orte.gemId'),
- name: 'gemId'
- }, {
- xtype: 'displayfield',
- fieldLabel: i18n.getMsg('Gemeinde'),
+ labelWidth: 125,
+ fieldLabel: i18n.getMsg('orte.gemeinde'),
name: 'gemeinde'
}, {
xtype: 'displayfield',
+ labelWidth: 125,
fieldLabel: i18n.getMsg('staat'),
name: 'staat'
}]
+ }, {
+ layout: 'vbox',
+ flex: 1,
+ margin: '0, 10, 0, 0',
+ border: 0,
+ items: [{
+ xtype: 'displayfield',
+ labelWidth: 125,
+ fieldLabel: i18n.getMsg('orte.lon'),
+ name: 'lon'
+ }, {
+ xtype: 'displayfield',
+ labelWidth: 125,
+ fieldLabel: i18n.getMsg('orte.lat'),
+ name: 'lat'
+ }]
}]
}]
}];
@@ -127,15 +146,17 @@
refreshOrt: function(ortId) {
var orteStore = Ext.StoreManager.get('orte');
var ort = orteStore.getById(ortId);
- var verwStore = Ext.StoreManager.get('verwaltungseinheiten');
+ var verwStore = Ext.StoreManager.get('verwaltungseinheiten');
var verw = verwStore.getById(ort.get('gemId'));
- var staatStore = Ext.StoreManager.get('staaten');
+ var staatStore = Ext.StoreManager.get('staaten');
var staat = staatStore.getById(ort.get('staatId'));
+ console.log(ort);
this.getForm().setValues({
- gemId: ort.get('gemId'),
gemeinde: verw.get('bezeichnung'),
- staat: staat.get('staatIso')
+ staat: staat.get('staatIso'),
+ lon: ort.get('longitude'),
+ lat: ort.get('latitude')
});
},
diff -r 2e7adc19b4fe -r 1bd4c0709bd6 app/view/grid/Orte.js
--- a/app/view/grid/Orte.js Tue Feb 16 09:04:05 2016 +0100
+++ b/app/view/grid/Orte.js Tue Mar 01 11:50:39 2016 +0100
@@ -31,6 +31,14 @@
var i18n = Lada.getApplication().bundle;
this.emptyText = i18n.getMsg('orte.emptyGrid');
+ this.rowEditing = Ext.create('Ext.grid.plugin.RowEditing', {
+ clicksToMoveEditor: 1,
+ autoCancel: false,
+ disabled: false,
+ pluginId: 'rowedit'
+ });
+ this.plugins = [this.rowEditing];
+
this.columns = [{
header: i18n.getMsg('orte.ortId'),
dataIndex: 'ortId'
@@ -139,5 +147,11 @@
}]);
}
}
+ },
+
+ selectOrt: function(map, feature) {
+ var id = feature[0].data.id;
+ var record = this.store.getById(id);
+ this.getSelectionModel().select(record);
}
});
diff -r 2e7adc19b4fe -r 1bd4c0709bd6 app/view/panel/Map.js
--- a/app/view/panel/Map.js Tue Feb 16 09:04:05 2016 +0100
+++ b/app/view/panel/Map.js Tue Mar 01 11:50:39 2016 +0100
@@ -85,8 +85,8 @@
}
},
- selectFeature: function(id) {
- var feature = this.featureLayer.getFeaturesByAttribute('id', id);
+ selectFeature: function(model, record) {
+ var feature = this.featureLayer.getFeaturesByAttribute('id', record.get('id'));
this.map.setCenter(
new OpenLayers.LonLat(feature[0].geometry.x, feature[0].geometry.y));
this.map.zoomToScale(this.mapOptions.scales[5]);
@@ -114,6 +114,9 @@
},
addLocations: function(locationStore) {
+ console.log('add locations');
+ console.log(locationStore);
+ var me = this;
locationFeatures = [];
// Iterate the Store and create features from it
@@ -125,46 +128,52 @@
),
{
id: locationStore.getAt(i).get('id'),
- bez:locationStore.getAt(i).get('kurztext')
+ bez: locationStore.getAt(i).get('ortId')
}
));
+ console.log('add feature');
+ console.log(locationStore.getAt(i));
}
+ console.log(locationStore.count());
// Create a new Feature Layer and add it to the map
- this.featureLayer = new OpenLayers.Layer.Vector('vector_' + this.map.name, {
- styleMap: new OpenLayers.StyleMap({
- 'default': new OpenLayers.Style(OpenLayers.Util.applyDefaults({
- externalGraphic: 'resources/lib/OpenLayers/img/marker-green.png',
- graphicOpacity: 1,
- pointRadius: 10,
- label: '${bez}',
- labelAlign: 'rt',
- fontColor: 'green',
- fontWeight: 'bold'
- }, OpenLayers.Feature.Vector.style['default'])),
- 'select': new OpenLayers.Style({
- externalGraphic: 'resources/lib/OpenLayers/img/marker-blue.png',
- pointRadius: 15,
- label: '${bez}',
- labelAlign: 'rt',
- fontColor: 'blue',
- fontWeight: 'bold'
+ if (!this.featureLayer) {
+ this.featureLayer = new OpenLayers.Layer.Vector('vector_' + this.map.name, {
+ styleMap: new OpenLayers.StyleMap({
+ 'default': new OpenLayers.Style(OpenLayers.Util.applyDefaults({
+ externalGraphic: 'resources/lib/OpenLayers/img/marker-green.png',
+ graphicOpacity: 1,
+ pointRadius: 10,
+ label: '${bez}',
+ labelAlign: 'rt',
+ fontColor: 'green',
+ fontWeight: 'bold'
+ }, OpenLayers.Feature.Vector.style['default'])),
+ 'select': new OpenLayers.Style({
+ externalGraphic: 'resources/lib/OpenLayers/img/marker-blue.png',
+ pointRadius: 15,
+ label: '${bez}',
+ labelAlign: 'rt',
+ fontColor: 'blue',
+ fontWeight: 'bold'
+ })
})
- })
- });
+ });
+ this.selectControl = new OpenLayers.Control.SelectFeature(this.featureLayer, {
+ clickout: false,
+ toggle: false,
+ multiple: false,
+ hover: false,
+ onSelect: me.selectedFeature,
+ scope: me
+ });
+ this.map.addControl(this.selectControl);
+ this.selectControl.activate();
+ }
+ this.featureLayer.removeAllFeatures();
this.featureLayer.addFeatures(locationFeatures);
this.map.addLayer(this.featureLayer);
- this.selectControl = new OpenLayers.Control.SelectFeature(this.featureLayer, {
- clickout: false,
- toggle: false,
- multiple: false,
- hover: false,
- onSelect: me.selectedFeature,
- scope: me
- });
- this.map.addControl(this.selectControl);
- this.selectControl.activate();
},
diff -r 2e7adc19b4fe -r 1bd4c0709bd6 app/view/panel/Ort.js
--- a/app/view/panel/Ort.js Tue Feb 16 09:04:05 2016 +0100
+++ b/app/view/panel/Ort.js Tue Mar 01 11:50:39 2016 +0100
@@ -11,7 +11,7 @@
//height: 200,
layout: {
- type: 'border',
+ type: 'border'
},
toolbarPos: 'top',
@@ -69,7 +69,7 @@
xtype: 'ortstammdatengrid',
width: '60%',
collapsible: true,
- region: 'east',
+ region: 'east'
}, {
xtype: 'map',
region: 'center',
@@ -85,15 +85,21 @@
this.map.addControl(new OpenLayers.Control.ScaleLine());
}
}
- }],
+ }];
this.callParent(arguments);
},
+ afterRender: function() {
+ this.superclass.afterRender.apply(this, arguments);
+ this.down('map').map.zoomToMaxExtent();
+ },
+
setStore: function(store) {
var me = this;
var osg = this.down('ortstammdatengrid');
var map = this.down('map');
+ console.log(map);
if (!store) {
var ortstore = Ext.create('Lada.store.Orte', {
@@ -111,7 +117,6 @@
map.setLoading(false);
osg.setStore(ortstore);
map.addLocations(ortstore);
-
}
}
}
@@ -121,8 +126,20 @@
osg.setStore(store);
map.addLocations(store);
}
+ this.connectListeners();
//enable buttons
me.down('toolbar button[action=add]').enable();
me.down('toolbar button[action=addMap]').enable();
+ },
+
+ getStore: function() {
+ return this.down('grid').getStore();
+ },
+
+ connectListeners: function() {
+ var osg = this.down('ortstammdatengrid');
+ var map = this.down('map');
+ map.addListener('featureselected', osg.selectOrt, osg);
+ osg.addListener('select', map.selectFeature, map);
}
});
diff -r 2e7adc19b4fe -r 1bd4c0709bd6 app/view/window/Ortszuordnung.js
--- a/app/view/window/Ortszuordnung.js Tue Feb 16 09:04:05 2016 +0100
+++ b/app/view/window/Ortszuordnung.js Tue Mar 01 11:50:39 2016 +0100
@@ -84,6 +84,7 @@
this.items = [{
xtype: 'ortszuordnungform',
layout: 'fit',
+ width: '100%',
margin: 5
}, {
xtype: 'ortpanel',
More information about the Lada-commits
mailing list