diff options
Diffstat (limited to 'modules')
| -rw-r--r-- | modules/luci-mod-dsl/htdocs/luci-static/resources/view/status/dsl/spectrum.js | 71 |
1 files changed, 42 insertions, 29 deletions
diff --git a/modules/luci-mod-dsl/htdocs/luci-static/resources/view/status/dsl/spectrum.js b/modules/luci-mod-dsl/htdocs/luci-static/resources/view/status/dsl/spectrum.js index 83884daa84..2d7c1ceb3f 100644 --- a/modules/luci-mod-dsl/htdocs/luci-static/resources/view/status/dsl/spectrum.js +++ b/modules/luci-mod-dsl/htdocs/luci-static/resources/view/status/dsl/spectrum.js @@ -20,37 +20,50 @@ return view.extend({ render: function(data) { window.json = data[0]; - var v = E([], [ + var v = E('div', {'class': 'cbi-map'}, [ E('h2', {'style': "height: 40px"}, [ _('DSL line spectrum') ]), - E('p', {}, _('Graphs below show Signal-to-noise ratio, Bit allocation, Quiet line noise and Channel characteristics function (HLOG) per sub-carrier.')), - E('div', {'style': "height: 360px; width: 1024px"}, - E('canvas', { - 'id': 'dbChart', - 'height': 360, - 'width': 1024}, - ["chart"]) - ), - E('div', {'style': "height: 360px; width:1024px"}, - E('canvas', { - 'id': 'bitsChart', - 'height': 360, - 'width': 1024}, - ["chart2"]) - ), - E('div', {'style': "height: 360px; width:1024px"}, - E('canvas', { - 'id': 'qlnChart', - 'height': 360, - 'width': 1024}, - ["chart2"]) - ), - E('div', {'style': "height: 360px; width:1024px"}, - E('canvas', { - 'id': 'hlogChart', - 'height': 360, - 'width': 1024}, - ["chart2"]) + E('div', {'class': 'cbi-map-descr'}, _('The following diagrams show graphically prepared DSL characteristics that are important for evaluating the DSL connection.')), + + E('div', {'class': 'cbi-section'}, [ + E('div', {'style': "height: 360px; width: 1024px"}, + E('canvas', { + 'id': 'dbChart', + 'height': 360, + 'width': 1024}, + ["chart"]) + ), + E('div', {'class': 'cbi-section-descr', 'style': 'text-align:center'}, _('The graph shows the signal to noise ratio (SNR) per subcarrier in the uplink and downlink direction')), + ]), + E('div', {'class': 'cbi-section'}, [ + E('div', {'style': "height: 360px; width:1024px"}, + E('canvas', { + 'id': 'bitsChart', + 'height': 360, + 'width': 1024}, + ["chart2"]) + ), + E('div', {'class': 'cbi-section-descr', 'style': 'text-align:center'}, _('The graph shows th amount of bits actually allocated per subcarrier in the uplink and downlink direction')), + ]), + E('div', {'class': 'cbi-section'}, [ + E('div', {'style': "height: 360px; width:1024px"}, + E('canvas', { + 'id': 'qlnChart', + 'height': 360, + 'width': 1024}, + ["chart2"]) + ), + E('div', {'class': 'cbi-section-descr', 'style': 'text-align:center'}, _('The diagram shows the quiet line noise (QLN) per subcarrier in uplink and downlink direction')), + ]), + E('div', {'class': 'cbi-section'}, [ + E('div', {'style': "height: 360px; width:1024px"}, + E('canvas', { + 'id': 'hlogChart', + 'height': 360, + 'width': 1024}, + ["chart2"]) ), + E('div', {'class': 'cbi-section-descr', 'style': 'text-align:center'}, _('The diagram shows the Channel Characteristics Function (HLOG) per subcarrier in uplink and downlink direction')), + ]), E('script', {'src':'/luci-static/resources/view/status/dsl/graph.js'}, {}) ]); |