diff --git a/web/js/serverstatus.js b/web/js/serverstatus.js index 02ca72b..389c90c 100644 --- a/web/js/serverstatus.js +++ b/web/js/serverstatus.js @@ -4,356 +4,178 @@ var d = 0; var server_status = new Array(); function timeSince(date) { - if(date == 0) - return "从未."; - - var seconds = Math.floor((new Date() - date) / 1000); - var interval = Math.floor(seconds / 60); - if (interval > 1) - return interval + " 分钟前."; - else - return "几秒前."; + if (date == 0) return "从未."; + var seconds = Math.floor((new Date() - date) / 1000); + var interval = Math.floor(seconds / 60); + return interval > 1 ? interval + " 分钟前." : "几秒前."; } -function bytesToSize(bytes, precision, si) -{ - var ret; - si = typeof si !== 'undefined' ? si : 0; - if(si != 0) { - var megabyte = 1000 * 1000; - var gigabyte = megabyte * 1000; - var terabyte = gigabyte * 1000; - } else { - var megabyte = 1024 * 1024; - var gigabyte = megabyte * 1024; - var terabyte = gigabyte * 1024; - } - - if ((bytes >= megabyte) && (bytes < gigabyte)) { - ret = (bytes / megabyte).toFixed(precision) + ' M'; - - } else if ((bytes >= gigabyte) && (bytes < terabyte)) { - ret = (bytes / gigabyte).toFixed(precision) + ' G'; - - } else if (bytes >= terabyte) { - ret = (bytes / terabyte).toFixed(precision) + ' T'; - - } else { - return bytes + ' B'; - } - return ret; - /*if(si != 0) { - return ret + 'B'; - } else { - return ret + 'iB'; - }*/ +function bytesToSize(bytes, precision, si = false) { + const units = si ? ['B', 'KB', 'MB', 'GB', 'TB'] : ['B', 'KiB', 'MiB', 'GiB', 'TiB']; + if (bytes === 0) return '0 B'; + const k = si ? 1000 : 1024; + const i = Math.floor(Math.log(bytes) / Math.log(k)); + return parseFloat((bytes / Math.pow(k, i)).toFixed(precision)) + ' ' + units[i]; } function uptime() { - $.getJSON("json/stats.json", function(result) { - $("#loading-notice").remove(); - if(result.reload) - setTimeout(function() { location.reload() }, 1000); + $.getJSON("json/stats.json", function(result) { + $("#loading-notice").remove(); + if (result.reload) setTimeout(location.reload, 1000); - for (var i = 0, rlen=result.servers.length; i < rlen; i++) { - var TableRow = $("#servers tr#r" + i); - var MableRow = $("#monitors tr#r" + i); - var ExpandRow = $("#servers #rt" + i); - var hack; // fuck CSS for making me do this - if(i%2) hack="odd"; else hack="even"; - if (!TableRow.length) { - $("#servers").append( - "<tr id=\"r" + i + "\" data-toggle=\"collapse\" data-target=\"#rt" + i + "\" class=\"accordion-toggle " + hack + "\">" + - "<td id=\"online_status\"><div class=\"progress\"><div style=\"width: 100%;\" class=\"progress-bar progress-bar-warning\"><small>加载中</small></div></div></td>" + - "<td id=\"month_traffic\"><div class=\"progress\"><div style=\"width: 100%;\" class=\"progress-bar progress-bar-warning\"><small>加载中</small></div></div></td>" + - "<td id=\"name\">加载中</td>" + - "<td id=\"type\">加载中</td>" + - "<td id=\"location\">加载中</td>" + - "<td id=\"uptime\">加载中</td>" + - "<td id=\"load\">加载中</td>" + - "<td id=\"network\">加载中</td>" + - "<td id=\"traffic\">加载中</td>" + - "<td id=\"cpu\"><div class=\"progress\"><div style=\"width: 100%;\" class=\"progress-bar progress-bar-warning\"><small>加载中</small></div></div></td>" + - "<td id=\"memory\"><div class=\"progress\"><div style=\"width: 100%;\" class=\"progress-bar progress-bar-warning\"><small>加载中</small></div></div></td>" + - "<td id=\"hdd\"><div class=\"progress\"><div style=\"width: 100%;\" class=\"progress-bar progress-bar-warning\"><small>加载中</small></div></div></td>" + - "<td id=\"ping\"><div class=\"progress\"><div style=\"width: 100%;\" class=\"progress-bar progress-bar-warning\"><small>加载中</small></div></div></td>" + - "</tr>" + - "<tr class=\"expandRow " + hack + "\"><td colspan=\"16\"><div class=\"accordian-body collapse\" id=\"rt" + i + "\">" + - "<div id=\"expand_mem\">加载中</div>" + - "<div id=\"expand_hdd\">加载中</div>" + - "<div id=\"expand_tupd\">加载中</div>" + - "<div id=\"expand_ping\">加载中</div>" + - "</div></td></tr>" - ); - TableRow = $("#servers tr#r" + i); - ExpandRow = $("#servers #rt" + i); - server_status[i] = true; - } - if (!MableRow.length) { - $("#monitors").append( - "<tr id=\"r" + i + "\" data-target=\"#rt" + i + "\" class=\"accordion-toggle " + hack + "\">" + - "<td id=\"monitor_status\"><div class=\"progress\"><div style=\"width: 100%;\" class=\"progress-bar progress-bar-warning\"><small>加载中</small></div></div></td>" + - "<td id=\"monitor_node\">加载中</td>" + - "<td id=\"monitor_location\">加载中</td>" + - "<td id=\"monitor_text\">加载中</td>" + - "</tr>" - ); - MableRow = $("#monitors tr#r" + i); - } - TableRow = TableRow[0]; - MableRow = MableRow[0]; - if(error) { - TableRow.setAttribute("data-target", "#rt" + i); - MableRow.setAttribute("data-target", "#rt" + i); - server_status[i] = true; - } + result.servers.forEach((server, i) => { + let TableRow = $("#servers tr#r" + i); + let MableRow = $("#monitors tr#r" + i); + let ExpandRow = $("#servers #rt" + i); + let hack = i % 2 ? "odd" : "even"; - // online_status - if (result.servers[i].online4 && !result.servers[i].online6) { - TableRow.children["online_status"].children[0].children[0].className = "progress-bar progress-bar-success"; - TableRow.children["online_status"].children[0].children[0].innerHTML = "<small>IPv4</small>"; - MableRow.children["monitor_status"].children[0].children[0].className = "progress-bar progress-bar-success"; - MableRow.children["monitor_status"].children[0].children[0].innerHTML = "<small>IPv4</small>"; - } else if (result.servers[i].online4 && result.servers[i].online6) { - TableRow.children["online_status"].children[0].children[0].className = "progress-bar progress-bar-success"; - TableRow.children["online_status"].children[0].children[0].innerHTML = "<small>双栈</small>"; - MableRow.children["monitor_status"].children[0].children[0].className = "progress-bar progress-bar-success"; - MableRow.children["monitor_status"].children[0].children[0].innerHTML = "<small>双栈</small>"; - } else if (!result.servers[i].online4 && result.servers[i].online6) { - TableRow.children["online_status"].children[0].children[0].className = "progress-bar progress-bar-success"; - TableRow.children["online_status"].children[0].children[0].innerHTML = "<small>IPv6</small>"; - MableRow.children["monitor_status"].children[0].children[0].className = "progress-bar progress-bar-success"; - MableRow.children["monitor_status"].children[0].children[0].innerHTML = "<small>IPv6</small>"; - } else { - TableRow.children["online_status"].children[0].children[0].className = "progress-bar progress-bar-danger"; - TableRow.children["online_status"].children[0].children[0].innerHTML = "<small>关闭</small>"; - MableRow.children["monitor_status"].children[0].children[0].className = "progress-bar progress-bar-danger"; - MableRow.children["monitor_status"].children[0].children[0].innerHTML = "<small>关闭</small>"; - } + if (!TableRow.length) { + $("#servers").append( + `<tr id="r${i}" data-toggle="collapse" data-target="#rt${i}" class="accordion-toggle ${hack}"> + <td id="online_status"><div class="progress"><div style="width: 100%;" class="progress-bar progress-bar-warning"><small>加载中</small></div></div></td> + <td id="month_traffic"><div class="progress"><div style="width: 100%;" class="progress-bar progress-bar-warning"><small>加载中</small></div></div></td> + <td id="name">加载中</td> + <td id="type">加载中</td> + <td id="location">加载中</td> + <td id="uptime">加载中</td> + <td id="load">加载中</td> + <td id="network">加载中</td> + <td id="traffic">加载中</td> + <td id="cpu"><div class="progress"><div style="width: 100%;" class="progress-bar progress-bar-warning"><small>加载中</small></div></div></td> + <td id="memory"><div class="progress"><div style="width: 100%;" class="progress-bar progress-bar-warning"><small>加载中</small></div></div></td> + <td id="hdd"><div class="progress"><div style="width: 100%;" class="progress-bar progress-bar-warning"><small>加载中</small></div></div></td> + <td id="ping"><div class="progress"><div style="width: 100%;" class="progress-bar progress-bar-warning"><small>加载中</small></div></div></td> + </tr> + <tr class="expandRow ${hack}"><td colspan="16"><div class="accordian-body collapse" id="rt${i}"> + <div id="expand_mem">加载中</div> + <div id="expand_hdd">加载中</div> + <div id="expand_tupd">加载中</div> + <div id="expand_ping">加载中</div> + </div></td></tr>` + ); + TableRow = $("#servers tr#r" + i); + ExpandRow = $("#servers #rt" + i); + server_status[i] = true; + } - // Name - TableRow.children["name"].innerHTML = result.servers[i].name; - MableRow.children["monitor_node"].innerHTML = result.servers[i].name; + if (!MableRow.length) { + $("#monitors").append( + `<tr id="r${i}" data-target="#rt${i}" class="accordion-toggle ${hack}"> + <td id="monitor_status"><div class="progress"><div style="width: 100%;" class="progress-bar progress-bar-warning"><small>加载中</small></div></div></td> + <td id="monitor_node">加载中</td> + <td id="monitor_location">加载中</td> + <td id="monitor_text">加载中</td> + </tr>` + ); + MableRow = $("#monitors tr#r" + i); + } - // Type - TableRow.children["type"].innerHTML = result.servers[i].type; + if (error) { + TableRow.attr("data-target", "#rt" + i); + MableRow.attr("data-target", "#rt" + i); + server_status[i] = true; + } - // Location - TableRow.children["location"].innerHTML = result.servers[i].location; - MableRow.children["monitor_location"].innerHTML = result.servers[i].location; - if (!result.servers[i].online4 && !result.servers[i].online6) { - if (server_status[i]) { - TableRow.children["uptime"].innerHTML = "–"; - TableRow.children["load"].innerHTML = "–"; - TableRow.children["network"].innerHTML = "–"; - TableRow.children["traffic"].innerHTML = "–"; - TableRow.children["month_traffic"].children[0].children[0].className = "progress-bar progress-bar-warning"; - TableRow.children["month_traffic"].children[0].children[0].innerHTML = "<small>关闭</small>"; - TableRow.children["cpu"].children[0].children[0].className = "progress-bar progress-bar-danger"; - TableRow.children["cpu"].children[0].children[0].style.width = "100%"; - TableRow.children["cpu"].children[0].children[0].innerHTML = "<small>关闭</small>"; - TableRow.children["memory"].children[0].children[0].className = "progress-bar progress-bar-danger"; - TableRow.children["memory"].children[0].children[0].style.width = "100%"; - TableRow.children["memory"].children[0].children[0].innerHTML = "<small>关闭</small>"; - TableRow.children["hdd"].children[0].children[0].className = "progress-bar progress-bar-danger"; - TableRow.children["hdd"].children[0].children[0].style.width = "100%"; - TableRow.children["hdd"].children[0].children[0].innerHTML = "<small>关闭</small>"; - TableRow.children["ping"].children[0].children[0].className = "progress-bar progress-bar-danger"; - TableRow.children["ping"].children[0].children[0].style.width = "100%"; - TableRow.children["ping"].children[0].children[0].innerHTML = "<small>关闭</small>"; - MableRow.children["monitor_text"].innerHTML = "-"; - if(ExpandRow.hasClass("in")) { - ExpandRow.collapse("hide"); - } - TableRow.setAttribute("data-target", ""); - MableRow.setAttribute("data-target", ""); - server_status[i] = false; - } - } else { - if (!server_status[i]) { - TableRow.setAttribute("data-target", "#rt" + i); - MableRow.setAttribute("data-target", "#rt" + i); - server_status[i] = true; - } + const statusClass = server.online4 || server.online6 ? "progress-bar progress-bar-success" : "progress-bar progress-bar-danger"; + const statusText = server.online4 && server.online6 ? "双栈" : server.online4 ? "IPv4" : server.online6 ? "IPv6" : "关闭"; - // month traffic - var monthtraffic = ""; - var trafficdiff_in = result.servers[i].network_in - result.servers[i].last_network_in; - var trafficdiff_out = result.servers[i].network_out - result.servers[i].last_network_out; - if(trafficdiff_in < 1024*1024*1024*1024) - monthtraffic += (trafficdiff_in/1024/1024/1024).toFixed(1) + "G"; - else - monthtraffic += (trafficdiff_in/1024/1024/1024/1024).toFixed(1) + "T"; - monthtraffic += " | " - if(trafficdiff_out < 1024*1024*1024*1024) - monthtraffic += (trafficdiff_out/1024/1024/1024).toFixed(1) + "G"; - else - monthtraffic += (trafficdiff_out/1024/1024/1024/1024).toFixed(1) + "T"; - TableRow.children["month_traffic"].children[0].children[0].className = "progress-bar progress-bar-success"; - TableRow.children["month_traffic"].children[0].children[0].innerHTML = "<small>"+monthtraffic+"</small>"; + TableRow.find("#online_status .progress-bar").attr("class", statusClass).html(`<small>${statusText}</small>`); + MableRow.find("#monitor_status .progress-bar").attr("class", statusClass).html(`<small>${statusText}</small>`); - // Uptime - TableRow.children["uptime"].innerHTML = result.servers[i].uptime; + TableRow.find("#name").html(server.name); + MableRow.find("#monitor_node").html(server.name); + TableRow.find("#type").html(server.type); + TableRow.find("#location").html(server.location); + MableRow.find("#monitor_location").html(server.location); - // Load: default load_1, you can change show: load_1, load_5, load_15 - if(result.servers[i].load == -1) { - TableRow.children["load"].innerHTML = "–"; - } else { - TableRow.children["load"].innerHTML = result.servers[i].load_1.toFixed(2); - } + if (!server.online4 && !server.online6) { + if (server_status[i]) { + TableRow.find("#uptime").html("–"); + TableRow.find("#load").html("–"); + TableRow.find("#network").html("–"); + TableRow.find("#traffic").html("–"); + TableRow.find("#month_traffic .progress-bar").attr("class", "progress-bar progress-bar-warning").html("<small>关闭</small>"); + TableRow.find("#cpu .progress-bar").attr("class", "progress-bar progress-bar-danger").css("width", "100%").html("<small>关闭</small>"); + TableRow.find("#memory .progress-bar").attr("class", "progress-bar progress-bar-danger").css("width", "100%").html("<small>关闭</small>"); + TableRow.find("#hdd .progress-bar").attr("class", "progress-bar progress-bar-danger").css("width", "100%").html("<small>关闭</small>"); + TableRow.find("#ping .progress-bar").attr("class", "progress-bar progress-bar-danger").css("width", "100%").html("<small>关闭</small>"); + MableRow.find("#monitor_text").html("-"); + if (ExpandRow.hasClass("in")) ExpandRow.collapse("hide"); + TableRow.attr("data-target", ""); + MableRow.attr("data-target", ""); + server_status[i] = false; + } + } else { + if (!server_status[i]) { + TableRow.attr("data-target", "#rt" + i); + MableRow.attr("data-target", "#rt" + i); + server_status[i] = true; + } - // Network - var netstr = ""; - if(result.servers[i].network_rx < 1024*1024) - netstr += (result.servers[i].network_rx/1024).toFixed(1) + "K"; - else - netstr += (result.servers[i].network_rx/1024/1024).toFixed(1) + "M"; - netstr += " | " - if(result.servers[i].network_tx < 1024*1024) - netstr += (result.servers[i].network_tx/1024).toFixed(1) + "K"; - else - netstr += (result.servers[i].network_tx/1024/1024).toFixed(1) + "M"; - TableRow.children["network"].innerHTML = netstr; + const trafficdiff_in = server.network_in - server.last_network_in; + const trafficdiff_out = server.network_out - server.last_network_out; + const monthtraffic = `${bytesToSize(trafficdiff_in, 1, true)} | ${bytesToSize(trafficdiff_out, 1, true)}`; + TableRow.find("#month_traffic .progress-bar").attr("class", "progress-bar progress-bar-success").html(`<small>${monthtraffic}</small>`); - //Traffic - var trafficstr = ""; - if(result.servers[i].network_in < 1024*1024*1024*1024) - trafficstr += (result.servers[i].network_in/1024/1024/1024).toFixed(1) + "G"; - else - trafficstr += (result.servers[i].network_in/1024/1024/1024/1024).toFixed(1) + "T"; - trafficstr += " | " - if(result.servers[i].network_out < 1024*1024*1024*1024) - trafficstr += (result.servers[i].network_out/1024/1024/1024).toFixed(1) + "G"; - else - trafficstr += (result.servers[i].network_out/1024/1024/1024/1024).toFixed(1) + "T"; - TableRow.children["traffic"].innerHTML = trafficstr; + TableRow.find("#uptime").html(server.uptime); + TableRow.find("#load").html(server.load_1 == -1 ? "–" : server.load_1.toFixed(2)); - // CPU - if (result.servers[i].cpu >= 90) - TableRow.children["cpu"].children[0].children[0].className = "progress-bar progress-bar-danger"; - else if (result.servers[i].cpu >= 80) - TableRow.children["cpu"].children[0].children[0].className = "progress-bar progress-bar-warning"; - else - TableRow.children["cpu"].children[0].children[0].className = "progress-bar progress-bar-success"; - TableRow.children["cpu"].children[0].children[0].style.width = result.servers[i].cpu + "%"; - TableRow.children["cpu"].children[0].children[0].innerHTML = result.servers[i].cpu + "%"; + const netstr = `${bytesToSize(server.network_rx, 1, true)} | ${bytesToSize(server.network_tx, 1, true)}`; + TableRow.find("#network").html(netstr); - // Memory - var Mem = ((result.servers[i].memory_used/result.servers[i].memory_total)*100.0).toFixed(0); - if (Mem >= 90) - TableRow.children["memory"].children[0].children[0].className = "progress-bar progress-bar-danger"; - else if (Mem >= 80) - TableRow.children["memory"].children[0].children[0].className = "progress-bar progress-bar-warning"; - else - TableRow.children["memory"].children[0].children[0].className = "progress-bar progress-bar-success"; - TableRow.children["memory"].children[0].children[0].style.width = Mem + "%"; - TableRow.children["memory"].children[0].children[0].innerHTML = Mem + "%"; - // 内存|swap - ExpandRow[0].children["expand_mem"].innerHTML = "内存|虚存: " + bytesToSize(result.servers[i].memory_used*1024, 1) + " / " + bytesToSize(result.servers[i].memory_total*1024, 1) + " | " + bytesToSize(result.servers[i].swap_used*1024, 0) + " / " + bytesToSize(result.servers[i].swap_total*1024, 0); + const trafficstr = `${bytesToSize(server.network_in, 1, true)} | ${bytesToSize(server.network_out, 1, true)}`; + TableRow.find("#traffic").html(trafficstr); - // HDD - var HDD = ((result.servers[i].hdd_used/result.servers[i].hdd_total)*100.0).toFixed(0); - if (HDD >= 90) - TableRow.children["hdd"].children[0].children[0].className = "progress-bar progress-bar-danger"; - else if (HDD >= 80) - TableRow.children["hdd"].children[0].children[0].className = "progress-bar progress-bar-warning"; - else - TableRow.children["hdd"].children[0].children[0].className = "progress-bar progress-bar-success"; - TableRow.children["hdd"].children[0].children[0].style.width = HDD + "%"; - TableRow.children["hdd"].children[0].children[0].innerHTML = HDD + "%"; - // IO Speed for HDD. - // IO, 过小的B字节单位没有意义 - var io = ""; - if(result.servers[i].io_read < 1024*1024) - io += parseInt(result.servers[i].io_read/1024) + "K"; - else - io += parseInt(result.servers[i].io_read/1024/1024) + "M"; - io += " / " - if(result.servers[i].io_write < 1024*1024) - io += parseInt(result.servers[i].io_write/1024) + "K"; - else - io += parseInt(result.servers[i].io_write/1024/1024) + "M"; - // Expand for HDD. - ExpandRow[0].children["expand_hdd"].innerHTML = "硬盘|读写: " + bytesToSize(result.servers[i].hdd_used*1024*1024, 2) + " / " + bytesToSize(result.servers[i].hdd_total*1024*1024, 2) + " | " + io; + const cpuClass = server.cpu >= 90 ? "progress-bar progress-bar-danger" : server.cpu >= 80 ? "progress-bar progress-bar-warning" : "progress-bar progress-bar-success"; + TableRow.find("#cpu .progress-bar").attr("class", cpuClass).css("width", `${server.cpu}%`).html(`${server.cpu}%`); - // delay time + const Mem = ((server.memory_used / server.memory_total) * 100).toFixed(0); + const memClass = Mem >= 90 ? "progress-bar progress-bar-danger" : Mem >= 80 ? "progress-bar progress-bar-warning" : "progress-bar progress-bar-success"; + TableRow.find("#memory .progress-bar").attr("class", memClass).css("width", `${Mem}%`).html(`${Mem}%`); + ExpandRow.find("#expand_mem").html(`内存|虚存: ${bytesToSize(server.memory_used * 1024, 1)} / ${bytesToSize(server.memory_total * 1024, 1)} | ${bytesToSize(server.swap_used * 1024, 0)} / ${bytesToSize(server.swap_total * 1024, 0)}`); - // tcp, udp, process, thread count - ExpandRow[0].children["expand_tupd"].innerHTML = "TCP/UDP/进/线: " + result.servers[i].tcp_count + " / " + result.servers[i].udp_count + " / " + result.servers[i].process_count+ " / " + result.servers[i].thread_count; + const HDD = ((server.hdd_used / server.hdd_total) * 100).toFixed(0); + const hddClass = HDD >= 90 ? "progress-bar progress-bar-danger" : HDD >= 80 ? "progress-bar progress-bar-warning" : "progress-bar progress-bar-success"; + TableRow.find("#hdd .progress-bar").attr("class", hddClass).css("width", `${HDD}%`).html(`${HDD}%`); + const io = `${bytesToSize(server.io_read, 0, true)} / ${bytesToSize(server.io_write, 0, true)}`; + ExpandRow.find("#expand_hdd").html(`硬盘|读写: ${bytesToSize(server.hdd_used * 1024 * 1024, 2)} / ${bytesToSize(server.hdd_total * 1024 * 1024, 2)} | ${io}`); - // ping - var PING_10010 = result.servers[i].ping_10010.toFixed(0); - var PING_189 = result.servers[i].ping_189.toFixed(0); - var PING_10086 = result.servers[i].ping_10086.toFixed(0); + ExpandRow.find("#expand_tupd").html(`TCP/UDP/进/线: ${server.tcp_count} / ${server.udp_count} / ${server.process_count} / ${server.thread_count}`); - // ping ms + lost rate - ExpandRow[0].children["expand_ping"].innerHTML = "CU/CT/CM: " + result.servers[i].time_10010 + "ms ("+result.servers[i].ping_10010.toFixed(0)+"%) / " + result.servers[i].time_189 + "ms ("+result.servers[i].ping_189.toFixed(0)+"%) / " + result.servers[i].time_10086 + "ms ("+result.servers[i].ping_10086.toFixed(0)+"%)" + const PING_10010 = server.ping_10010.toFixed(0); + const PING_189 = server.ping_189.toFixed(0); + const PING_10086 = server.ping_10086.toFixed(0); + const pingClass = PING_10010 >= 20 || PING_189 >= 20 || PING_10086 >= 20 ? "progress-bar progress-bar-danger" : PING_10010 >= 10 || PING_189 >= 10 || PING_10086 >= 10 ? "progress-bar progress-bar-warning" : "progress-bar progress-bar-success"; + TableRow.find("#ping .progress-bar").attr("class", pingClass).html(`${PING_10010}%💻${PING_189}%💻${PING_10086}%`); + ExpandRow.find("#expand_ping").html(`CU/CT/CM: ${server.time_10010}ms (${PING_10010}%) / ${server.time_189}ms (${PING_189}%) / ${server.time_10086}ms (${PING_10086}%)`); - if (PING_10010 >= 20 || PING_189 >= 20 || PING_10086 >= 20) - TableRow.children["ping"].children[0].children[0].className = "progress-bar progress-bar-danger"; - else if (PING_10010 >= 10 || PING_189 >= 10 || PING_10086 >= 10) - TableRow.children["ping"].children[0].children[0].className = "progress-bar progress-bar-warning"; - else - TableRow.children["ping"].children[0].children[0].className = "progress-bar progress-bar-success"; - TableRow.children["ping"].children[0].children[0].innerHTML = PING_10010 + "%💻" + PING_189 + "%💻" + PING_10086 + "%"; + MableRow.find("#monitor_text").html(server.custom); + } + }); - // monitor - MableRow.children["monitor_text"].innerHTML = result.servers[i].custom; - } - }; - - d = new Date(result.updated*1000); - error = 0; - }).fail(function(update_error) { - if (!error) { - $("#servers > tr.accordion-toggle").each(function(i) { - var TableRow = $("#servers tr#r" + i)[0]; - var MableRow = $("#monitors tr#r" + i)[0]; - var ExpandRow = $("#servers #rt" + i); - TableRow.children["online_status"].children[0].children[0].className = "progress-bar progress-bar-error"; - TableRow.children["online_status"].children[0].children[0].innerHTML = "<small>错误</small>"; - MableRow.children["monitor_status"].children[0].children[0].className = "progress-bar progress-bar-error"; - MableRow.children["monitor_status"].children[0].children[0].innerHTML = "<small>错误</small>"; - TableRow.children["month_traffic"].children[0].children[0].className = "progress-bar progress-bar-error"; - TableRow.children["month_traffic"].children[0].children[0].innerHTML = "<small>错误</small>"; - TableRow.children["uptime"].children[0].children[0].className = "progress-bar progress-bar-error"; - TableRow.children["uptime"].children[0].children[0].innerHTML = "<small>错误</small>"; - TableRow.children["load"].children[0].children[0].className = "progress-bar progress-bar-error"; - TableRow.children["load"].children[0].children[0].innerHTML = "<small>错误</small>"; - TableRow.children["network"].children[0].children[0].className = "progress-bar progress-bar-error"; - TableRow.children["network"].children[0].children[0].innerHTML = "<small>错误</small>"; - TableRow.children["traffic"].children[0].children[0].className = "progress-bar progress-bar-error"; - TableRow.children["traffic"].children[0].children[0].innerHTML = "<small>错误</small>"; - TableRow.children["cpu"].children[0].children[0].className = "progress-bar progress-bar-error"; - TableRow.children["cpu"].children[0].children[0].style.width = "100%"; - TableRow.children["cpu"].children[0].children[0].innerHTML = "<small>错误</small>"; - TableRow.children["memory"].children[0].children[0].className = "progress-bar progress-bar-error"; - TableRow.children["memory"].children[0].children[0].style.width = "100%"; - TableRow.children["memory"].children[0].children[0].innerHTML = "<small>错误</small>"; - TableRow.children["hdd"].children[0].children[0].className = "progress-bar progress-bar-error"; - TableRow.children["hdd"].children[0].children[0].style.width = "100%"; - TableRow.children["hdd"].children[0].children[0].innerHTML = "<small>错误</small>"; - TableRow.children["ping"].children[0].children[0].className = "progress-bar progress-bar-error"; - TableRow.children["ping"].children[0].children[0].style.width = "100%"; - TableRow.children["ping"].children[0].children[0].innerHTML = "<small>错误</small>"; - MableRow.children["monitor_text"].children[0].children[0].className = "progress-bar progress-bar-error"; - MableRow.children["monitor_text"].children[0].children[0].innerHTML = "<small>错误</small>"; - if(ExpandRow.hasClass("in")) { - ExpandRow.collapse("hide"); - } - TableRow.setAttribute("data-target", ""); - MableRow.setAttribute("data-target", ""); - server_status[i] = false; - }); - } - error = 1; - $("#updated").html("更新错误."); - }); + d = new Date(result.updated * 1000); + error = 0; + }).fail(function() { + if (!error) { + $("#servers > tr.accordion-toggle").each(function(i) { + const TableRow = $("#servers tr#r" + i); + const MableRow = $("#monitors tr#r" + i); + const ExpandRow = $("#servers #rt" + i); + TableRow.find(".progress-bar").attr("class", "progress-bar progress-bar-error").html("<small>错误</small>"); + MableRow.find(".progress-bar").attr("class", "progress-bar progress-bar-error").html("<small>错误</small>"); + if (ExpandRow.hasClass("in")) ExpandRow.collapse("hide"); + TableRow.attr("data-target", ""); + MableRow.attr("data-target", ""); + server_status[i] = false; + }); + } + error = 1; + $("#updated").html("更新错误."); + }); } function updateTime() { - if (!error) - $("#updated").html("最后更新: " + timeSince(d)); + if (!error) $("#updated").html("最后更新: " + timeSince(d)); } uptime(); @@ -361,67 +183,44 @@ updateTime(); setInterval(uptime, 2000); setInterval(updateTime, 2000); - // styleswitcher.js -function setActiveStyleSheet(title, cookie=false) { - var i, a, main; - for(i=0; (a = document.getElementsByTagName("link")[i]); i++) { - if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title")) { - a.disabled = true; - if(a.getAttribute("title") == title) a.disabled = false; - } - } - if (true==cookie) { - createCookie("style", title, 365); +function setActiveStyleSheet(title, cookie = false) { + Array.from(document.getElementsByTagName("link")).forEach(a => { + if (a.getAttribute("rel").includes("style") && a.getAttribute("title")) { + a.disabled = a.getAttribute("title") !== title; } + }); + if (cookie) createCookie("style", title, 365); } function getActiveStyleSheet() { - var i, a; - for(i=0; (a = document.getElementsByTagName("link")[i]); i++) { - if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title") && !a.disabled) - return a.getAttribute("title"); - } - return null; + return Array.from(document.getElementsByTagName("link")).find(a => a.getAttribute("rel").includes("style") && a.getAttribute("title") && !a.disabled)?.getAttribute("title") || null; } -function createCookie(name,value,days) { - if (days) { - var date = new Date(); - date.setTime(date.getTime()+(days*24*60*60*1000)); - var expires = "; expires="+date.toGMTString(); - } - else expires = ""; - document.cookie = name+"="+value+expires+"; path=/"; +function createCookie(name, value, days) { + const expires = days ? `; expires=${new Date(Date.now() + days * 24 * 60 * 60 * 1000).toGMTString()}` : ""; + document.cookie = `${name}=${value}${expires}; path=/`; } function readCookie(name) { - var nameEQ = name + "="; - var ca = document.cookie.split(';'); - for(var i=0;i < ca.length;i++) { - var c = ca[i]; - while (c.charAt(0)==' ') - c = c.substring(1,c.length); - if (c.indexOf(nameEQ) == 0) - return c.substring(nameEQ.length,c.length); - } - return null; + const nameEQ = name + "="; + const ca = document.cookie.split(';'); + for (let i = 0; i < ca.length; i++) { + let c = ca[i]; + while (c.charAt(0) == ' ') c = c.substring(1, c.length); + if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length); + } + return null; } -window.onload = function(e) { - var cookie = readCookie("style"); - if (cookie && cookie != 'null' ) { - setActiveStyleSheet(cookie); - } else { - function handleChange (mediaQueryListEvent) { - if (mediaQueryListEvent.matches) { - setActiveStyleSheet('dark'); - } else { - setActiveStyleSheet('light'); - } - } - const mediaQueryListDark = window.matchMedia('(prefers-color-scheme: dark)'); - setActiveStyleSheet(mediaQueryListDark.matches ? 'dark' : 'light'); - mediaQueryListDark.addEventListener("change",handleChange); - } -} +window.onload = function() { + const cookie = readCookie("style"); + if (cookie && cookie != 'null') { + setActiveStyleSheet(cookie); + } else { + const handleChange = mediaQueryListEvent => setActiveStyleSheet(mediaQueryListEvent.matches ? 'dark' : 'light'); + const mediaQueryListDark = window.matchMedia('(prefers-color-scheme: dark)'); + setActiveStyleSheet(mediaQueryListDark.matches ? 'dark' : 'light'); + mediaQueryListDark.addEventListener("change", handleChange); + } +} \ No newline at end of file