=== modified file 'dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-event-reports/scripts/app.js' --- dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-event-reports/scripts/app.js 2015-02-19 17:12:56 +0000 +++ dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-event-reports/scripts/app.js 2015-02-24 14:54:57 +0000 @@ -109,12 +109,16 @@ // data items (function() { - var operatorCmpWidth = 70, - valueCmpWidth = 306, + var nameCmpWidth = 440, buttonCmpWidth = 20, - nameCmpWidth = 400, + operatorCmpWidth = 70, + searchCmpWidth = 70, + triggerCmpWidth = 17, + valueCmpWidth = 235, + rangeSetWidth = 135, namePadding = '2px 3px', - margin = '3px 0 1px'; + margin = '3px 0 1px', + defaultRangeSetId = 'default'; Ext.define('Ext.ux.panel.DataElementIntegerContainer', { extend: 'Ext.container.Container', @@ -123,14 +127,19 @@ bodyStyle: 'border:0 none', style: 'margin: ' + margin, getRecord: function() { - var record = {}; + var record = {}, + isRange = this.rangeSetCmp.getValue() !== defaultRangeSetId; record.dimension = this.dataElement.id; record.name = this.dataElement.name; - if (this.valueCmp.getValue()) { - record.filter = this.operatorCmp.getValue() + ':' + this.valueCmp.getValue(); - } + if (isRange) { + record.rangeSet = this.rangeSetCmp.getValue(); + record.filter = this.rangeValueCmp.getValue().join(';'); + } + else { + record.filter = this.operatorCmp.getValue() + ':' + this.valueCmp.getValue(); + } return record; }, @@ -138,29 +147,55 @@ if (record.filter) { var a = record.filter.split(':'); - this.operatorCmp.setValue(a[0]); - this.valueCmp.setValue(a[1]); + if (a.length > 1) { + this.operatorCmp.setValue(a[0]); + this.valueCmp.setValue(a[1]); + } + else {} } }, initComponent: function() { - var container = this; + var container = this, + idProperty = 'id', + nameProperty = 'name', + displayProperty = 'displayName'; this.nameCmp = Ext.create('Ext.form.Label', { text: this.dataElement.name, - width: nameCmpWidth, + flex: 1, style: 'padding:' + namePadding }); + this.addCmp = Ext.create('Ext.button.Button', { + cls: 'ns-linkbutton', + style: 'padding: 0', + height: 18, + text: 'Duplicate', + handler: function() { + container.duplicateDataElement(); + } + }); + + this.removeCmp = Ext.create('Ext.button.Button', { + cls: 'ns-linkbutton', + style: 'padding: 0', + height: 18, + text: 'Remove', + handler: function() { + container.removeDataElement(); + } + }); + this.operatorCmp = Ext.create('Ext.form.field.ComboBox', { - valueField: 'id', - displayField: 'name', + valueField: idProperty, + displayField: nameProperty, queryMode: 'local', editable: false, width: operatorCmpWidth, style: 'margin-bottom:0', value: 'EQ', store: { - fields: ['id', 'name'], + fields: [idProperty, nameProperty], data: [ {id: 'EQ', name: '='}, {id: 'GT', name: '>'}, @@ -177,28 +212,190 @@ style: 'margin-bottom:0' }); - this.addCmp = Ext.create('Ext.button.Button', { - text: '+', - width: buttonCmpWidth, - handler: function() { - container.duplicateDataElement(); + this.rangeSearchStore = Ext.create('Ext.data.Store', { + fields: [idProperty, nameProperty] + }); + + // function + this.filterSearchStore = function() { + var selected = container.rangeValueCmp.getValue(); + + container.rangeSearchStore.clearFilter(); + + container.rangeSearchStore.filterBy(function(record) { + return !Ext.Array.contains(selected, record.data[idProperty]); + }); + }; + + this.rangeSearchCmp = Ext.create('Ext.form.field.ComboBox', { + multiSelect: true, + width: operatorCmpWidth, + style: 'margin-bottom:0', + emptyText: 'Select..', + valueField: idProperty, + displayField: displayProperty, + editable: false, + queryMode: 'local', + hidden: true, + store: this.rangeSearchStore, + listConfig: { + minWidth: 326 + }, + listeners: { + select: function() { + var id = Ext.Array.from(this.getValue())[0]; + + // value + if (container.rangeValueStore.findExact(idProperty, id) === -1) { + container.rangeValueStore.add(container.rangeSearchStore.getAt(container.rangeSearchStore.findExact(idProperty, id)).data); + } + + // search + this.select([]); + + // filter + container.filterSearchStore(); + }, + expand: function() { + container.filterSearchStore(); + } } }); - this.removeCmp = Ext.create('Ext.button.Button', { - text: 'x', - width: buttonCmpWidth, - handler: function() { - container.removeDataElement(); + this.rangeValueStore = Ext.create('Ext.data.Store', { + fields: [idProperty, nameProperty], + listeners: { + add: function() { + container.rangeValueCmp.select(this.getRange()); + }, + remove: function() { + container.rangeValueCmp.select(this.getRange()); + } + } + }); + + this.rangeValueCmp = Ext.create('Ext.form.field.ComboBox', { + multiSelect: true, + style: 'margin-bottom:0', + width: valueCmpWidth, + valueField: idProperty, + displayField: nameProperty, + emptyText: 'No selected items', + editable: false, + hideTrigger: true, + queryMode: 'local', + hidden: true, + store: container.rangeValueStore, + listConfig: { + minWidth: valueCmpWidth, + cls: 'ns-optionselector' + }, + setOptionValues: function(records) { + var me = this; + + container.rangeValueStore.removeAll(); + container.rangeValueStore.loadData(records); + + me.setValue(records); + }, + listeners: { + change: function(cmp, newVal, oldVal) { + newVal = Ext.Array.from(newVal); + oldVal = Ext.Array.from(oldVal); + + if (newVal.length < oldVal.length) { + var id = Ext.Array.difference(oldVal, newVal)[0]; + container.rangeValueStore.removeAt(container.rangeValueStore.findExact(idProperty, id)); + } + } + } + }); + + // function + this.onRangeSetSelect = function(id) { + var ranges; + + if (id === defaultRangeSetId) { + container.operatorCmp.show(); + container.valueCmp.show(); + container.rangeSearchCmp.hide(); + container.rangeValueCmp.hide(); + } + else { + container.operatorCmp.hide(); + container.valueCmp.hide(); + container.rangeSearchCmp.show(); + container.rangeValueCmp.show(); + + ranges = Ext.clone(ns.core.init.idLegendSetMap[id].mapLegends); + + // display name + for (var i = 0; i < ranges.length; i++) { + range = ranges[i]; + range.displayName = range.name + ' (' + range.startValue + ' - ' + range.endValue + ')'; + } + + container.rangeSearchStore.loadData(ranges); + container.rangeSearchStore.sort('startValue', 'ASC'); + } + }; + + this.rangeSetCmp = Ext.create('Ext.form.field.ComboBox', { + cls: 'ns-combo h22', + width: rangeSetWidth, + height: 22, + fieldStyle: 'height: 22px', + queryMode: 'local', + valueField: idProperty, + displayField: nameProperty, + editable: false, + storage: {}, + store: Ext.create('Ext.data.Store', { + fields: [idProperty, nameProperty] + }), + listeners: { + added: function(cb) { + cb.store.add({ + id: defaultRangeSetId, + name: 'No range set' + }); + + cb.setValue(defaultRangeSetId); + + Ext.Ajax.request({ + url: ns.core.init.contextPath + '/api/dataElements/' + container.dataElement.id + '.json?fields=legendSet[id,name]', + success: function(r) { + r = Ext.decode(r.responseText); + + if (Ext.isObject(r) && Ext.isObject(r.legendSet)) { + cb.store.add(r.legendSet); + } + } + }); + }, + select: function(cb, r) { + var id = Ext.Array.from(r)[0].data.id; + container.onRangeSetSelect(id); + } } }); this.items = [ - this.nameCmp, + { + xtype: 'container', + layout: 'hbox', + width: nameCmpWidth, + items: [ + this.nameCmp, + this.addCmp, + this.removeCmp + ] + }, + this.rangeSearchCmp, + this.rangeValueCmp, this.operatorCmp, this.valueCmp, - this.addCmp, - this.removeCmp + this.rangeSetCmp ]; this.callParent(); @@ -232,10 +429,31 @@ this.nameCmp = Ext.create('Ext.form.Label', { text: this.dataElement.name, - width: nameCmpWidth, + flex: 1, style: 'padding:' + namePadding }); + this.addCmp = Ext.create('Ext.button.Button', { + cls: 'ns-linkbutton', + style: 'padding: 0', + height: 18, + text: 'Duplicate', + handler: function() { + container.duplicateDataElement(); + } + }); + + this.removeCmp = Ext.create('Ext.button.Button', { + cls: 'ns-linkbutton', + style: 'padding: 0', + height: 18, + text: 'Remove', + handler: function() { + container.removeDataElement(); + } + }); + + this.operatorCmp = Ext.create('Ext.form.field.ComboBox', { valueField: 'id', displayField: 'name', @@ -254,32 +472,23 @@ }); this.valueCmp = Ext.create('Ext.form.field.Text', { - width: valueCmpWidth, + width: nameCmpWidth - operatorCmpWidth, style: 'margin-bottom:0' }); - this.addCmp = Ext.create('Ext.button.Button', { - text: '+', - width: buttonCmpWidth, - handler: function() { - container.duplicateDataElement(); - } - }); - - this.removeCmp = Ext.create('Ext.button.Button', { - text: 'x', - width: buttonCmpWidth, - handler: function() { - container.removeDataElement(); - } - }); - this.items = [ - this.nameCmp, + { + xtype: 'container', + layout: 'hbox', + width: nameCmpWidth, + items: [ + this.nameCmp, + this.addCmp, + this.removeCmp + ] + }, this.operatorCmp, - this.valueCmp, - this.addCmp, - this.removeCmp + this.valueCmp ]; this.callParent(); @@ -317,10 +526,30 @@ this.nameCmp = Ext.create('Ext.form.Label', { text: this.dataElement.name, - width: nameCmpWidth, + flex: 1, style: 'padding:' + namePadding }); + this.addCmp = Ext.create('Ext.button.Button', { + cls: 'ns-linkbutton', + style: 'padding: 0', + height: 18, + text: 'Duplicate', + handler: function() { + container.duplicateDataElement(); + } + }); + + this.removeCmp = Ext.create('Ext.button.Button', { + cls: 'ns-linkbutton', + style: 'padding: 0', + height: 18, + text: 'Remove', + handler: function() { + container.removeDataElement(); + } + }); + this.operatorCmp = Ext.create('Ext.form.field.ComboBox', { valueField: 'id', displayField: 'name', @@ -343,33 +572,24 @@ }); this.valueCmp = Ext.create('Ext.form.field.Date', { - width: valueCmpWidth, + width: nameCmpWidth - operatorCmpWidth, style: 'margin-bottom:0', format: 'Y-m-d' }); - this.addCmp = Ext.create('Ext.button.Button', { - text: '+', - width: buttonCmpWidth, - handler: function() { - container.duplicateDataElement(); - } - }); - - this.removeCmp = Ext.create('Ext.button.Button', { - text: 'x', - width: buttonCmpWidth, - handler: function() { - container.removeDataElement(); - } - }); - this.items = [ - this.nameCmp, + { + xtype: 'container', + layout: 'hbox', + width: nameCmpWidth, + items: [ + this.nameCmp, + this.addCmp, + this.removeCmp + ] + }, this.operatorCmp, - this.valueCmp, - this.addCmp, - this.removeCmp + this.valueCmp ]; this.callParent(); @@ -404,10 +624,30 @@ this.nameCmp = Ext.create('Ext.form.Label', { text: this.dataElement.name, - width: nameCmpWidth, + flex: 1, style: 'padding:' + namePadding }); + this.addCmp = Ext.create('Ext.button.Button', { + cls: 'ns-linkbutton', + style: 'padding: 0', + height: 18, + text: 'Duplicate', + handler: function() { + container.duplicateDataElement(); + } + }); + + this.removeCmp = Ext.create('Ext.button.Button', { + cls: 'ns-linkbutton', + style: 'padding: 0', + height: 18, + text: 'Remove', + handler: function() { + container.removeDataElement(); + } + }); + this.valueCmp = Ext.create('Ext.form.field.ComboBox', { valueField: 'id', displayField: 'name', @@ -442,10 +682,17 @@ }); this.items = [ - this.nameCmp, - this.valueCmp, - this.addCmp, - this.removeCmp + { + xtype: 'container', + layout: 'hbox', + width: nameCmpWidth, + items: [ + this.nameCmp, + this.addCmp, + this.removeCmp + ] + }, + this.valueCmp ]; this.callParent(); @@ -458,12 +705,6 @@ layout: 'column', bodyStyle: 'border:0 none', style: 'margin: ' + margin, - addCss: function() { - var css = '.optionselector .x-boundlist-selected { background-color: #fff; border-color: #fff } \n'; - css += '.optionselector .x-boundlist-selected.x-boundlist-item-over { background-color: #ddd; border-color: #ddd } \n'; - - Ext.util.CSS.createStyleSheet(css); - }, getRecord: function() { var items = this.valueCmp.getValue(), record = { @@ -508,14 +749,32 @@ idProperty = 'code', nameProperty = 'name'; - this.addCss(); - this.nameCmp = Ext.create('Ext.form.Label', { text: this.dataElement.name, - width: nameCmpWidth, + flex: 1, style: 'padding:' + namePadding }); + this.addCmp = Ext.create('Ext.button.Button', { + cls: 'ns-linkbutton', + style: 'padding: 0', + height: 18, + text: 'Duplicate', + handler: function() { + container.duplicateDataElement(); + } + }); + + this.removeCmp = Ext.create('Ext.button.Button', { + cls: 'ns-linkbutton', + style: 'padding: 0', + height: 18, + text: 'Remove', + handler: function() { + container.removeDataElement(); + } + }); + this.operatorCmp = Ext.create('Ext.form.field.ComboBox', { valueField: 'id', displayField: 'name', @@ -593,7 +852,7 @@ this.searchCmp = Ext.create('Ext.form.field.ComboBox', { multiSelect: true, - width: 62, + width: operatorCmpWidth - triggerCmpWidth, style: 'margin-bottom:0', emptyText: 'Search..', valueField: idProperty, @@ -602,7 +861,7 @@ enableKeyEvents: true, queryMode: 'local', listConfig: { - minWidth: 346 + minWidth: nameCmpWidth - operatorCmpWidth }, store: this.searchStore, listeners: { @@ -644,7 +903,7 @@ this.triggerCmp = Ext.create('Ext.button.Button', { cls: 'ns-button-combotrigger', disabledCls: 'ns-button-combotrigger-disabled', - width: 18, + width: triggerCmpWidth, height: 22, handler: function(b) { container.searchStore.loadOptionSet(); @@ -666,7 +925,7 @@ this.valueCmp = Ext.create('Ext.form.field.ComboBox', { multiSelect: true, style: 'margin-bottom:0', - width: 226, + width: nameCmpWidth - operatorCmpWidth - operatorCmpWidth, valueField: idProperty, displayField: nameProperty, emptyText: 'No selected items', @@ -676,7 +935,7 @@ queryMode: 'local', listConfig: { minWidth: 266, - cls: 'optionselector' + cls: 'ns-optionselector' }, setOptionValues: function(codeArray) { var me = this, @@ -706,31 +965,21 @@ } }); - this.addCmp = Ext.create('Ext.button.Button', { - text: '+', - width: buttonCmpWidth, - style: 'font-weight:bold', - handler: function() { - container.duplicateDataElement(); - } - }); - - this.removeCmp = Ext.create('Ext.button.Button', { - text: 'x', - width: buttonCmpWidth, - handler: function() { - container.removeDataElement(); - } - }); - this.items = [ - this.nameCmp, + { + xtype: 'container', + layout: 'hbox', + width: nameCmpWidth, + items: [ + this.nameCmp, + this.addCmp, + this.removeCmp + ] + }, this.operatorCmp, this.searchCmp, this.triggerCmp, - this.valueCmp, - this.addCmp, - this.removeCmp + this.valueCmp ]; this.callParent(); @@ -7817,6 +8066,15 @@ } }); + // legend sets + requests.push({ + url: contextPath + '/api/mapLegendSets.json?fields=id,name,mapLegends[id,name,startValue,endValue,color]&paging=false', + success: function(r) { + init.legendSets = Ext.decode(r.responseText).mapLegendSets || []; + fn(); + } + }); + // dimensions requests.push({ url: init.contextPath + '/api/organisationUnitGroupSets.json?fields=id,' + namePropertyUrl + '&paging=false', === modified file 'dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-event-reports/scripts/core.js' --- dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-event-reports/scripts/core.js 2015-02-19 11:36:06 +0000 +++ dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-event-reports/scripts/core.js 2015-02-24 10:48:21 +0000 @@ -169,7 +169,7 @@ conf.report = { digitGroupSeparator: { 'comma': ',', - 'space': ' ' + 'space': ' ' }, displayDensity: { 'compact': '3px', @@ -2043,6 +2043,13 @@ paramString += encodeURIComponent(item.id) + ((j < (dim.items.length - 1)) ? ';' : ''); } } + else if (dim.rangeSet) { + paramString += '-' + dim.rangeSet; + + if (dim.filter) { + paramString += ':' + encodeURIComponent(dim.filter); + } + } else { paramString += dim.filter ? ':' + encodeURIComponent(dim.filter) : ''; } @@ -2064,6 +2071,13 @@ paramString += j < dim.items.length - 1 ? ';' : ''; } } + else if (dim.rangeSet) { + paramString += '-' + dim.rangeSet; + + if (dim.filter) { + paramString += ':' + encodeURIComponent(dim.filter); + } + } else { paramString += dim.filter ? ':' + encodeURIComponent(dim.filter) : ''; } @@ -3121,12 +3135,12 @@ } // legend set map - //init.idLegendSetMap = {}; + init.idLegendSetMap = {}; - //for (var i = 0, set; i < init.legendSets.length; i++) { - //set = init.legendSets[i]; - //init.idLegendSetMap[set.id] = set; - //} + for (var i = 0, set; i < init.legendSets.length; i++) { + set = init.legendSets[i]; + init.idLegendSetMap[set.id] = set; + } }()); // instance === modified file 'dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-event-reports/styles/style.css' --- dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-event-reports/styles/style.css 2015-02-17 14:52:40 +0000 +++ dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-event-reports/styles/style.css 2015-02-24 12:14:13 +0000 @@ -49,6 +49,7 @@ body, .x-body, +.x-btn-default-small .x-btn-inner, .x-btn-default-toolbar-small .x-btn-inner, .x-form-item, .x-panel-header-text-default, @@ -435,13 +436,23 @@ /* Custom */ .ns-combo.h21 .x-form-trigger { - height: 21px; + height: 21px !important; } .ns-combo.h22 .x-form-trigger { - height: 22px; + height: 22px !important; } .ns-combo.h24 .x-form-trigger { - height: 24px; + height: 24px !important; +} + + /* Option selector */ +.ns-optionselector .x-boundlist-selected { + background-color: #fff; + border-color: #fff +} +.ns-optionselector .x-boundlist-selected.x-boundlist-item-over { + background-color: #ddd; + border-color: #ddd } @@ -805,6 +816,7 @@ background-image: url('../images/trigger.gif'); background-position: 0 0; width: 17px; + border-top-right-radius: 2px; } .ns-button-combotrigger-disabled, .ns-button-combotrigger-disabled * { @@ -812,6 +824,19 @@ cursor: default !important; } + /* Link button */ +.ns-linkbutton.x-btn-default-small { + border: 1px solid transparent; + background: transparent; +} +.ns-linkbutton .x-btn-inner { + color: #4a66ae; + color: #3162c5; +} +.ns-linkbutton.x-btn-over .x-btn-inner { + text-decoration: underline; +} + /*---------------------------------------------------------------------------- * Tooltip === modified file 'dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-event-visualizer/styles/style.css' --- dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-event-visualizer/styles/style.css 2015-02-19 17:03:12 +0000 +++ dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-event-visualizer/styles/style.css 2015-02-24 12:15:47 +0000 @@ -783,6 +783,7 @@ background-image: url('../images/trigger.gif'); background-position: 0 0; width: 17px; + border-top-right-radius: 2px; } .ns-button-combotrigger-disabled, .ns-button-combotrigger-disabled * { === modified file 'dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-mapping/styles/style.css' --- dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-mapping/styles/style.css 2015-01-06 15:00:31 +0000 +++ dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-mapping/styles/style.css 2015-02-24 12:15:47 +0000 @@ -595,6 +595,7 @@ background-image: url('../images/trigger.gif'); background-position: 0 0; width: 17px; + border-top-right-radius: 2px; } .gis-button-combotrigger-disabled, .gis-button-combotrigger-disabled * { === modified file 'dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-pivot/scripts/core.js' --- dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-pivot/scripts/core.js 2015-02-10 16:04:57 +0000 +++ dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-pivot/scripts/core.js 2015-02-24 10:48:21 +0000 @@ -179,7 +179,7 @@ conf.pivot = { digitGroupSeparator: { 'comma': ',', - 'space': ' ' + 'space': ' ' }, displayDensity: { 'xcompact': '2px',