hourly mail distribution chart: add dynamic color switching

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

diff --git a/js/RuleInfo.js b/js/RuleInfo.js
index 6989fe01990685c907f9ac46b164424ed0a8c545..b7802fa261cc0075ad917bda70037b402b58b0b6 100644 (file)
--- a/js/RuleInfo.js
+++ b/js/RuleInfo.js
@@ -27,9 +27,9 @@ Ext.define('PMG.RuleInfo', {
                success: function(response, opts) {
                    me.setRuleInfo(response.result.data);
                },
-               failure: function (response, opts) {
+               failure: function(response, opts) {
                    Ext.Msg.alert(gettext('Error'), response.htmlStatus);
-               }
+               },
            });
        },
 
@@ -49,12 +49,12 @@ Ext.define('PMG.RuleInfo', {
                            callback: function() {
                                me.reload();
                            },
-                           failure: function (response, opts) {
+                           failure: function(response, opts) {
                                Ext.Msg.alert(gettext('Error'), response.htmlStatus);
-                           }
+                           },
                        });
                    }
-               }
+               },
            );
        },
 
@@ -62,7 +62,7 @@ Ext.define('PMG.RuleInfo', {
            var me = this;
            var baseurl = me.getViewModel().get('baseurl');
            var url = baseurl + '/' + type;
-           var id = (type === 'action')?record.data.ogroup:record.data.id;
+           var id = type === 'action'?record.data.ogroup:record.data.id;
            Proxmox.Utils.API2Request({
                url: url,
                params: { ogroup: id },
@@ -71,9 +71,9 @@ Ext.define('PMG.RuleInfo', {
                callback: function() {
                    me.reload();
                },
-               failure: function (response, opts) {
+               failure: function(response, opts) {
                    Ext.Msg.alert(gettext('Error'), response.htmlStatus);
-               }
+               },
            });
        },
 
@@ -83,18 +83,14 @@ Ext.define('PMG.RuleInfo', {
            var viewmodel = me.getViewModel();
 
            if (ruledata === undefined) {
-
                viewmodel.set('selectedRule', null);
                viewmodel.get('objects').setData([]);
-
            } else {
-
                ruledata.name = Ext.String.htmlEncode(ruledata.name);
                viewmodel.set('selectedRule', ruledata);
 
                var data = [];
                Ext.Array.each(['from', 'to', 'when', 'what', 'action'], function(oc) {
-
                    var store = viewmodel.get(oc + 'objects');
                    if (ruledata[oc] === undefined || store === undefined) { return; }
 
@@ -105,15 +101,15 @@ Ext.define('PMG.RuleInfo', {
 
                    var ids = Ext.Array.pluck(ruledata[oc], 'id');
                    // for the actions, we have a different id field
-                   var idField = (oc === 'action')?'ogroup':'id';
+                   var idField = oc === 'action'?'ogroup':'id';
                    store.clearFilter();
                    store.addFilter({
-                       filterFn:function(record){
+                       filterFn: function(record) {
                            // FIXME
                            // actions have the ogroup as a string
                            // -> parseInt
-                           return (ids.indexOf(parseInt(record.data[idField])) === -1);
-                       }
+                           return ids.indexOf(parseInt(record.data[idField], 10)) === -1;
+                       },
                    });
                    store.load();
                    Ext.Array.each(ruledata[oc], function(og) {
@@ -152,24 +148,24 @@ Ext.define('PMG.RuleInfo', {
 
        control: {
            'grid[reference=usedobjects]': {
-               drop: 'addDrop'
+               drop: 'addDrop',
            },
            'tabpanel[reference=availobjects] > grid': {
-               drop: 'removeDrop'
-           }
+               drop: 'removeDrop',
+           },
        },
     },
 
     viewModel: {
        data: {
-           baseurl: undefined,
+           baseurl: '',
        },
 
        stores: {
            objects: {
                fields: ['oclass', 'name', 'typeid'],
                groupField: 'oclass',
-               sorters: 'name'
+               sorters: 'name',
            },
 
            actionobjects: {
@@ -178,7 +174,7 @@ Ext.define('PMG.RuleInfo', {
                    type: 'proxmox',
                    url: "/api2/json/config/ruledb/action/objects",
                },
-               sorters: 'name'
+               sorters: 'name',
            },
            fromobjects: {
                model: 'pmg-object-group',
@@ -186,7 +182,7 @@ Ext.define('PMG.RuleInfo', {
                    type: 'proxmox',
                    url: "/api2/json/config/ruledb/who",
                },
-               sorters: 'name'
+               sorters: 'name',
            },
            toobjects: {
                model: 'pmg-object-group',
@@ -194,7 +190,7 @@ Ext.define('PMG.RuleInfo', {
                    type: 'proxmox',
                    url: "/api2/json/config/ruledb/who",
                },
-               sorters: 'name'
+               sorters: 'name',
            },
            whatobjects: {
                model: 'pmg-object-group',
@@ -202,7 +198,7 @@ Ext.define('PMG.RuleInfo', {
                    type: 'proxmox',
                    url: "/api2/json/config/ruledb/what",
                },
-               sorters: 'name'
+               sorters: 'name',
            },
            whenobjects: {
                model: 'pmg-object-group',
@@ -210,9 +206,9 @@ Ext.define('PMG.RuleInfo', {
                    type: 'proxmox',
                    url: "/api2/json/config/ruledb/when",
                },
-               sorters: 'name'
+               sorters: 'name',
            },
-       }
+       },
     },
 
 
@@ -224,7 +220,7 @@ Ext.define('PMG.RuleInfo', {
 
     layout: {
        type: 'vbox',
-       align: 'stretch'
+       align: 'stretch',
     },
 
     scrollable: true,
@@ -232,9 +228,9 @@ Ext.define('PMG.RuleInfo', {
     items: [
        {
            xtype: 'panel',
-           bodyPadding: 10,
+           bodyPadding: '10 10 10 10',
            data: {
-               name: false,
+               name: '',
            },
            bind: {
                data: {
@@ -242,18 +238,18 @@ Ext.define('PMG.RuleInfo', {
                    priority: '{selectedRule.priority}',
                    active: '{selectedRule.active}',
                    direction: '{selectedRule.direction}',
-                   selected: '{selectedRule}'
-               }
+                   selected: '{selectedRule}',
+               },
            },
            tpl: [
                '<tpl if="selected">',
                '<b>{name}</b><br><br>',
-               'Priority: {priority}<br>',
-               'Direction: {[PMG.Utils.format_rule_direction(values.direction)]}<br>',
-               'Active: {[Proxmox.Utils.format_boolean(values.active)]}<br>',
+               gettext('Priority') + ': {priority}<br>',
+               gettext('Direction') + ': {[PMG.Utils.format_rule_direction(values.direction)]}<br>',
+               gettext('Active') + ': {[Proxmox.Utils.format_boolean(values.active)]}<br>',
                '<tpl else>',
                gettext('Please select a rule.'),
-               '</tpl>'
+               '</tpl>',
            ],
        },
        {
@@ -267,8 +263,8 @@ Ext.define('PMG.RuleInfo', {
                enableGroupingMenu: false,
                collapsible: false,
                groupHeaderTpl: [
-                   '{[PMG.Utils.format_oclass(values.name)]}'
-               ]
+                   '{[PMG.Utils.format_oclass(values.name)]}',
+               ],
            }],
 
            title: gettext('Used Objects'),
@@ -284,9 +280,9 @@ Ext.define('PMG.RuleInfo', {
                    dropZone: {
                        indicatorHtml: '',
                        indicatorCls: '',
-                       handleNodeDrop: Ext.emptyFn
-                   }
-               }
+                       handleNodeDrop: Ext.emptyFn,
+                   },
+               },
            },
 
            columns: [
@@ -298,25 +294,26 @@ Ext.define('PMG.RuleInfo', {
                {
                    header: gettext('Name'),
                    dataIndex: 'name',
-                   flex: 1
+                   flex: 1,
                },
                {
-                   header: gettext('Actions'),
+                   text: '',
                    xtype: 'actioncolumn',
-                   width: 65,
+                   align: 'center',
+                   width: 40,
                    items: [
                        {
-                           iconCls: 'x-fa fa-fw fa-minus-circle',
+                           iconCls: 'fa fa-fw fa-minus-circle',
                            tooltip: gettext('Remove'),
-                           handler: 'removeIconClick'
-                       }
-                   ]
-               }
+                           handler: 'removeIconClick',
+                       },
+                   ],
+               },
            ],
 
            bind: {
                store: '{objects}',
-               hidden: '{!selectedRule}'
+               hidden: '{!selectedRule}',
            },
        },
        {
@@ -325,7 +322,7 @@ Ext.define('PMG.RuleInfo', {
            reference: 'availobjects',
            hidden: true,
            bind: {
-               hidden: '{!selectedRule}'
+               hidden: '{!selectedRule}',
            },
            defaults: {
                xtype: 'grid',
@@ -340,35 +337,36 @@ Ext.define('PMG.RuleInfo', {
                        dropZone: {
                            indicatorHtml: '',
                            indicatorCls: '',
-                           handleNodeDrop: Ext.emptyFn
-                       }
-                   }
+                           handleNodeDrop: Ext.emptyFn,
+                       },
+                   },
                },
                columns: [
                    {
                        header: gettext('Name'),
                        dataIndex: 'name',
-                       flex: 1
+                       flex: 1,
                    },
                    {
-                       header: gettext('Actions'),
-                       width: 65,
+                       text: '',
                        xtype: 'actioncolumn',
+                       align: 'center',
+                       width: 40,
                        items: [
                            {
-                               iconCls: 'x-fa fa-fw fa-plus-circle',
+                               iconCls: 'fa fa-fw fa-plus-circle',
                                tooltip: gettext('Add'),
-                               handler: 'addIconClick'
-                           }
-                       ]
-                   }
+                               handler: 'addIconClick',
+                           },
+                       ],
+                   },
                ],
            },
            items: [
                {
                    title: gettext('Action'),
                    bind: {
-                       store: '{actionobjects}'
+                       store: '{actionobjects}',
                    },
                    type: 'action',
                    iconCls: 'fa fa-flag',
@@ -378,7 +376,7 @@ Ext.define('PMG.RuleInfo', {
                    iconCls: 'fa fa-user-circle',
                    type: 'from',
                    bind: {
-                       store: '{fromobjects}'
+                       store: '{fromobjects}',
                    },
                },
                {
@@ -386,7 +384,7 @@ Ext.define('PMG.RuleInfo', {
                    iconCls: 'fa fa-user-circle',
                    type: 'to',
                    bind: {
-                       store: '{toobjects}'
+                       store: '{toobjects}',
                    },
                },
                {
@@ -394,7 +392,7 @@ Ext.define('PMG.RuleInfo', {
                    iconCls: 'fa fa-cube',
                    type: 'what',
                    bind: {
-                       store: '{whatobjects}'
+                       store: '{whatobjects}',
                    },
                },
                {
@@ -402,10 +400,10 @@ Ext.define('PMG.RuleInfo', {
                    iconCls: 'fa fa-clock-o',
                    type: 'when',
                    bind: {
-                       store: '{whenobjects}'
+                       store: '{whenobjects}',
                    },
                },
-           ]
-       }
-    ]
+           ],
+       },
+    ],
 });