luci-mod-status: add missing cbi-map-descr for realtime graph load

[project/luci.git] / modules / luci-mod-status / htdocs / luci-static / resources / view / status / load.js

diff --git a/modules/luci-mod-status/htdocs/luci-static/resources/view/status/load.js b/modules/luci-mod-status/htdocs/luci-static/resources/view/status/load.js
index 3b302dc5099c45585033dfe87187051eb5bd864d..ec80d86b64a48df481667539098e524f69d3059b 100644 (file)
--- a/modules/luci-mod-status/htdocs/luci-static/resources/view/status/load.js
+++ b/modules/luci-mod-status/htdocs/luci-static/resources/view/status/load.js
@@ -19,7 +19,7 @@ Math.log2 = Math.log2 || function(x) { return Math.log(x) * Math.LOG2E; };
 return view.extend({
        load: function() {
                return Promise.all([
-                       this.loadSVG(L.resource('load.svg'))
+                       this.loadSVG(L.resource('svg/load.svg'))
                ]);
        },
 
@@ -186,6 +186,8 @@ return view.extend({
                                                        y = ctx.height - Math.floor(values[i][j] * data_scale);
                                                        //y -= Math.floor(y % (1 / data_scale));
 
+                                                       y = isNaN(y) ? ctx.height : y;
+
                                                        pt += ' ' + x + ',' + y;
                                                }
 
@@ -222,40 +224,42 @@ return view.extend({
                var svg = data[0];
 
                var v = E([], [
+                       E('h2', _('System load')),
+                       E('div', {'class': 'cbi-map-descr'}, _('Load Average is a metric that is used by Linux to keep track of system resources.')),
                        svg,
                        E('div', { 'class': 'right' }, E('small', { 'id': 'scale' }, '-')),
                        E('br'),
 
-                       E('div', { 'class': 'table', 'style': 'width:100%;table-layout:fixed' }, [
-                               E('div', { 'class': 'tr' }, [
-                                       E('div', { 'class': 'td right top' }, E('strong', { 'style': 'border-bottom:2px solid #f00' }, [ _('1 Minute Load:') ])),
-                                       E('div', { 'class': 'td', 'id': 'lb_load01_cur' }, [ '0.00' ]),
+                       E('table', { 'class': 'table', 'style': 'width:100%;table-layout:fixed' }, [
+                               E('tr', { 'class': 'tr' }, [
+                                       E('td', { 'class': 'td right top' }, E('strong', { 'style': 'border-bottom:2px solid #f00' }, [ _('1 Minute Load:') ])),
+                                       E('td', { 'class': 'td', 'id': 'lb_load01_cur' }, [ '0.00' ]),
 
-                                       E('div', { 'class': 'td right top' }, E('strong', {}, [ _('Average:') ])),
-                                       E('div', { 'class': 'td', 'id': 'lb_load01_avg' }, [ '0.00' ]),
+                                       E('td', { 'class': 'td right top' }, E('strong', {}, [ _('Average:') ])),
+                                       E('td', { 'class': 'td', 'id': 'lb_load01_avg' }, [ '0.00' ]),
 
-                                       E('div', { 'class': 'td right top' }, E('strong', {}, [ _('Peak:') ])),
-                                       E('div', { 'class': 'td', 'id': 'lb_load01_peak' }, [ '0.00' ])
+                                       E('td', { 'class': 'td right top' }, E('strong', {}, [ _('Peak:') ])),
+                                       E('td', { 'class': 'td', 'id': 'lb_load01_peak' }, [ '0.00' ])
                                ]),
-                               E('div', { 'class': 'tr' }, [
-                                       E('div', { 'class': 'td right top' }, E('strong', { 'style': 'border-bottom:2px solid #f60' }, [ _('5 Minute Load:') ])),
-                                       E('div', { 'class': 'td', 'id': 'lb_load05_cur' }, [ '0.00' ]),
+                               E('tr', { 'class': 'tr' }, [
+                                       E('td', { 'class': 'td right top' }, E('strong', { 'style': 'border-bottom:2px solid #f60' }, [ _('5 Minute Load:') ])),
+                                       E('td', { 'class': 'td', 'id': 'lb_load05_cur' }, [ '0.00' ]),
 
-                                       E('div', { 'class': 'td right top' }, E('strong', {}, [ _('Average:') ])),
-                                       E('div', { 'class': 'td', 'id': 'lb_load05_avg' }, [ '0.00' ]),
+                                       E('td', { 'class': 'td right top' }, E('strong', {}, [ _('Average:') ])),
+                                       E('td', { 'class': 'td', 'id': 'lb_load05_avg' }, [ '0.00' ]),
 
-                                       E('div', { 'class': 'td right top' }, E('strong', {}, [ _('Peak:') ])),
-                                       E('div', { 'class': 'td', 'id': 'lb_load05_peak' }, [ '0.00' ])
+                                       E('td', { 'class': 'td right top' }, E('strong', {}, [ _('Peak:') ])),
+                                       E('td', { 'class': 'td', 'id': 'lb_load05_peak' }, [ '0.00' ])
                                ]),
-                               E('div', { 'class': 'tr' }, [
-                                       E('div', { 'class': 'td right top' }, E('strong', { 'style': 'border-bottom:2px solid #fa0' }, [ _('15 Minute Load:') ])),
-                                       E('div', { 'class': 'td', 'id': 'lb_load15_cur' }, [ '0.00' ]),
+                               E('tr', { 'class': 'tr' }, [
+                                       E('td', { 'class': 'td right top' }, E('strong', { 'style': 'border-bottom:2px solid #fa0' }, [ _('15 Minute Load:') ])),
+                                       E('td', { 'class': 'td', 'id': 'lb_load15_cur' }, [ '0.00' ]),
 
-                                       E('div', { 'class': 'td right top' }, E('strong', {}, [ _('Average:') ])),
-                                       E('div', { 'class': 'td', 'id': 'lb_load15_avg' }, [ '0.00' ]),
+                                       E('td', { 'class': 'td right top' }, E('strong', {}, [ _('Average:') ])),
+                                       E('td', { 'class': 'td', 'id': 'lb_load15_avg' }, [ '0.00' ]),
 
-                                       E('div', { 'class': 'td right top' }, E('strong', {}, [ _('Peak:') ])),
-                                       E('div', { 'class': 'td', 'id': 'lb_load15_peak' }, [ '0.00' ])
+                                       E('td', { 'class': 'td right top' }, E('strong', {}, [ _('Peak:') ])),
+                                       E('td', { 'class': 'td', 'id': 'lb_load15_peak' }, [ '0.00' ])
                                ])
                        ])
                ]);