[Commits] r2874 - in extensions/geoext.ux/ux/FeatureEditing: examples lib/GeoExt.ux
commits at geoext.org
commits at geoext.org
Mon Feb 6 14:21:11 CET 2012
Author: pgiraud
Date: 2012-02-06 14:21:11 +0100 (Mon, 06 Feb 2012)
New Revision: 2874
Modified:
extensions/geoext.ux/ux/FeatureEditing/examples/feature-editor-grid.html
extensions/geoext.ux/ux/FeatureEditing/examples/feature-editor-grid.js
extensions/geoext.ux/ux/FeatureEditing/lib/GeoExt.ux/FeatureEditorGrid.js
Log:
Adding some enhancements to the feature editor grid mainly for usability. Closes #453
Modified: extensions/geoext.ux/ux/FeatureEditing/examples/feature-editor-grid.html
===================================================================
--- extensions/geoext.ux/ux/FeatureEditing/examples/feature-editor-grid.html 2012-02-03 19:49:45 UTC (rev 2873)
+++ extensions/geoext.ux/ux/FeatureEditing/examples/feature-editor-grid.html 2012-02-06 13:21:11 UTC (rev 2874)
@@ -2,15 +2,28 @@
<head>
<title>Feature Editor Grid</title>
- <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.1.1/resources/css/ext-all.css" />
- <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.1.1/examples/shared/examples.css" />
- <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.1.1/adapter/ext/ext-base.js"></script>
- <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.1.1/ext-all-debug.js"></script>
- <script type="text/javascript" src="http://www.openlayers.org/api/2.9/OpenLayers.js"></script>
+ <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.4.0/resources/css/ext-all.css" />
+ <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.4.0/examples/shared/examples.css" />
+ <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.4.0/adapter/ext/ext-base.js"></script>
+ <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.4.0/ext-all-debug.js"></script>
+ <script type="text/javascript" src="http://www.openlayers.org/api/2.11/OpenLayers.js"></script>
<script type="text/javascript" src="../../../../geoext/lib/GeoExt.js"></script>
<script type="text/javascript" src="../lib/GeoExt.ux/FeatureEditorGrid.js"></script>
<script type="text/javascript" src="feature-editor-grid.js"></script>
+ <style type="text/css">
+ /* make the save button appear like a standard button (ie. like not a toolbar) */
+ .x-save-btn { margin-left: 3px; }
+ .x-save-btn .x-btn-tl { background-position: 0 0; }
+ .x-save-btn .x-btn-tr { background-position: -3px 0; }
+ .x-save-btn .x-btn-tc { background-position: 0 -6px; }
+ .x-save-btn .x-btn-ml { background-position: 0 -24px; }
+ .x-save-btn .x-btn-mr { background-position: -3px -24px; }
+ .x-save-btn .x-btn-mc { background-position: 0 -1096px; }
+ .x-save-btn .x-btn-bl { background-position: 0 -3px; }
+ .x-save-btn .x-btn-br { background-position: -3px -3px; }
+ .x-save-btn .x-btn-bc { background-position: 0 -15px; }
+ </style>
</head>
<body>
Modified: extensions/geoext.ux/ux/FeatureEditing/examples/feature-editor-grid.js
===================================================================
--- extensions/geoext.ux/ux/FeatureEditing/examples/feature-editor-grid.js 2012-02-03 19:49:45 UTC (rev 2873)
+++ extensions/geoext.ux/ux/FeatureEditing/examples/feature-editor-grid.js 2012-02-06 13:21:11 UTC (rev 2874)
@@ -95,6 +95,12 @@
allowSave: true,
allowCancel: true,
allowDelete: true,
+ border: false,
+ hideHeaders: true,
+ viewConfig: {
+ forceFit: true,
+ scrollOffset: 2 // the grid will never have scrollbars
+ },
listeners: {
done: function(panel, e) {
closeEditing();
Modified: extensions/geoext.ux/ux/FeatureEditing/lib/GeoExt.ux/FeatureEditorGrid.js
===================================================================
--- extensions/geoext.ux/ux/FeatureEditing/lib/GeoExt.ux/FeatureEditorGrid.js 2012-02-03 19:49:45 UTC (rev 2873)
+++ extensions/geoext.ux/ux/FeatureEditing/lib/GeoExt.ux/FeatureEditorGrid.js 2012-02-06 13:21:11 UTC (rev 2874)
@@ -115,6 +115,12 @@
*/
modifyControl: undefined,
+ /**
+ * public: property[modifyControlOptions]
+ * ``Object`` options to be passed to the ModifyFeature control
+ */
+ modifyControlOptions: null,
+
/** private: property[featureInfo]
* ``Object`` Where we store the original state (in a broad sense) of
* the feature, so we can undo changes if necessary.
@@ -142,6 +148,9 @@
*/
dirty: false,
+ // private config overrides
+ clicksToEdit: 1,
+
/** private: method[initComponent]
*/
initComponent: function() {
@@ -192,21 +201,22 @@
});
}
- delete this.feature;
+ var feature = this.store.feature;
// create bottom bar
this.deleteButton = new Ext.Button({
text: this.deleteButtonText,
tooltip: this.deleteButtonTooltip,
- iconCls: "delete",
+ cls: 'x-delete-btn',
hidden: !this.allowDelete,
handler: this.deleteHandler,
+ disabled: feature.state == OpenLayers.State.INSERT,
scope: this
});
this.cancelButton = new Ext.Button({
text: this.cancelButtonText,
tooltip: this.cancelButtonTooltip,
- iconCls: "cancel",
+ cls: 'x-cancel-btn',
hidden: !this.allowCancel,
handler: this.cancelHandler,
scope: this
@@ -214,19 +224,21 @@
this.saveButton = new Ext.Button({
text: this.saveButtonText,
tooltip: this.saveButtonTooltip,
- iconCls: "save",
+ cls: 'x-save-btn',
hidden: !this.allowSave,
handler: this.saveHandler,
+ disabled: feature.state != OpenLayers.State.INSERT,
scope: this
});
this.bbar = new Ext.Toolbar({
items: [
+ this.deleteButton,
'->',
- this.deleteButton,
- this.saveButton,
- this.cancelButton
+ this.cancelButton,
+ this.saveButton
]
});
+ this.dirty = feature.state == OpenLayers.State.INSERT;
// create column model
var columns = [
@@ -248,8 +260,6 @@
// call parent to finish the initialization of the component
GeoExt.ux.FeatureEditorGrid.superclass.initComponent.call(this);
- var feature = this.store.feature;
-
// store the initial state of the feature
this.featureInfo = {
geometry: feature.geometry.clone(),
@@ -260,7 +270,7 @@
// create modify feature control
this.modifyControl = new OpenLayers.Control.ModifyFeature(
feature.layer,
- {standalone: true}
+ Ext.apply({standalone: true}, this.modifyControlOptions)
);
feature.layer.map.addControl(this.modifyControl);
this.modifyControl.activate();
@@ -277,8 +287,15 @@
this.on({
"afteredit": function() {
this.setFeatureState(this.getDirtyState());
+ this.saveButton.setDisabled(!this.getDirtyState());
}
});
+ this.mon(this.selModel, 'beforecellselect', function(sm, rowIndex, colIndex){
+ if(colIndex === 0){
+ this.startEditing.defer(200, this, [rowIndex, 1]);
+ return false;
+ }
+ }, this);
},
/** private: method[onFeaturemodified]
@@ -289,6 +306,7 @@
onFeaturemodified: function(e) {
if(e.feature === this.store.feature) {
this.dirty = true;
+ this.saveButton.setDisabled();
}
},
More information about the Commits
mailing list