luci-app-statistics: regenerate graphs on window resize

Currently graphs are redrawn only based on the refresh interval
(never or every 5/30/60 seconds).
Since the image size is calculated based on the window size,
redraw graphs (once) also after resizing the window.
This also captures window resize due to orientation change
(e.g., for mobile).
Since multiple resize events are fired when dragging the window
border, there is a 250ms delay for debouncing.

Signed-off-by: Rani Hod <rani.hod@gmail.com>
Tested-by: Paul Donald <newtwen@gmail.com>
(cherry picked from commit 8fcd52f5130acd1a0738ff47f9bba2c9cc42e662)

diff --git a/applications/luci-app-statistics/htdocs/luci-static/resources/view/statistics/graphs.js b/applications/luci-app-statistics/htdocs/luci-static/resources/view/statistics/graphs.js
index a3189143ebbe0dd07ac0325345fab3e7f3cecd47..2f13ea30fd1a2d81c94a78863be2c5b4b05af1b6 100644 (file)
--- a/applications/luci-app-statistics/htdocs/luci-static/resources/view/statistics/graphs.js
+++ b/applications/luci-app-statistics/htdocs/luci-static/resources/view/statistics/graphs.js
@@ -244,6 +244,10 @@ return view.extend({
 
                requestAnimationFrame(L.bind(this.updateGraphs, this, hostSel, spanSel, timeSel, graphDiv));
 
+               var resizeTimeout;
+               var rgCallback = L.bind(this.refreshGraphs, this, hostSel, spanSel, timeSel, graphDiv);
+               addEventListener('resize', function() { clearTimeout(resizeTimeout); resizeTimeout = setTimeout(rgCallback, 250); });
+
                return view;
        },