spam-info-grid: style the spam info grid via css variables

[pmg-gui.git] / js / HourlyMailDistribution.js

diff --git a/js/HourlyMailDistribution.js b/js/HourlyMailDistribution.js
index 5231a454b5598abb8c7c33a9f461f9dac082f93b..a15b1a46615c4e6cbec9f7642be60548c2f7a9d3 100644 (file)
--- a/js/HourlyMailDistribution.js
+++ b/js/HourlyMailDistribution.js
@@ -11,11 +11,11 @@ Ext.define('PMG.MailDistChart', {
        title: gettext('Count'),
        position: 'left',
        grid: true,
-       minimum: 0
+       minimum: 0,
     }, {
        type: 'category',
        position: 'bottom',
-       fields: ['index']
+       fields: ['index'],
     }],
 
     initComponent: function() {
@@ -41,12 +41,13 @@ Ext.define('PMG.MailDistChart', {
                renderer: function(tooltip, record, item) {
                    var start = record.get('index');
                    var end = start+1;
-                   tooltip.setHtml('Time: ' + start + ' - ' + end + '<br>' +
+                   tooltip.setHtml('Time: ' + start.toString() +
+                                   ' - ' + end.toString() + '<br>' +
                                    'Count: ' + record.get(item.field));
-               }
-           }
+               },
+           },
        });
-    }
+    },
 });
 
 Ext.define('PMG.HourlyMailDistribution', {
@@ -54,15 +55,19 @@ Ext.define('PMG.HourlyMailDistribution', {
     xtype: 'pmgHourlyMailDistribution',
 
     scrollable: true,
+    border: false,
 
-    bodyPadding: '0 0 10 0',
+    bodyPadding: '10 0 0 0',
     defaults: {
-       margin: '10 10 0 10'
+       width: 700,
+       padding: '0 0 10 10',
     },
 
-    title: gettext('Hourly Distribution'),
+    layout: 'column',
+
+    title: gettext('Statistics') + ': ' + gettext('Hourly Distribution'),
 
-    tbar: [ { xtype: 'pmgStatTimeSelector' } ],
+    tbar: [{ xtype: 'pmgStatTimeSelector' }],
 
     initComponent: function() {
        var me = this;
@@ -80,7 +85,7 @@ Ext.define('PMG.HourlyMailDistribution', {
                { type: 'integer', name: 'viruscount_ou' },
                { type: 'integer', name: 'bounces_in' },
                { type: 'integer', name: 'bounces_out' },
-           ]
+           ],
        });
 
        me.items = [
@@ -88,18 +93,18 @@ Ext.define('PMG.HourlyMailDistribution', {
                xtype: 'pmgMailDistChart',
                title: gettext('Incoming Mails'),
                field: 'count_in',
-               store: store
+               store: store,
            },
            {
                xtype: 'pmgMailDistChart',
                title: gettext('Outgoing Mails'),
                field: 'count_out',
-               store: store
-           }
+               store: store,
+           },
        ];
 
        me.callParent();
 
        me.on('destroy', store.destroy, store);
-    }
+    },
 });