[Commits] r2796 - in sandbox/gxm/geoext/gxm/lib/GXM: data data/models widgets
commits at geoext.org
commits at geoext.org
Mon Aug 8 15:54:35 CEST 2011
Author: marcjansen
Date: 2011-08-08 15:54:35 +0200 (Mon, 08 Aug 2011)
New Revision: 2796
Removed:
sandbox/gxm/geoext/gxm/lib/GXM/data/LayerReader.js
sandbox/gxm/geoext/gxm/lib/GXM/widgets/SegmentedButton.js
Modified:
sandbox/gxm/geoext/gxm/lib/GXM/data/LayerStore.js
sandbox/gxm/geoext/gxm/lib/GXM/data/models/Layer.js
sandbox/gxm/geoext/gxm/lib/GXM/widgets/Button.js
sandbox/gxm/geoext/gxm/lib/GXM/widgets/LayerList.js
Log:
[gxm]
- remove GXM.data.LayerReader: we now use a plain JSON reader
- remove GXM.widgets.SegmentedButton: we now use the standard Sencha SegmentedButton class
- GXM/data/LayerStore.js
- now uses the new plain JSON reader
- has a new sorter config
- removes the sortField config and introduces a sorterFn-property with an example of its usage in the documentation
- GXM/data/models/Layer.js
- removes the fields zindex and layer as these are no longer needed
- GXM/widgets/Button.js
- respects the pressed-configuration
- documentation for property pScope moved before the constructor
- GXM/widgets/LayerList
- correct requires directive
- API-documentation enhancements
- refactored CSS-classes to be configurable
- visibleOverlayCls
- invisibleOverlayCls
- activeBaselayerCls (new, to enhance the UI when the map contains baselayers)
- inactiveBaselayerCls (new, to enhance the UI when the map contains baselayers)
- Template improvements with fewer method calls and enhanced tagging of a layerlist item (see the new classes above)
Deleted: sandbox/gxm/geoext/gxm/lib/GXM/data/LayerReader.js
===================================================================
--- sandbox/gxm/geoext/gxm/lib/GXM/data/LayerReader.js 2011-08-08 13:42:21 UTC (rev 2795)
+++ sandbox/gxm/geoext/gxm/lib/GXM/data/LayerReader.js 2011-08-08 13:54:35 UTC (rev 2796)
@@ -1,48 +0,0 @@
-//TODO: check whether we can simply assign copyright to the OSGeo
-/**
- * Copyright (c) 2011 The Open Source Geospatial Foundation
- *
- * Published under the BSD license.
- *
- * See http://svn.geoext.org/sandbox/gxm/geoext/gxm/license.txt for the full
- * text of the license.
- */
-
-Ext.ns("GXM.data");
-
-/** api: (define)
- * module = GXM.data
- * class = LayerReader
- * base_link = `Ext.data.JsonReader <http://dev.sencha.com/deploy/touch/docs/?class=Ext.data.JsonReader>`_
- */
-
-GXM.data.LayerReader = Ext.extend(Ext.data.JsonReader, {
- root: '',
- readRecords: function(layers) {
- var recs = GXM.data.LayerReader.superclass.readRecords.call(this, layers);
-
- //TODO: Discuss whether we can copy and adjust the contents of
- // GXM.data.LayerReader.superclass.readRecords so we do not need to
- // iterate twice over the records
- //TODO: check whether a plain JsonReader is enough when extended with
- // the GXM.data.LayerModelPlugin
- Ext.each(recs.records, function(record, index) {
- //TODO: when we can access getLayer() inside of templates we don't
- // need this
- if ( Ext.isDefined(record.data) && Ext.isDefined(record.data.layer)) {
- record.data.layer = record.raw;
- }
- //TODO: when we can access getLayer() inside of templates we don't
- // need this
- if ( Ext.isDefined(record.data) && Ext.isDefined(record.data.zindex)) {
- record.data.zindex = parseInt(record.raw.getZIndex(), 10);
- }
- });
-
- return recs;
- }
-
-});
-
-/** api: xtype = gxm_layerreader */
-Ext.reg('gxm_layerreader', GXM.data.LayerReader);
Modified: sandbox/gxm/geoext/gxm/lib/GXM/data/LayerStore.js
===================================================================
--- sandbox/gxm/geoext/gxm/lib/GXM/data/LayerStore.js 2011-08-08 13:42:21 UTC (rev 2795)
+++ sandbox/gxm/geoext/gxm/lib/GXM/data/LayerStore.js 2011-08-08 13:54:35 UTC (rev 2796)
@@ -49,21 +49,42 @@
* on top inside of lists that make use of this store.
*
* The configuration of the single sorter can also be configured using the
- * :attr:`sortField` and :attr:`sortDirection` configuration properties.
+ * :attr:`sortDirection` configuration properties.
*/
- /** api: config[sortField]
- *
- * ``String`` The field to order the store by if no :attr:`sorters`.
- * Defaults to `zindex`.
- */
-
/** api: config[sortDirection]
*
* ``String`` The direction to order the store by if no :attr:`sorters`.
* Defaults to `DESC`.
*/
+ /** api: config[sorterFn]
+ *
+ * ``Function`` The method used to sort store items. The method will
+ * be called with two objects (instances of the configured :attr:`model`)
+ * and should implement logic that determines ordering of the passed
+ * objects. Your method should return
+ *
+ * * ``1`` if the first object is greater than the second object
+ * * ``-1`` if the second object is greater than the first
+ * * ``0`` if they are equal.
+ *
+ * Here is an example method:
+ *
+ * .. code-block:: javascript
+ *
+ * function(obj_1, obj_2) {
+ * var layer_1 = obj_1.getLayer(),
+ * layer_2 = obj_2.getLayer(),
+ * idx_1 = layer_1.getZIndex(),
+ * idx_2 = layer_2.getZIndex(),
+ * res = (idx_1 > idx_2 ? 1 : (idx_1 < idx_2 ? -1 : 0));
+ * return res;
+ * }
+ *
+ * You can further control the sort direction by :attr:`sortDirection`.
+ *
+ */
constructor: function(config) {
var conf = config || {};
@@ -71,12 +92,19 @@
conf.proxy = conf.proxy || {
type: 'memory',
- reader: new GXM.data.LayerReader({})
+ reader: 'json'
};
-
+
conf.sorters = conf.sorters || [{
- property: conf.sortField || 'zindex',
- direction: conf.sortDirection || 'DESC'
+ direction: conf.sortDirection || 'DESC',
+ sorterFn: conf.sorterFn || function(obj_1, obj_2) {
+ var layer_1 = obj_1.getLayer(),
+ layer_2 = obj_2.getLayer(),
+ idx_1 = layer_1.getZIndex(),
+ idx_2 = layer_2.getZIndex(),
+ res = (idx_1 > idx_2 ? 1 : (idx_1 < idx_2 ? -1 : 0));
+ return res;
+ }
}];
return GXM.data.LayerStore.superclass.constructor.call(this, conf);
Modified: sandbox/gxm/geoext/gxm/lib/GXM/data/models/Layer.js
===================================================================
--- sandbox/gxm/geoext/gxm/lib/GXM/data/models/Layer.js 2011-08-08 13:42:21 UTC (rev 2795)
+++ sandbox/gxm/geoext/gxm/lib/GXM/data/models/Layer.js 2011-08-08 13:54:35 UTC (rev 2796)
@@ -33,14 +33,6 @@
// The name given for the layer
name: 'name'
}
- ,{
- name: 'zindex',
- type: 'int'
- }
- ,{
- // The layer instance
- name: 'layer'
- }
]
});
Modified: sandbox/gxm/geoext/gxm/lib/GXM/widgets/Button.js
===================================================================
--- sandbox/gxm/geoext/gxm/lib/GXM/widgets/Button.js 2011-08-08 13:42:21 UTC (rev 2795)
+++ sandbox/gxm/geoext/gxm/lib/GXM/widgets/Button.js 2011-08-08 13:54:35 UTC (rev 2796)
@@ -109,6 +109,12 @@
*/
uHandler: null,
+ /** private: property[pScope]
+ *
+ * ``GXM.Button`` The scope the auto-defined button handler method shall be
+ * executed in. Will be `this`, e.g. the current GXM.Button-instance.
+ */
+
/** api: config[control]
*
* ``OpenLayers.Control`` The control instance that this button shall work
@@ -148,6 +154,7 @@
if (this.map && !this.control.map ) {
this.map.addControl(this.control);
if(this.pressed && this.control.map) {
+ this.addCls(this.pressedCls);
this.control.activate();
}
this.control.events.on({
@@ -160,12 +167,6 @@
},
- /** private: property[pScope]
- *
- * ``GXM.Button`` The scope the auto-defined button handler method shall be
- * executed in. Will be `this`, e.g. the current GXM.Button-instance.
- */
-
/** private: method[pHandler]
*
* The auto-defined handler-method to invoke as handler for
Modified: sandbox/gxm/geoext/gxm/lib/GXM/widgets/LayerList.js
===================================================================
--- sandbox/gxm/geoext/gxm/lib/GXM/widgets/LayerList.js 2011-08-08 13:42:21 UTC (rev 2795)
+++ sandbox/gxm/geoext/gxm/lib/GXM/widgets/LayerList.js 2011-08-08 13:54:35 UTC (rev 2796)
@@ -9,7 +9,7 @@
*/
/**
- * @requires GXM/data/models/Layer.js
+ * @requires GXM/data/LayerStore.js
*/
// Ext.ns is technically not needed, since the above require-directive
Ext.ns('GXM');
@@ -21,7 +21,7 @@
*/
/** api: example
- * Sample code to create a GXM.Button that controls zooms in:
+ * Sample code to create a GXM.LayerList:
*
* .. code-block:: javascript
*
@@ -86,6 +86,43 @@
*/
map: null,
+ /** api: property[visibleOverlayCls]
+ *
+ * ``String`` The CSS class that the list items for currently visible
+ * overlay layers will get.
+ *
+ * Defaults to ``gxm-visible-overlay-indicator``.
+ */
+ visibleOverlayCls: 'gxm-visible-overlay-indicator',
+
+ /** api: property[invisibleOverlayCls]
+ *
+ * ``String`` The CSS class that the list items forcurrently invisible
+ * overlay layers will get.
+ *
+ * Defaults to ``gxm-invisible-overlay-indicator``.
+ */
+ invisibleOverlayCls: 'gxm-invisible-overlay-indicator',
+
+ /** api: property[activeBaselayerCls]
+ *
+ * ``String`` The CSS class that the list item of the currently active
+ * baselayer will get.
+ *
+ * Defaults to ``gxm-active-baselayer-indicator``.
+ */
+ activeBaselayerCls: 'gxm-active-baselayer-indicator',
+
+ /** api: property[inactiveBaselayerCls]
+ *
+ * ``String`` The CSS class that the list items of the currently inactive
+ * baselayers will get.
+ *
+ * Defaults to ``gxm-inactive-baselayer-indicator``.
+ */
+ inactiveBaselayerCls: 'gxm-inactive-baselayer-indicator',
+
+
/** private: method[initComponent]
*
* Initializes the layerlist.
@@ -97,17 +134,17 @@
this.store = this.mapPanel.layers;
} else {
this.store = this.layers || this.store;
+
+
+
}
-
+ // we need a reference inside of the XTemplate-member functions for the
+ // different list-item classes.
+ var me = this;
//TODO: or only one if that returns correct CSS-class?
//TODO: figure out how to use rec.getLayer() inside of templates, that'd make rec.layer obsolete
this.itemTpl = new Ext.XTemplate(
- '<tpl if="this.isVisible(layer)">',
- '<span class="gxm-visible-layer-indicator"></span>' ,
- '</tpl>',
- '<tpl if="!this.isVisible(layer)">',
- '<span class="gxm-invisible-layer-indicator"></span>' ,
- '</tpl>',
+ '<span class="{[this.getVisibilityIconClass(values.layer)]}"></span>',
'<span class="gxm-layer-item">{name}</span>',
{
// template member functions
@@ -119,6 +156,23 @@
visible = !!layer.getVisibility();
}
return visible;
+ },
+ getVisibilityIconClass: function(layer) {
+ var cls = '';
+ if (layer.isBaseLayer) {
+ if (layer.map.baseLayer === layer) {
+ cls = me.activeBaselayerCls;
+ } else {
+ cls = me.inactiveBaselayerCls;
+ }
+ } else {
+ if (layer.getVisibility()) {
+ cls = me.visibleOverlayCls;
+ } else {
+ cls = me.invisibleOverlayCls;
+ }
+ }
+ return cls;
}
}
);
@@ -135,12 +189,32 @@
GXM.LayerList.superclass.initComponent.call(this);
},
+ /** private: method[prepareData]
+ * :param data: ``Object`` The raw data object that was used to create the
+ * record.
+ * :param index: ``Number`` the index number of the Record being prepared
+ * for rendering.
+ * :param record: ``Record`` The Record being prepared for rendering.
+ *
+ * :return: ``Object`` the adjusted data with a new member ``layer``
+ * referencing the raw ``OpenLayers.Layer``-object
+ *
+ * A private methode to give this DataViews template-methods access to the
+ * raw ``OpenLayers.Layer``-object.
+ */
+ prepareData: function(data, index, record) {
+ if (record) {
+ data.layer = record.getLayer();
+ }
+ return data;
+ },
+
/** private: method[onItemTap]
* :param item: ``Ext.Element`` The listitem that was tapped
* :param index: ``Number`` The index inside the list
* :param e: ``Ext.EventObject`` The event-object
*
- * Called on item tap. toggles visibility of the associated layers or sets
+ * Called on item tap. Toggles visibility of the associated layers or sets
* the maps baselayer.
*/
onItemTap: function(item, index, e){
@@ -157,7 +231,7 @@
},
/** private: method[onChangeLayer]
- * :param e: ``Ext.EventObject`` The event-object
+ * :param evt: ``Ext.EventObject`` The event-object
*
* Reloads the store and refreshes the lists UI so it reflects the current
* state of layers managed by the list.
Deleted: sandbox/gxm/geoext/gxm/lib/GXM/widgets/SegmentedButton.js
===================================================================
--- sandbox/gxm/geoext/gxm/lib/GXM/widgets/SegmentedButton.js 2011-08-08 13:42:21 UTC (rev 2795)
+++ sandbox/gxm/geoext/gxm/lib/GXM/widgets/SegmentedButton.js 2011-08-08 13:54:35 UTC (rev 2796)
@@ -1,64 +0,0 @@
-//TODO: check whether we can simply assign copyright to the OSGeo
-/**
- * Copyright (c) 2011 The Open Source Geospatial Foundation
- *
- * Published under the BSD license.
- *
- * See http://svn.geoext.org/sandbox/gxm/geoext/gxm/license.txt for the full
- * text of the license.
- */
-
-//TODO: double check whether we need this class as the need functionality might
-// be replaceable with xtype 'segmentedbutton' and a default xtype of
-// 'gxm_button' for the child items. See review.
-
-Ext.ns('GXM');
-GXM.SegmentedButton = Ext.extend(Ext.SegmentedButton, {
- initComponent: function(){
- // we need to adjust the defaults-property so that child elements
- // (buttons) act as expected and all have the needed properties:
- // - map => the same the segmented button belongs to
- // - xtype => 'gxm_button'
- // - exclusiveGroup (only needed sometimes, see below)
-
- // if we were called with an exclusiveGroup-property, we guess that the
- // user wants to disallowMultiple in any case:
- if (this.exclusiveGroup) {
- this.allowMultiple = false;
- }
-
- // initialize the soon to be default for child buttons
- var exclusiveGroup;
- // shall we act as an exclusive group of buttons?
- if (!this.allowMultiple) {
- // yes, do we already have a group name?
- if(!this.exclusiveGroup) {
- // no, generate_one
- this.exclusiveGroup = Ext.id(null, "gxm-gen-exclusive-group");
- }
- exclusiveGroup = this.exclusiveGroup;
- }
-
- // this are the defaults for all child-buttons
- var defaults = {
- map: this.map,
- xtype: 'gxm_button',
- exclusiveGroup: exclusiveGroup
- };
-
- // apply to any supplied defaults when constructing this segmented
- // button
- var appliedDefaults = Ext.applyIf(this.defaults || {}, defaults);
- this.defaults = appliedDefaults;
-
- // if we only have one item, than this segmented button
- // acts as if he was a toggleButton (like in Ext JS).
- // to mimic this behaviour we simply allowDepress in that case:
- if (this.items && this.items.length === 1) {
- this.allowDepress = true;
- }
-
- GXM.SegmentedButton.superclass.initComponent.call(this);
- }
-});
-Ext.reg('gxm_segmentedbutton', GXM.SegmentedButton);
\ No newline at end of file
More information about the Commits
mailing list