=== modified file 'dhis-2/dhis-web/dhis-web-mapping/src/main/webapp/dhis-web-mapping/app/index.html' --- dhis-2/dhis-web/dhis-web-mapping/src/main/webapp/dhis-web-mapping/app/index.html 2012-11-06 12:22:24 +0000 +++ dhis-2/dhis-web/dhis-web-mapping/src/main/webapp/dhis-web-mapping/app/index.html 2012-11-07 11:32:26 +0000 @@ -29,18 +29,12 @@ document.body.oncontextmenu = function(){return false;}; + - + === modified file 'dhis-2/dhis-web/dhis-web-mapping/src/main/webapp/dhis-web-mapping/app/scripts/app.js' --- dhis-2/dhis-web/dhis-web-mapping/src/main/webapp/dhis-web-mapping/app/scripts/app.js 2012-11-06 17:02:51 +0000 +++ dhis-2/dhis-web/dhis-web-mapping/src/main/webapp/dhis-web-mapping/app/scripts/app.js 2012-11-07 11:32:26 +0000 @@ -952,7 +952,7 @@ }; items.push(item); - if (base.id !== GIS.base.boundary.id && base.id !== GIS.base.facility.id) { + if (base.id !== GIS.base.boundary.id) { item = { text: 'Filter..', //i18n iconCls: 'gis-menu-item-icon-filter', @@ -966,7 +966,8 @@ } } - base.widget.cmp.filterWindow = new GIS.obj.FilterWindow(base); + base.widget.cmp.filterWindow = base.id === GIS.base.facility.id ? + new GIS.obj.FilterFacilityWindow(base) : new GIS.obj.FilterWindow(base); base.widget.cmp.filterWindow.show(); } }; @@ -1398,6 +1399,78 @@ return window; }; + GIS.obj.FilterFacilityWindow = function(base) { + var that = base.widget, + window, + multiSelect, + button, + filter, + selection, + features = [], + groupSetName = that.view.organisationUnitGroupSet.name, + store = GIS.store.groupsByGroupSet; + + filter = function() { + features = []; + + if (!selection.length || !selection[0]) { + features = that.features; + } + else { + for (var i = 0; i < that.features.length; i++) { + for (var j = 0; j < selection.length; j++) { + if (that.features[i].attributes[groupSetName] === selection[j]) { + features.push(that.features[i]); + } + } + } + } + + that.layer.removeAllFeatures(); + that.layer.addFeatures(features); + }; + + multiSelect = Ext.create('Ext.ux.form.MultiSelect', { + hideLabel: true, + dataFields: ['id', 'name'], + valueField: 'name', + displayField: 'name', + width: 200, + height: 300, + store: store + }); + + button = Ext.create('Ext.button.Button', { + text: 'Filter', + handler: function() { + selection = multiSelect.getValue(); + filter(); + } + }); + + window = Ext.create('Ext.window.Window', { + title: 'Filter by value', + iconCls: 'gis-window-title-icon-filter', + cls: 'gis-container-default', + //width: GIS.conf.layout.tool.window_width, + resizable: false, + filter: filter, + items: multiSelect, + bbar: [ + '->', + button + ], + listeners: { + destroy: function() { + that.layer.removeAllFeatures(); + that.layer.addFeatures(that.features); + } + } + }); + + return window; + }; + GIS.obj.LabelWindow = function(base) { var layer = base.layer, fontSize, === removed directory 'dhis-2/dhis-web/dhis-web-mapping/src/main/webapp/dhis-web-mapping/app/scripts/ext-ux/button' === removed file 'dhis-2/dhis-web/dhis-web-mapping/src/main/webapp/dhis-web-mapping/app/scripts/ext-ux/button/ColorButton.js' --- dhis-2/dhis-web/dhis-web-mapping/src/main/webapp/dhis-web-mapping/app/scripts/ext-ux/button/ColorButton.js 2012-10-10 22:28:24 +0000 +++ dhis-2/dhis-web/dhis-web-mapping/src/main/webapp/dhis-web-mapping/app/scripts/ext-ux/button/ColorButton.js 1970-01-01 00:00:00 +0000 @@ -1,47 +0,0 @@ -Ext.define('Ext.ux.button.ColorButton', { - extend: 'Ext.button.Button', - alias: 'widget.colorbutton', - width: 109, - height: 22, - defaultValue: null, - value: 'f1f1f1', - getValue: function() { - return this.value; - }, - setValue: function(color) { - this.value = color; - if (Ext.isDefined(this.getEl())) { - this.getEl().dom.style.background = '#' + color; - } - }, - reset: function() { - this.setValue(this.defaultValue); - }, - menu: {}, - menuHandler: function() {}, - initComponent: function() { - var that = this; - this.defaultValue = this.value; - this.menu = Ext.create('Ext.menu.Menu', { - showSeparator: false, - items: { - xtype: 'colorpicker', - closeAction: 'hide', - listeners: { - select: function(cp, color) { - that.setValue(color); - that.menu.hide(); - that.menuHandler(cp, color); - } - } - } - }); - this.callParent(); - }, - listeners: { - render: function() { - this.setValue(this.value); - } - } -}); - === added file 'dhis-2/dhis-web/dhis-web-mapping/src/main/webapp/dhis-web-mapping/app/scripts/ext-ux/ext-ux-custom.js' --- dhis-2/dhis-web/dhis-web-mapping/src/main/webapp/dhis-web-mapping/app/scripts/ext-ux/ext-ux-custom.js 1970-01-01 00:00:00 +0000 +++ dhis-2/dhis-web/dhis-web-mapping/src/main/webapp/dhis-web-mapping/app/scripts/ext-ux/ext-ux-custom.js 2012-11-07 11:32:26 +0000 @@ -0,0 +1,506 @@ +/* ColorButton */ + +Ext.define('Ext.ux.button.ColorButton', { + extend: 'Ext.button.Button', + alias: 'widget.colorbutton', + width: 109, + height: 22, + defaultValue: null, + value: 'f1f1f1', + getValue: function() { + return this.value; + }, + setValue: function(color) { + this.value = color; + if (Ext.isDefined(this.getEl())) { + this.getEl().dom.style.background = '#' + color; + } + }, + reset: function() { + this.setValue(this.defaultValue); + }, + menu: {}, + menuHandler: function() {}, + initComponent: function() { + var that = this; + this.defaultValue = this.value; + this.menu = Ext.create('Ext.menu.Menu', { + showSeparator: false, + items: { + xtype: 'colorpicker', + closeAction: 'hide', + listeners: { + select: function(cp, color) { + that.setValue(color); + that.menu.hide(); + that.menuHandler(cp, color); + } + } + } + }); + this.callParent(); + }, + listeners: { + render: function() { + this.setValue(this.value); + } + } +}); + +/* LayerItemPanel */ + +Ext.define('Ext.ux.panel.LayerItemPanel', { + extend: 'Ext.panel.Panel', + alias: 'widget.layeritempanel', + layout: 'column', + layer: null, + checkbox: null, + numberField: null, + imageUrl: null, + text: null, + width: 184, + height: 22, + value: false, + opacity: 0.8, + getValue: function() { + return this.checkbox.getValue(); + }, + setValue: function(value, opacity) { + this.checkbox.setValue(value); + this.numberField.setDisabled(!value); + this.layer.setVisibility(value); + + if (opacity === 0) { + this.numberField.setValue(0); + this.setOpacity(0.01); + } + else if (opacity > 0) { + this.numberField.setValue(opacity * 100); + this.setOpacity(opacity); + } + else { + this.numberField.setValue(this.opacity * 100); + this.setOpacity(this.opacity); + } + }, + getOpacity: function() { + return this.opacity; + }, + setOpacity: function(opacity) { + this.opacity = opacity === 0 ? 0.01 : opacity; + this.layer.setLayerOpacity(this.opacity); + }, + disableItem: function() { + this.checkbox.setValue(false); + this.numberField.disable(); + this.layer.setVisibility(false); + }, + updateItem: function(value) { + this.numberField.setDisabled(!value); + this.layer.setVisibility(value); + }, + initComponent: function() { + var that = this, + image; + + this.checkbox = Ext.create('Ext.form.field.Checkbox', { + width: 14, + checked: this.value, + listeners: { + change: function(chb, value) { + if (value && that.layer.layerType === GIS.conf.finals.layer.type_base) { + var layers = GIS.util.map.getLayersByType(GIS.conf.finals.layer.type_base), + layer; + for (var i = 0; i < layers.length; i++) { + layer = layers[i]; + if (layer !== that.layer) { + layer.item.checkbox.suppressChange = true; + layer.item.disableItem(); + } + } + } + that.updateItem(value); + + GIS.cmp.downloadButton.xable(); + } + } + }); + + image = Ext.create('Ext.Img', { + width: 14, + height: 14, + src: this.imageUrl + }); + + this.numberField = Ext.create('Ext.form.field.Number', { + cls: 'gis-numberfield', + width: 47, + height: 18, + minValue: 0, + maxValue: 100, + value: this.opacity * 100, + allowBlank: false, + disabled: this.numberFieldDisabled, + listeners: { + change: function() { + var value = this.getValue(), + opacity = value === 0 ? 0.01 : value/100; + + that.setOpacity(opacity); + } + } + }); + + this.items = [ + { + width: this.checkbox.width + 6, + items: this.checkbox + }, + { + width: image.width + 5, + items: image, + bodyStyle: 'padding-top: 4px' + }, + { + width: 98, + html: this.text, + bodyStyle: 'padding-top: 4px' + }, + { + width: this.numberField.width, + items: this.numberField + } + ]; + + this.layer.setOpacity(this.opacity); + + this.callParent(); + } +}); + +/* MultiSelect */ + +Ext.define("Ext.ux.layout.component.form.MultiSelect",{extend:"Ext.layout.component.field.Field",alias:["layout.multiselectfield"],type:"multiselectfield",defaultHeight:200,sizeBodyContents:function(a,b){var c=this;if(!Ext.isNumber(b)){b=c.defaultHeight}c.owner.panel.setSize(a,b)}}); + +/* +This file is part of Ext JS 4 +Copyright (c) 2011 Sencha Inc +Contact: http://www.sencha.com/contact +GNU General Public License Usage +This file may be used under the terms of the GNU General Public License version 3.0 as published by the Free Software Foundation and appearing in the file LICENSE included in the packaging of this file. Please review the following information to ensure the GNU General Public License version 3.0 requirements will be met: http://www.gnu.org/copyleft/gpl.html. +If you are unsure which license is appropriate for your use, please contact the sales department at http://www.sencha.com/contact. +*/ +/** + * @class Ext.ux.form.MultiSelect + * @extends Ext.form.field.Base + * A control that allows selection and form submission of multiple list items. + * + * @history + * 2008-06-19 bpm Original code contributed by Toby Stuart (with contributions from Robert Williams) + * 2008-06-19 bpm Docs and demo code clean up + * + * @constructor + * Create a new MultiSelect + * @param {Object} config Configuration options + * @xtype multiselect + */ +Ext.define('Ext.ux.form.MultiSelect', { + extend: 'Ext.form.field.Base', + alternateClassName: 'Ext.ux.Multiselect', + alias: ['widget.multiselect', 'widget.multiselectfield'], + uses: ['Ext.view.BoundList', 'Ext.form.FieldSet', 'Ext.ux.layout.component.form.MultiSelect', 'Ext.view.DragZone', 'Ext.view.DropZone'], + /** + * @cfg {String} listTitle An optional title to be displayed at the top of the selection list. + */ + /** + * @cfg {String/Array} dragGroup The ddgroup name(s) for the MultiSelect DragZone (defaults to undefined). + */ + /** + * @cfg {String/Array} dropGroup The ddgroup name(s) for the MultiSelect DropZone (defaults to undefined). + */ + /** + * @cfg {Boolean} ddReorder Whether the items in the MultiSelect list are drag/drop reorderable (defaults to false). + */ + ddReorder: false, + /** + * @cfg {Object/Array} tbar An optional toolbar to be inserted at the top of the control's selection list. + * This can be a {@link Ext.toolbar.Toolbar} object, a toolbar config, or an array of buttons/button configs + * to be added to the toolbar. See {@link Ext.panel.Panel#tbar}. + */ + /** + * @cfg {String} appendOnly True if the list should only allow append drops when drag/drop is enabled + * (use for lists which are sorted, defaults to false). + */ + appendOnly: false, + /** + * @cfg {String} displayField Name of the desired display field in the dataset (defaults to 'text'). + */ + displayField: 'text', + /** + * @cfg {String} valueField Name of the desired value field in the dataset (defaults to the + * value of {@link #displayField}). + */ + /** + * @cfg {Boolean} allowBlank False to require at least one item in the list to be selected, true to allow no + * selection (defaults to true). + */ + allowBlank: true, + /** + * @cfg {Number} minSelections Minimum number of selections allowed (defaults to 0). + */ + minSelections: 0, + /** + * @cfg {Number} maxSelections Maximum number of selections allowed (defaults to Number.MAX_VALUE). + */ + maxSelections: Number.MAX_VALUE, + /** + * @cfg {String} blankText Default text displayed when the control contains no items (defaults to 'This field is required') + */ + blankText: 'This field is required', + /** + * @cfg {String} minSelectionsText Validation message displayed when {@link #minSelections} is not met (defaults to 'Minimum {0} + * item(s) required'). The {0} token will be replaced by the value of {@link #minSelections}. + */ + minSelectionsText: 'Minimum {0} item(s) required', + /** + * @cfg {String} maxSelectionsText Validation message displayed when {@link #maxSelections} is not met (defaults to 'Maximum {0} + * item(s) allowed'). The {0} token will be replaced by the value of {@link #maxSelections}. + */ + maxSelectionsText: 'Maximum {0} item(s) allowed', + /** + * @cfg {String} delimiter The string used to delimit the selected values when {@link #getSubmitValue submitting} + * the field as part of a form. Defaults to ','. If you wish to have the selected values submitted as separate + * parameters rather than a single delimited parameter, set this to null. + */ + delimiter: ',', + /** + * @cfg {Ext.data.Store/Array} store The data source to which this MultiSelect is bound (defaults to undefined). + * Acceptable values for this property are: + *