ui: config panel: fix onlineHelp mapping targets

[pve-manager.git] / www / manager6 / panel / RunningChart.js

diff --git a/www/manager6/panel/RunningChart.js b/www/manager6/panel/RunningChart.js
index 2d9d32fafc84ad758614d814ad126280e9201202..19db8b5058f4a344d29e336aff034c7a3c236577 100644 (file)
--- a/www/manager6/panel/RunningChart.js
+++ b/www/manager6/panel/RunningChart.js
@@ -8,7 +8,7 @@ Ext.define('PVE.widget.RunningChart', {
 
     layout: {
        type: 'hbox',
-       align: 'center'
+       align: 'center',
     },
     items: [
        {
@@ -16,9 +16,9 @@ Ext.define('PVE.widget.RunningChart', {
            xtype: 'box',
            itemId: 'title',
            data: {
-               title: ''
+               title: '',
            },
-           tpl: '<h3>{title}:</h3>'
+           tpl: '<h3>{title}:</h3>',
        },
        {
            flex: 1,
@@ -31,13 +31,13 @@ Ext.define('PVE.widget.RunningChart', {
                    type: 'numeric',
                    position: 'left',
                    hidden: true,
-                   minimum: 0
+                   minimum: 0,
                },
                {
                    type: 'numeric',
                    position: 'bottom',
-                   hidden: true
-               }
+                   hidden: true,
+               },
            ],
 
            store: {
@@ -51,7 +51,7 @@ Ext.define('PVE.widget.RunningChart', {
                text: '0 B/s',
                textAlign: 'end',
                textBaseline: 'middle',
-               fontSize: 14
+               fontSize: 14,
            }],
 
            series: [{
@@ -62,35 +62,34 @@ Ext.define('PVE.widget.RunningChart', {
                colors: ['#cfcfcf'],
                tooltip: {
                    trackMouse: true,
-                   renderer: function( tooltip, record, ctx) {
-                       let me = this.getChart();
+                   renderer: function(tooltip, record, ctx) {
                        if (!record || !record.data) return;
-                       let date = new Date(record.data.time);
-                       let value = me.up().renderer(record.data.val);
-                       tooltip.setHtml(
-                           me.up().title + ': ' + value + '<br />' +
-                           Ext.Date.format(date, 'H:i:s')
-                       );
-                   }
+                       const view = this.getChart();
+                       const date = new Date(record.data.time);
+                       const value = view.up().renderer(record.data.val);
+                       const line1 = `${view.up().title}: ${value}`;
+                       const line2 = Ext.Date.format(date, 'H:i:s');
+                       tooltip.setHtml(`${line1}<br />${line2}`);
+                   },
                },
                style: {
                    lineWidth: 1.5,
-                   opacity: 0.60
+                   opacity: 0.60,
                },
                marker: {
                    opacity: 0,
                    scaling: 0.01,
                    fx: {
                        duration: 200,
-                       easing: 'easeOut'
-                   }
+                       easing: 'easeOut',
+                   },
                },
                highlightCfg: {
                    opacity: 1,
-                   scaling: 1.5
-               }
-           }]
-       }
+                   scaling: 1.5,
+               },
+           }],
+       },
     ],
 
     // the renderer for the tooltip and last value, default just the value
@@ -100,14 +99,14 @@ Ext.define('PVE.widget.RunningChart', {
     timeFrame: 5*60,
 
     addDataPoint: function(value, time) {
-       var me = this.chart;
-       var panel = me.up();
-       var now = new Date();
-       var begin = new Date(now.getTime() - (1000*panel.timeFrame));
+       let view = this.chart;
+       let panel = view.up();
+       let now = new Date().getTime();
+       let begin = new Date(now - 1000 * panel.timeFrame).getTime();
 
-       me.store.add({
-           time: time || now.getTime(),
-           val: value || 0
+       view.store.add({
+           time: time || now,
+           val: value || 0,
        });
 
        // delete all old records when we have 20 times more datapoints
@@ -117,36 +116,36 @@ Ext.define('PVE.widget.RunningChart', {
        // records in the store do not take much space, but like this,
        // we prevent a memory leak when someone has the site open for a long time
        // with minimal graphical glitches
-       if (me.store.count() > panel.timeFrame * 20) {
-           var oldData = me.store.getData().createFiltered(function(item) {
-               return item.data.time < begin.getTime();
+       if (view.store.count() > panel.timeFrame * 20) {
+           var oldData = view.store.getData().createFiltered(function(item) {
+               return item.data.time < begin;
            });
 
-           me.store.remove(oldData.getRange());
+           view.store.remove(oldData.getRange());
        }
 
-       me.timeaxis.setMinimum(begin.getTime());
-       me.timeaxis.setMaximum(now.getTime());
-       me.valuesprite.setText(panel.renderer(value || 0).toString());
-       me.valuesprite.setAttributes({
-           x: me.getWidth() - 15,
-           y: me.getHeight()/2
+       view.timeaxis.setMinimum(begin);
+       view.timeaxis.setMaximum(now);
+       view.valuesprite.setText(panel.renderer(value || 0).toString());
+       view.valuesprite.setAttributes({
+           x: view.getWidth() - 15,
+           y: view.getHeight()/2,
        }, true);
-       me.redraw();
+       view.redraw();
     },
 
     setTitle: function(title) {
        this.title = title;
-       var me = this.getComponent('title');
-       me.update({title: title});
+       let titlebox = this.getComponent('title');
+       titlebox.update({ title: title });
     },
 
-    initComponent: function(){
+    initComponent: function() {
        var me = this;
        me.callParent();
 
        if (me.title) {
-           me.getComponent('title').update({title: me.title});
+           me.getComponent('title').update({ title: me.title });
        }
        me.chart = me.getComponent('chart');
        me.chart.timeaxis = me.chart.getAxes()[1];
@@ -154,8 +153,8 @@ Ext.define('PVE.widget.RunningChart', {
        if (me.color) {
            me.chart.series[0].setStyle({
                fill: me.color,
-               stroke: me.color
+               stroke: me.color,
            });
        }
-    }
+    },
 });