diff options
Diffstat (limited to 'modules')
| -rw-r--r-- | modules/luci-mod-status/htdocs/luci-static/resources/svg/channel_analysis.svg | 17 | ||||
| -rw-r--r-- | modules/luci-mod-status/htdocs/luci-static/resources/view/status/channel_analysis.js | 61 |
2 files changed, 50 insertions, 28 deletions
diff --git a/modules/luci-mod-status/htdocs/luci-static/resources/svg/channel_analysis.svg b/modules/luci-mod-status/htdocs/luci-static/resources/svg/channel_analysis.svg index 8f01075d0b..aca186402e 100644 --- a/modules/luci-mod-status/htdocs/luci-static/resources/svg/channel_analysis.svg +++ b/modules/luci-mod-status/htdocs/luci-static/resources/svg/channel_analysis.svg @@ -16,4 +16,21 @@ <line x1="0" y1="90%" x2="100%" y2="90%" style="stroke:black;stroke-width:0.1" /> <text id="label_10" x="10" y="89%" style="fill:#eee; font-size:9pt; font-family:sans-serif; text-shadow:1px 1px 1px #000">-90 dbm</text> + <defs> + <linearGradient id="GradientVerticalCenteredBlack"> + <stop class="stopinvis" offset="0%" /> + <stop class="stopblack" offset="50%" /> + <stop class="stopinvis" offset="100%" /> + </linearGradient> + </defs> + <style> + .stopinvis { + stop-color: "transparent"; + stop-opacity: 0; + } + .stopblack { + stop-color: "black"; + stop-opacity: .1; + } + </style> </svg> diff --git a/modules/luci-mod-status/htdocs/luci-static/resources/view/status/channel_analysis.js b/modules/luci-mod-status/htdocs/luci-static/resources/view/status/channel_analysis.js index f7e349409a..54e9054aa8 100644 --- a/modules/luci-mod-status/htdocs/luci-static/resources/view/status/channel_analysis.js +++ b/modules/luci-mod-status/htdocs/luci-static/resources/view/status/channel_analysis.js @@ -63,50 +63,55 @@ return view.extend({ if (scanCache[res.bssid].graph == null) scanCache[res.bssid].graph = []; - function add_channel_to_graph(chan_analysis, res, scanCache, i, channel, channel_width, label) { - var chan_offset = offset_tbl[channel], - points = [ - (chan_offset-(step*(channel_width )))+','+height, - (chan_offset-(step*(channel_width-1)))+','+height_diff, - (chan_offset+(step*(channel_width-1)))+','+height_diff, - (chan_offset+(step*(channel_width )))+','+height - ]; - + channels.forEach(function(channel) { if (scanCache[res.bssid].graph[i] == null) { var group = document.createElementNS('http://www.w3.org/2000/svg', 'g'), line = document.createElementNS('http://www.w3.org/2000/svg', 'polyline'), - text = null, + text = document.createElementNS('http://www.w3.org/2000/svg', 'text'), color = scanCache[res.bssid].color; line.setAttribute('style', 'fill:'+color+'4f'+';stroke:'+color+';stroke-width:0.5'); - group.appendChild(line) + text.setAttribute('style', 'fill:'+color+';font-size:9pt; font-family:sans-serif; text-shadow:1px 1px 1px #000'); + text.appendChild(document.createTextNode(res.ssid || res.bssid)); - if (label != null) { - text = document.createElementNS('http://www.w3.org/2000/svg', 'text'); - text.setAttribute('style', 'fill:'+color+';font-size:9pt; font-family:sans-serif; text-shadow:1px 1px 1px #000'); - text.appendChild(document.createTextNode(label)); - group.appendChild(text) - } + group.appendChild(line) + group.appendChild(text) chan_analysis.graph.firstElementChild.appendChild(group); scanCache[res.bssid].graph[i] = { group : group, line : line, text : text }; } - - if (scanCache[res.bssid].graph[i].text != null) { - scanCache[res.bssid].graph[i].text.setAttribute('x', offset_tbl[res.channel]-step); - scanCache[res.bssid].graph[i].text.setAttribute('y', height_diff - 2); + if (channel_width > 2) { + if (!("main" in scanCache[res.bssid].graph[i])) { + var main = document.createElementNS('http://www.w3.org/2000/svg', 'polyline'); + main.setAttribute('style', 'fill:url(#GradientVerticalCenteredBlack)'); + scanCache[res.bssid].graph[i].group.appendChild(main) + chan_analysis.graph.firstElementChild.lastElementChild.appendChild(main); + scanCache[res.bssid].graph[i]["main"] = main; + } + var main_offset = offset_tbl[res.channel], + points = [ + (main_offset-(step*(2 )))+','+height, + (main_offset-(step*(2-1)))+','+height_diff, + (main_offset+(step*(2-1)))+','+height_diff, + (main_offset+(step*(2 )))+','+height + ]; + scanCache[res.bssid].graph[i].main.setAttribute('points', points); } + + var chan_offset = offset_tbl[channel], + points = [ + (chan_offset-(step*(channel_width )))+','+height, + (chan_offset-(step*(channel_width-1)))+','+height_diff, + (chan_offset+(step*(channel_width-1)))+','+height_diff, + (chan_offset+(step*(channel_width )))+','+height + ]; + + scanCache[res.bssid].graph[i].text.setAttribute('x', offset_tbl[res.channel]-step); + scanCache[res.bssid].graph[i].text.setAttribute('y', height_diff - 2); scanCache[res.bssid].graph[i].line.setAttribute('points', points); scanCache[res.bssid].graph[i].group.style.zIndex = res.signal*-1; scanCache[res.bssid].graph[i].group.style.opacity = res.stale ? '0.5' : null; - } - - channels.forEach(function(channel) { - add_channel_to_graph(chan_analysis, res, scanCache, i, channel, channel_width, res.ssid || res.bssid); }) - if (channel_width > 2) { - add_channel_to_graph(chan_analysis, res, scanCache, i+1, res.channel, 2, null); - } }, create_channel_graph: function(chan_analysis, freq_tbl, band) { |
