applications/luci-app-dockerman/luasrc/view/dockerman/container_stats.htm

   1 <script type="text/javascript">//<![CDATA[
   2         let last_bw_tx
   3         let last_bw_rx
   4         let interval = 3
   5         function progressbar(v, m, pc, np, f) {
   6                 m = m || 100
   7
   8                 return String.format(
   9                         '<div style="width:100%%; max-width:500px; position:relative; border:1px solid #999999">' +
  10                         '<div style="background-color:#CCCCCC; width:%d%%; height:15px">' +
  11                         '<div style="position:absolute; left:0; top:0; text-align:center; width:100%%; color:#000000">' +
  12                         '<small>%s '+(f?f:'/')+' %s ' + (np ? "" : '(%d%%)') + '</small>' +
  13                         '</div>' +
  14                         '</div>' +
  15                         '</div>', pc, v, m, pc, f
  16                 );
  17         }
  18
  19         function niceBytes(bytes, decimals) {
  20                 if (bytes == 0) return '0 Bytes';
  21                 var k = 1000,
  22                         dm = decimals + 1 || 3,
  23                         sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'],
  24                         i = Math.floor(Math.log(bytes) / Math.log(k));
  25                 return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + ' ' + sizes[i];
  26         }
  27
  28         XHR.poll(interval, '<%=luci.dispatcher.build_url("admin/docker/container_stats")%>/<%=self.container_id%>', { status: 1 },
  29                 function (x, info) {
  30                         var e;
  31
  32                         if (e = document.getElementById('cbi-table-cpu-value'))
  33                                 e.innerHTML = progressbar(
  34                                         (info.cpu_percent), 100, (info.cpu_percent ? info.cpu_percent : 0));
  35                         if (e = document.getElementById('cbi-table-memory-value'))
  36                                 e.innerHTML = progressbar(
  37                                         niceBytes(info.memory.mem_useage),
  38                                         niceBytes(info.memory.mem_limit),
  39                                         ((100 / (info.memory.mem_limit ? info.memory.mem_limit : 100)) * (info.memory.mem_useage ? info.memory.mem_useage : 0))
  40                                 );
  41
  42                         for (var eth in info.bw_rxtx) {
  43                                 if (!document.getElementById("cbi-table-speed_" + eth + "-value")) {
  44                                         let tab = document.getElementById("cbi-table-cpu").parentNode
  45                                         let div = document.getElementById('cbi-table-cpu').cloneNode(true);
  46                                         div.id = "cbi-table-speed_" + eth;
  47                                         div.children[0].innerHTML = "<%:Upload/Download%>: " + eth
  48                                         div.children[1].id = "cbi-table-speed_" + eth + "-value"
  49                                         tab.appendChild(div)
  50                                 }
  51                                 if (!document.getElementById("cbi-table-network_" + eth + "-value")) {
  52                                         let tab = document.getElementById("cbi-table-cpu").parentNode
  53                                         let div = document.getElementById('cbi-table-cpu').cloneNode(true);
  54                                         div.id = "cbi-table-network_" + eth;
  55                                         div.children[0].innerHTML = "<%:TX/RX%>: " + eth
  56                                         div.children[1].id = "cbi-table-network_" + eth + "-value"
  57                                         tab.appendChild(div)
  58                                 }
  59                                 e = document.getElementById("cbi-table-network_" + eth + "-value")
  60                                 e.innerHTML = progressbar(
  61                                         '￪'+niceBytes(info.bw_rxtx[eth].bw_tx),
  62                                         '￬'+niceBytes(info.bw_rxtx[eth].bw_rx),
  63                                         null,
  64                                         true, " "
  65                                 );
  66                                 e = document.getElementById("cbi-table-speed_" + eth + "-value")
  67                                 if (! last_bw_tx) last_bw_tx = info.bw_rxtx[eth].bw_tx
  68                                 if (! last_bw_rx) last_bw_rx = info.bw_rxtx[eth].bw_rx
  69                                 e.innerHTML = progressbar(
  70                                         '￪'+niceBytes((info.bw_rxtx[eth].bw_tx - last_bw_tx)/interval)+'/s',
  71                                         '￬'+niceBytes((info.bw_rxtx[eth].bw_rx - last_bw_rx)/interval)+'/s',
  72                                         null,
  73                                         true, " "
  74                                 );
  75                                 last_bw_tx = info.bw_rxtx[eth].bw_tx
  76                                 last_bw_rx = info.bw_rxtx[eth].bw_rx
  77                         }
  78
  79                 });
  80 //]]></script>