=== modified file 'dhis-2/dhis-web/dhis-web-pivot/src/main/webapp/dhis-web-pivot/app/scripts/app.js' --- dhis-2/dhis-web/dhis-web-pivot/src/main/webapp/dhis-web-pivot/app/scripts/app.js 2013-02-22 17:27:36 +0000 +++ dhis-2/dhis-web/dhis-web-pivot/src/main/webapp/dhis-web-pivot/app/scripts/app.js 2013-02-25 13:47:24 +0000 @@ -72,10 +72,10 @@ var vpw = pt.viewport.getWidth(), targetx = target ? target.getPosition()[0] : 4, winw = w.getWidth(), - y = target ? target.getPosition()[1] + target.getHeight() + 6 : 35; + y = target ? target.getPosition()[1] + target.getHeight() + 4 : 33; if ((targetx + winw) > vpw) { - w.setPosition((vpw - winw - 4), y); + w.setPosition((vpw - winw - 2), y); } else { w.setPosition(targetx, y); @@ -144,6 +144,8 @@ } }(); + config.options = pt.viewport.optionsWindow.getOptions(); + return config; }; @@ -224,10 +226,10 @@ sortStore: function() { this.sort('name', 'ASC'); }, - isloaded: false, + isLoaded: false, listeners: { load: function(s) { - this.isloaded = true; + this.isLoaded = true; s.each( function(r) { r.data.name = pt.conf.util.jsonEncodeString(r.data.name); }); @@ -288,7 +290,7 @@ return cmp; }; - PT.app.SettingsWindow = function(pt) { + PT.app.SettingsWindow = function() { var dimension, dimensionStore, dimensionOrder, @@ -584,7 +586,132 @@ listeners: { show: function(w) { pt.util.window.setAnchorPosition(w, pt.viewport.layoutButton); - nissa = w; + } + } + }); + + return window; + }; + + PT.app.OptionsWindow = function() { + var showSubTotals, + cellPadding, + fontSize, + + data, + style, + window; + + showSubTotals = Ext.create('Ext.form.field.Checkbox', { + boxLabel: 'Show sub totals' + }); + + cellPadding = Ext.create('Ext.form.field.ComboBox', { + fieldLabel: 'Display density', + labelStyle: 'color:#333', + cls: 'pt-combo', + width: 230, + queryMode: 'local', + valueField: 'id', + editable: false, + value: 'normal', + store: Ext.create('Ext.data.Store', { + fields: ['id', 'text'], + data: [ + {id: 'comfortable', text: 'Comfortable'}, + {id: 'normal', text: 'Normal'}, + {id: 'compact', text: 'Compact'} + ] + }) + }); + + fontSize = Ext.create('Ext.form.field.ComboBox', { + xtype: 'combobox', + fieldLabel: 'Font size', + labelStyle: 'color:#333', + cls: 'pt-combo', + width: 230, + queryMode: 'local', + valueField: 'id', + editable: false, + value: 'normal', + store: Ext.create('Ext.data.Store', { + fields: ['id', 'text'], + data: [ + {id: 'large', text: 'Large'}, + {id: 'normal', text: 'Normal'}, + {id: 'small', text: 'Small'} + ] + }) + }); + + data = { + bodyStyle: 'border:0 none', + style: 'margin-left:14px', + items: [ + showSubTotals + ] + }; + + style = { + bodyStyle: 'border:0 none', + style: 'margin-left:14px', + items: [ + cellPadding, + fontSize + ] + }; + + window = Ext.create('Ext.window.Window', { + title: 'Table options', //i18n + bodyStyle: 'background-color:#fff; padding:8px 8px 3px', + closeAction: 'hide', + autoShow: true, + modal: true, + resizable: false, + getOptions: function() { + return { + showSubTotals: showSubTotals.getValue(), + cellPadding: cellPadding.getValue(), + fontSize: fontSize.getValue() + }; + }, + items: [ + { + bodyStyle: 'border:0 none; color:#444; font-size:12px; font-weight:bold', + style: 'margin-bottom:6px', + html: 'Data' + }, + data, + { + bodyStyle: 'border:0 none; padding:7px' + }, + { + bodyStyle: 'border:0 none; color:#444; font-size:12px; font-weight:bold', + style: 'margin-bottom:6px', + html: 'Style' + }, + style + ], + bbar: [ + '->', + { + text: 'Hide', + handler: function() { + window.hide(); + } + }, + { + text: 'Update', + handler: function() { + pt.viewport.updateViewport(); + window.hide(); + } + } + ], + listeners: { + show: function(w) { + pt.util.window.setAnchorPosition(w, pt.viewport.optionsButton); } } }); @@ -732,12 +859,12 @@ { xtype: 'combobox', cls: 'pt-combo', - style: 'margin-bottom:4px', + style: 'margin-bottom:4px; margin-top:2px', width: pt.conf.layout.west_fieldset_width - pt.conf.layout.west_width_padding, valueField: 'id', displayField: 'name', fieldLabel: 'Select group', //i18n pt.i18n.select_group - labelStyle: 'padding-left:6px', + labelStyle: 'padding-left:8px', editable: false, store: { xtype: 'store', @@ -920,12 +1047,12 @@ { xtype: 'combobox', cls: 'pt-combo', - style: 'margin-bottom:4px', + style: 'margin-bottom:4px; margin-top:2px', width: pt.conf.layout.west_fieldset_width - pt.conf.layout.west_width_padding, valueField: 'id', displayField: 'name', fieldLabel: 'Select group', //i18n pt.i18n.select_group - labelStyle: 'padding-left:6px', + labelStyle: 'padding-left:8px', editable: false, store: { xtype: 'store', @@ -1082,7 +1209,6 @@ dataSet = { xtype: 'panel', title: '
Reporting rates
', //i18n - bodyStyle: 'padding-top:3px', hideCollapseTool: true, getData: function() { var data = { @@ -1103,6 +1229,10 @@ this, pt.conf.layout.west_fill_accordion_dataset ); + + if (!pt.store.dataSetAvailable.isLoaded) { + pt.store.dataSetAvailable.load(); + } }, items: [ { @@ -1442,6 +1572,7 @@ xtype: 'panel', layout: 'column', bodyStyle: 'border-style:none', + style: 'margin-top:2px', items: [ { xtype: 'combobox', @@ -1451,7 +1582,7 @@ valueField: 'id', displayField: 'name', fieldLabel: 'Select type', //i18n pt.i18n.select_type, - labelStyle: 'padding-left:6px', + labelStyle: 'padding-left:8px', editable: false, queryMode: 'remote', store: pt.store.periodType, @@ -1526,7 +1657,7 @@ //id: 'organisationunit_t', xtype: 'panel', title: '
Organisation units
', //i18n pt.i18n.organisation_units - bodyStyle: 'padding-top:6px', + bodyStyle: 'padding-top:5px', hideCollapseTool: true, collapsed: false, getData: function() { @@ -1557,7 +1688,7 @@ boxLabel: 'User organisation unit', //i18n pt.i18n.user_orgunit, labelWidth: pt.conf.layout.form_label_width, handler: function(chb, checked) { - pt.cmp.dimension.organisationUnit.toolbar.xable(checked, pt.cmp.favorite.userOrganisationUnitChildren.getValue()); + //pt.cmp.dimension.organisationUnit.toolbar.xable(checked, pt.cmp.favorite.userOrganisationUnitChildren.getValue()); pt.cmp.dimension.organisationUnit.treepanel.xable(checked, pt.cmp.favorite.userOrganisationUnitChildren.getValue()); }, listeners: { @@ -1572,7 +1703,7 @@ boxLabel: 'User organisation unit children', //i18n pt.i18n.user_orgunit_children, labelWidth: pt.conf.layout.form_label_width, handler: function(chb, checked) { - pt.cmp.dimension.organisationUnit.toolbar.xable(checked, pt.cmp.favorite.userOrganisationUnit.getValue()); + //pt.cmp.dimension.organisationUnit.toolbar.xable(checked, pt.cmp.favorite.userOrganisationUnit.getValue()); pt.cmp.dimension.organisationUnit.treepanel.xable(checked, pt.cmp.favorite.userOrganisationUnit.getValue()); }, listeners: { @@ -1583,93 +1714,93 @@ } ] }, - { - id: 'organisationunit_t', - xtype: 'toolbar', - style: 'margin-bottom: 4px', - width: pt.conf.layout.west_fieldset_width - pt.conf.layout.west_width_padding, - xable: function(checked, value) { - if (checked || value) { - this.disable(); - } - else { - this.enable(); - } - }, - defaults: { - height: 22 - }, - items: [ - { - xtype: 'label', - text: 'Auto-select organisation units by', //i18n - style: 'padding-left:8px; color:#666; line-height:23px' - }, - '->', - { - text: 'Group..', - handler: function() {}, - listeners: { - added: function() { - this.menu = Ext.create('Ext.menu.Menu', { - shadow: false, - showSeparator: false, - width: pt.conf.layout.treepanel_toolbar_menu_width_group, - items: [ - { - xtype: 'grid', - cls: 'pt-menugrid', - width: pt.conf.layout.treepanel_toolbar_menu_width_group, - scroll: 'vertical', - columns: [ - { - dataIndex: 'name', - width: pt.conf.layout.treepanel_toolbar_menu_width_group, - style: 'display:none' - } - ], - setHeightInMenu: function(store) { - var h = store.getCount() * 24, - sh = pt.util.viewport.getSize().y * 0.6; - this.setHeight(h > sh ? sh : h); - this.doLayout(); - this.up('menu').doLayout(); - }, - store: pt.store.group, - listeners: { - itemclick: function(g, r) { - g.getSelectionModel().select([], false); - this.up('menu').hide(); - pt.cmp.dimension.organisationUnit.treepanel.selectByGroup(r.data.id); - } - } - } - ], - listeners: { - show: function() { - var store = pt.store.group; + //{ + //id: 'organisationunit_t', + //xtype: 'toolbar', + //style: 'margin-bottom: 4px', + //width: pt.conf.layout.west_fieldset_width - pt.conf.layout.west_width_padding, + //xable: function(checked, value) { + //if (checked || value) { + //this.disable(); + //} + //else { + //this.enable(); + //} + //}, + //defaults: { + //height: 22 + //}, + //items: [ + //{ + //xtype: 'label', + //text: 'Auto-select organisation units by', //i18n + //style: 'padding-left:8px; color:#666; line-height:23px' + //}, + //'->', + //{ + //text: 'Group..', + //handler: function() {}, + //listeners: { + //added: function() { + //this.menu = Ext.create('Ext.menu.Menu', { + //shadow: false, + //showSeparator: false, + //width: pt.conf.layout.treepanel_toolbar_menu_width_group, + //items: [ + //{ + //xtype: 'grid', + //cls: 'pt-menugrid', + //width: pt.conf.layout.treepanel_toolbar_menu_width_group, + //scroll: 'vertical', + //columns: [ + //{ + //dataIndex: 'name', + //width: pt.conf.layout.treepanel_toolbar_menu_width_group, + //style: 'display:none' + //} + //], + //setHeightInMenu: function(store) { + //var h = store.getCount() * 24, + //sh = pt.util.viewport.getSize().y * 0.6; + //this.setHeight(h > sh ? sh : h); + //this.doLayout(); + //this.up('menu').doLayout(); + //}, + //store: pt.store.group, + //listeners: { + //itemclick: function(g, r) { + //g.getSelectionModel().select([], false); + //this.up('menu').hide(); + //pt.cmp.dimension.organisationUnit.treepanel.selectByGroup(r.data.id); + //} + //} + //} + //], + //listeners: { + //show: function() { + //var store = pt.store.group; - if (!store.isLoaded) { - store.load({scope: this, callback: function() { - this.down('grid').setHeightInMenu(store); - }}); - } - else { - this.down('grid').setHeightInMenu(store); - } - } - } - }); - } - } - } - ], - listeners: { - added: function() { - pt.cmp.dimension.organisationUnit.toolbar = this; - } - } - }, + //if (!store.isLoaded) { + //store.load({scope: this, callback: function() { + //this.down('grid').setHeightInMenu(store); + //}}); + //} + //else { + //this.down('grid').setHeightInMenu(store); + //} + //} + //} + //}); + //} + //} + //} + //], + //listeners: { + //added: function() { + //pt.cmp.dimension.organisationUnit.toolbar = this; + //} + //} + //}, { xtype: 'treepanel', cls: 'pt-tree', @@ -1975,7 +2106,6 @@ panel = { xtype: 'panel', title: '
' + groupSet.name + '
', //i18n - bodyStyle: 'padding-top:3px', hideCollapseTool: true, getData: function() { var data = { @@ -2147,9 +2277,9 @@ optionsButton = Ext.create('Ext.button.Button', { text: 'Options', handler: function() { - if (!pt.viewport.optionsWindow) { - pt.viewport.optionsWindow = PT.app.OptionsWindow(pt); - } + //if (!pt.viewport.optionsWindow) { + //pt.viewport.optionsWindow = PT.app.OptionsWindow(pt); + //} pt.viewport.optionsWindow.show(); } @@ -2307,8 +2437,11 @@ pt.cmp = PT.app.getCmp(); pt.viewport = createViewport(); - pt.viewport.settingsWindow = PT.app.SettingsWindow(pt); + pt.viewport.settingsWindow = PT.app.SettingsWindow(); pt.viewport.settingsWindow.hide(); + + pt.viewport.optionsWindow = PT.app.OptionsWindow(); + pt.viewport.optionsWindow.hide(); }; Ext.Ajax.request({ === modified file 'dhis-2/dhis-web/dhis-web-pivot/src/main/webapp/dhis-web-pivot/app/scripts/core.js' --- dhis-2/dhis-web/dhis-web-pivot/src/main/webapp/dhis-web-pivot/app/scripts/core.js 2013-02-22 16:25:57 +0000 +++ dhis-2/dhis-web/dhis-web-pivot/src/main/webapp/dhis-web-pivot/app/scripts/core.js 2013-02-25 13:37:47 +0000 @@ -124,13 +124,13 @@ conf.layout = { west_width: 424, west_fieldset_width: 416, - west_width_padding: 6, - west_fill: 6, - west_fill_accordion_indicator: 65, - west_fill_accordion_dataelement: 65, - west_fill_accordion_dataset: 35, - west_fill_accordion_period: 257, - west_fill_accordion_organisationunit: 96, + west_width_padding: 4, + west_fill: 2, + west_fill_accordion_indicator: 63, + west_fill_accordion_dataelement: 63, + west_fill_accordion_dataset: 33, + west_fill_accordion_period: 256, + west_fill_accordion_organisationunit: 95, west_maxheight_accordion_indicator: 620, west_maxheight_accordion_dataelement: 620, west_maxheight_accordion_dataset: 620, @@ -156,6 +156,19 @@ multiselect_fill_reportingrates: 315 }; + conf.pivot = { + cellPadding: { + 'compact': '3px', + 'normal': '5px', + 'comfortable': '10px' + }, + fontSize: { + 'small': '10px', + 'normal': '11px', + 'large': '13px' + } + }; + conf.util = { jsonEncodeString: function(str) { return typeof str === 'string' ? str.replace(/[^a-zA-Z 0-9(){}<>_!+;:?*&%#-]+/g,'') : str; @@ -412,8 +425,31 @@ }; util.pivot = { + getTdHtml: function(options, config) { + var cls, + colspan, + rowspan, + htmlValue, + cellPadding, + fontSize; + + if (!(config && Ext.isObject(config))) { + return ''; + } + + cls = config.cls ? 'class="' + config.cls + '"' : ''; + colspan = config.colspan ? 'colspan="' + config.colspan + '"' : ''; + rowspan = config.rowspan ? 'rowspan="' + config.rowspan + '"' : ''; + htmlValue = config.htmlValue || config.value || ' '; + cellPadding = pt.conf.pivot.cellPadding[config.cellPadding] || pt.conf.pivot.cellPadding[options.cellPadding]; + fontSize = pt.conf.pivot.fontSize[config.fontSize] || pt.conf.pivot.fontSize[options.fontSize]; + + return '' + htmlValue + ''; + }, + getTable: function(settings, pt, container) { - var getParamStringFromDimensions, + var options = settings.options, + getParamStringFromDimensions, extendSettings, validateResponse, extendResponse, @@ -881,27 +917,29 @@ htmlArray; doSubTotals = function(xAxis) { - var multiItemDimension = 0, - unique; - - if (!(true && xAxis && xAxis.dims > 1)) { - return false; - } - - unique = xAxis.xItems.unique; - - for (var i = 0; i < unique.length; i++) { - if (unique[i].length > 1) { - multiItemDimension++; - } - } - - return (multiItemDimension > 1); + return !!options.showSubTotals; + + //var multiItemDimension = 0, + //unique; + + //if (!(options.showSubTotals && xAxis && xAxis.dims > 1)) { + //return false; + //} + + //unique = xAxis.xItems.unique; + + //for (var i = 0; i < unique.length; i++) { + //if (unique[i].length > 1) { + //multiItemDimension++; + //} + //} + + //return (multiItemDimension > 1); }; getEmptyHtmlArray = function() { return (xColAxis && xRowAxis) ? - ' ' : ''; + pt.util.pivot.getTdHtml(options, {cls: 'pivot-dim-empty', colspan: xRowAxis.dims, rowspan: xColAxis.dims}) : ''; }; getColAxisHtmlArray = function() { @@ -922,15 +960,25 @@ for (var j = 0, id; j < dimItems.length; j++) { id = dimItems[j]; - dimHtml.push('' + xResponse.metaData[id] + ''); + dimHtml.push(pt.util.pivot.getTdHtml(options, { + cls: 'pivot-dim', + colspan: colSpan, + htmlValue: xResponse.metaData[id] + })); - //todo subtotal if (doSubTotals(xColAxis) && i === 0) { - dimHtml.push(''); + dimHtml.push(pt.util.pivot.getTdHtml(options, { + cls: 'pivot-dim-subtotal', + rowspan: xColAxis.dims + })); } if (i === 0 && j === (dimItems.length - 1)) { - dimHtml.push('Total'); + dimHtml.push(pt.util.pivot.getTdHtml(options, { + cls: 'pivot-dim-total', + rowspan: xColAxis.dims, + htmlValue: 'Total' + })); } } @@ -965,7 +1013,11 @@ object = allObjects[j][i]; if (object.rowSpan) { - row.push('' + xResponse.metaData[object.id] + ''); + row.push(pt.util.pivot.getTdHtml(options, { + cls: 'pivot-dim nobreak', + rowspan: object.rowSpan, + htmlValue: xResponse.metaData[object.id] + })); } } @@ -974,7 +1026,10 @@ //todo subtotal if (doSubTotals(xRowAxis) && rowCount === rowUniqueFactor) { row = []; - row.push(''); + row.push(pt.util.pivot.getTdHtml(options, { + cls: 'pivot-dim-subtotal', + colspan: xRowAxis.dims + })); a.push(row); rowCount = 0; } @@ -1099,7 +1154,10 @@ //cls = value < 5000 ? 'bad' : (value < 20000 ? 'medium' : 'good'); //basic legendset //} - row.push('' + pt.util.number.pp(item.htmlValue) + ''); + row.push(pt.util.pivot.getTdHtml(options, { + cls: item.cls, + htmlValue: pt.util.number.pp(item.htmlValue) + })); } a.push(row); @@ -1144,7 +1202,10 @@ item = totalRowItems[i]; item.htmlValue = pt.util.number.roundIf(item.htmlValue, 1); - a.push(['' + pt.util.number.pp(item.htmlValue) + '']); + a.push([pt.util.pivot.getTdHtml(options, { + cls: item.cls, + htmlValue: pt.util.number.pp(item.htmlValue) + })]); } } @@ -1192,7 +1253,10 @@ item = totalColItems[i]; item.htmlValue = pt.util.number.roundIf(item.htmlValue, 1); - a.push('' + pt.util.number.pp(item.htmlValue) + ''); + a.push(pt.util.pivot.getTdHtml(options, { + cls: item.cls, + htmlValue: pt.util.number.pp(item.htmlValue) + })); } } @@ -1212,7 +1276,10 @@ grandTotalSum = Ext.Array.sum(values) || 0; grandTotalSum = pt.util.number.roundIf(grandTotalSum, 1); - a.push('' + pt.util.number.pp(grandTotalSum) + ''); + a.push(pt.util.pivot.getTdHtml(options, { + cls: 'pivot-value-grandtotal', + htmlValue: pt.util.number.pp(grandTotalSum) + })); } return a; @@ -1242,7 +1309,11 @@ a = []; if (xRowAxis) { - dimTotalArray = ['Total']; + dimTotalArray = [pt.util.pivot.getTdHtml(options, { + cls: 'pivot-dim-total', + colspan: xRowAxis.dims, + htmlValue: 'Total' + })]; } row = [].concat(dimTotalArray || [], Ext.clone(colTotal) || [], Ext.clone(grandTotal) || []); @@ -1355,7 +1426,13 @@ removeEmptyDimensions, getValidatedAxis, - validateSettings; + validateSettings, + + defaultOptions = { + showSubTotals: true, + cellPadding: 'normal', + fontSize: 'normal' + }; removeEmptyDimensions = function(axis) { if (!axis) { @@ -1406,6 +1483,18 @@ return axis.length ? axis : null; }; + getValidatedOptions = function(options) { + if (!(options && Ext.isObject(options))) { + return defaultOptions; + } + + options.showSubTotals = Ext.isDefined(options.showSubTotals) ? options.showSubTotals : defaultOptions.showSubTotals; + options.cellPadding = options.cellPadding || defaultOptions.cellPadding; + options.fontSize = options.fontSize || defaultOptions.fontSize; + + return options; + }; + validateSettings = function() { var a = [].concat(Ext.clone(col), Ext.clone(row), Ext.clone(filter)), names = []; @@ -1460,6 +1549,8 @@ obj.filter = filter; } + obj.options = getValidatedOptions(config.options); + return obj; }(); }; === modified file 'dhis-2/dhis-web/dhis-web-pivot/src/main/webapp/dhis-web-pivot/app/scripts/plugin.js' --- dhis-2/dhis-web/dhis-web-pivot/src/main/webapp/dhis-web-pivot/app/scripts/plugin.js 2013-02-21 14:57:02 +0000 +++ dhis-2/dhis-web/dhis-web-pivot/src/main/webapp/dhis-web-pivot/app/scripts/plugin.js 2013-02-25 12:18:48 +0000 @@ -11,7 +11,12 @@ ], filter: [ {name: 'ou', items: ['ImspTQPwCqd']} - ] + ], + options: { + showSubTotals: false, + cellPadding: 'normal', + fontSize: 'normal' + } }; xSettings = { @@ -50,6 +55,11 @@ 'pe': ['201201', '201202', '201203'], 'Bpx0589u8y0': ['MAs88nJc9nL', 'PVLOW4bCshG'], 'ou': ['ImspTQPwCqd'] + }, + options: { + showSubTotals: false, + cellPadding: 'normal', + fontSize: 'normal' } }; === modified file 'dhis-2/dhis-web/dhis-web-pivot/src/main/webapp/dhis-web-pivot/app/styles/style.css' --- dhis-2/dhis-web/dhis-web-pivot/src/main/webapp/dhis-web-pivot/app/styles/style.css 2013-02-22 16:25:57 +0000 +++ dhis-2/dhis-web/dhis-web-pivot/src/main/webapp/dhis-web-pivot/app/styles/style.css 2013-02-25 13:37:19 +0000 @@ -322,6 +322,7 @@ .x-form-cb-label-after { padding-left: 1px; font-size: 11px; + color: #333; } /* Icons */ @@ -787,7 +788,7 @@ /* accordion item body */ .pt-accordion .x-accordion-body { - padding: 5px 3px 0px; + padding: 2px 2px 0px; border-top: 1px solid #c5c5c5 !important; }