applications/luci-livestats/luasrc/view/livestats/traffic.htm

   1 <%+header%>
   2
   3 <!--[if IE]><script type="text/javascript" src="<%=resource%>/livestats/ExCanvas.js"></script><![endif]-->
   4 <script type="text/javascript" src="<%=resource%>/livestats/MochiKit.js"></script>
   5 <script type="text/javascript" src="<%=resource%>/livestats/JsonRpc.js"></script>
   6 <script type="text/javascript" src="<%=resource%>/livestats/PlotKit.js"></script>
   7 <script type="text/javascript" src="<%=resource%>/livestats/GraphRPC.js"></script>
   8
   9 <%
  10         local interfaces = { }
  11         local uci = luci.model.uci.cursor_state()
  12
  13         uci:foreach("network", "interface",
  14                 function(s)
  15                         if s.ifname ~= "lo" then
  16                                 table.insert( interfaces,
  17                                         "'" .. ( s.ifname or s['.name'] ) .. "'"
  18                                 )
  19                         end
  20                 end
  21         )
  22 -%>
  23
  24 <script type="text/javascript">
  25         function initGraphs() {
  26                 var rpc = new GraphRPC(
  27                         document.getElementById('live_graphs'),
  28                         '<%=luci.dispatcher.build_url('rpc', 'sys')%>', 'net.deviceinfo',
  29                         2000,
  30
  31                         // Data sources
  32                         [ "1", "received Bytes/s", "9", "transmitted Bytes/s" ],
  33
  34                         // Graph layout options
  35                         { shouldFill: true, drawBackground: false, strokeColor: null,
  36                           strokeColorTransform: "asFillColor",
  37                           title: 'Traffic on interface "%s"',
  38                           separateDS: true, strokeWidth: 0.5, height: 140,
  39                           padding: { left: 70, right: 10, top: 10, bottom: 20 },
  40                           instances: [ <%=table.concat(interfaces, ", ") %> ] },
  41
  42                         // transform function
  43                         function(thisval, lastval) {
  44                                 return ( ( thisval - lastval ) / 2 );
  45                         }
  46                 );
  47         }
  48
  49         MochiKit.DOM.addLoadEvent(initGraphs);
  50 </script>
  51
  52 <div id="live_graphs"></div>
  53
  54 <%+footer%>