diff --git a/packages/cjs/flask-state.js b/packages/cjs/flask-state.js
index 11d61a7..a3d952e 100644
--- a/packages/cjs/flask-state.js
+++ b/packages/cjs/flask-state.js
@@ -32,17 +32,16 @@
this.language = language;
this.mobile = MachineStatus.isMobile();
this.index = 0;
- this.ajax = new Ajax();
this.initFlaskStateContainer(this.mobile);
this.setEventListener();
this.initFlaskStateLanguage(this.language);
this.setInitParams();
if (this.mobile) {
- this.setTagChangeEventListener(this.consoleCpuChart, this.consoleMemoryChart, this.consoleLoadavgChart, this.consoleDiskusageChart);
+ this.setTagChangeEventListener(this.consoleCpuChart, this.consoleMemoryChart, this.consoleLoadavgChart, this.consoleDiskUsageChart);
}
// Bind window resizing redraw event
window.addEventListener('resize', () => {
- MachineStatus.resizeChartTimer([this.consoleMemoryChart, this.consoleCpuChart, this.consoleLoadavgChart, this.consoleDiskusageChart]);
+ MachineStatus.resizeChartTimer([this.consoleMemoryChart, this.consoleCpuChart, this.consoleLoadavgChart, this.consoleDiskUsageChart]);
})
};
@@ -154,7 +153,7 @@
this.consoleCpuChart = echarts.init(document.getElementById('fs-info-cpu-chart'), null, {renderer: 'svg'});
this.consoleMemoryChart = echarts.init(document.getElementById('fs-info-memory-chart'), null, {renderer: 'svg'});
this.consoleLoadavgChart = echarts.init(document.getElementById('fs-info-loadavg-chart'), null, {renderer: 'svg'});
- this.consoleDiskusageChart = echarts.init(document.getElementById('fs-info-diskusage-chart'), null, {renderer: 'svg'});
+ this.consoleDiskUsageChart = echarts.init(document.getElementById('fs-info-diskusage-chart'), null, {renderer: 'svg'});
this.cpuOption = MachineStatus.generateChatOption(this.mobile, this.language.cpu || 'CPU', '', this.language.today || 'Today');
this.memoryOption = MachineStatus.generateChatOption(this.mobile, this.language.memory || 'Memory', '', this.language.today || 'Today');
this.diskUsageOption = MachineStatus.generateChatOption(this.mobile, this.language.disk_usage || 'Disk Usage', '', this.language.today || 'Today');
@@ -166,134 +165,144 @@
this.consoleCpuChart.showLoading();
this.consoleMemoryChart.showLoading();
this.consoleLoadavgChart.showLoading();
- this.consoleDiskusageChart.showLoading();
- this.ajax.send({
- type: 'POST',
- url: '/v0/state/hoststatus',
- data: {'timeQuantum': days},
- success: response => {
- if (response.code !== 200) {
- return;
- }
+ this.consoleDiskUsageChart.showLoading();
+ fetch(
+ "/v0/state/hoststatus",
+ {
+ method: "POST",
+ credentials: "include",
+ headers: {
+ "Content-Type": "application/json;charset=UTF-8",
+ },
+ body: JSON.stringify({"timeQuantum": days}),
+ }
+ ).then((res) => {
+ if (res.ok) {
+ res.json().then((response) => {
+ if (response.code !== 200) {
+ return;
+ }
- const fields = ["ts", "cpu", "memory", "load_avg", "disk_usage"];
- const data = response.data;
+ const fields = ["ts", "cpu", "memory", "load_avg", "disk_usage"];
+ const data = response.data;
- data.items = data.items.map(item => {
- let element = {};
- fields.forEach((field, index) => {
- if (field === "ts") return element[field] = SECONDS_TO_MILLISECONDS * item[index];
- element[field] = item[index];
- });
- return element;
- });
- let currentStatistic = data.currentStatistic;
- if (Object.keys(currentStatistic).length) {
- let hostInfoSpan = document.getElementById('fs-host-status').getElementsByClassName('fs-badge-content');
- hostInfoSpan[0].innerHTML = currentStatistic.memory + '%';
- hostInfoSpan[1].innerHTML = currentStatistic.cpu + '%';
- hostInfoSpan[2].innerHTML = currentStatistic.disk_usage + '%';
- hostInfoSpan[3].innerHTML = currentStatistic.load_avg[0] + "，" + currentStatistic.load_avg[1] + "，" + currentStatistic.load_avg[2];
-
- hostInfoSpan[4].innerHTML = MachineStatus.getFormatSeconds(currentStatistic.boot_seconds || 0, this.language.days, this.language.hours, this.language.minutes, this.language.seconds);
-
- const machineIndex = ['memory', 'cpu', 'disk_usage', 'load_avg'];
- machineIndex.forEach(function (item, index) {
- let paramClass = '';
- if (item === 'load_avg') {
- let loadavgAvg = (currentStatistic.load_avg[0] + currentStatistic.load_avg[1] + currentStatistic.load_avg[2]) / 3;
- paramClass = loadavgAvg >= LOADAVG_VALUE.WARNING ? loadavgAvg >= LOADAVG_VALUE.DANGER ? 'background-red' : 'background-orange' : 'background-green';
- } else {
- paramClass = currentStatistic[item] >= MACHINE_VALUE.WARNING ? currentStatistic.memory >= MACHINE_VALUE.DANGER ? 'background-red' : 'background-orange' : 'background-green';
- }
- let param = hostInfoSpan[index].classList;
- param.remove('background-green', 'background-orange', 'background-red');
- param.add(paramClass);
+ data.items = data.items.map(item => {
+ let element = {};
+ fields.forEach((field, index) => {
+ if (field === "ts") return element[field] = SECONDS_TO_MILLISECONDS * item[index];
+ element[field] = item[index];
+ });
+ return element;
});
-
- let hostInfoExtendSpan = document.getElementById('fs-redis-status').getElementsByClassName('fs-badge-content');
- let hostInfoKeysList = ['used_memory', 'used_memory_rss', 'mem_fragmentation_ratio', 'hits_ratio', 'delta_hits_ratio', 'uptime_in_seconds', 'connected_clients'];
- let hideRedis = true
- for (let item of hostInfoKeysList) {
- if (currentStatistic[item]) {
- hideRedis = false
- break
- }
- }
- if (hideRedis) {
- document.getElementById('fs-redis-status-title').innerHTML = '';
- document.getElementById('fs-redis-status-title').style.marginTop = '0';
- document.getElementById('fs-redis-status').style.display = 'none';
- } else {
- hostInfoKeysList.forEach((item, index) => {
- switch (item) {
- case 'used_memory':
- hostInfoExtendSpan[index].innerHTML = Math.ceil(currentStatistic[item] / BIT_TO_MB) + ' M';
- break;
- case 'used_memory_rss':
- hostInfoExtendSpan[index].innerHTML = Math.ceil(currentStatistic[item] / BIT_TO_MB) + ' M';
- break;
- case 'mem_fragmentation_ratio':
- let ratio = currentStatistic[item];
- hostInfoExtendSpan[index].innerHTML = currentStatistic[item];
- if (ratio !== null && ratio !== undefined && ratio > 1) {
- let hostInfoExtendSpanClass = hostInfoExtendSpan[index].classList;
- hostInfoExtendSpanClass.remove('background-green');
- hostInfoExtendSpanClass.add('background-red');
- }
- break;
- case 'hits_ratio':
- hostInfoExtendSpan[index].innerHTML = currentStatistic[item] + '%';
- break;
- case 'delta_hits_ratio':
- hostInfoExtendSpan[index].innerHTML = currentStatistic[item] + '%';
- break;
- case 'uptime_in_seconds':
- hostInfoExtendSpan[index].innerHTML = MachineStatus.getFormatSeconds(currentStatistic[item], this.language.days, this.language.hours, this.language.minutes, this.language.seconds);
- break;
- case 'connected_clients':
- hostInfoExtendSpan[index].innerHTML = currentStatistic[item];
+ let currentStatistic = data.currentStatistic;
+ if (Object.keys(currentStatistic).length) {
+ let hostInfoSpan = document.getElementById('fs-host-status').getElementsByClassName('fs-badge-content');
+ hostInfoSpan[0].innerHTML = currentStatistic.memory + '%';
+ hostInfoSpan[1].innerHTML = currentStatistic.cpu + '%';
+ hostInfoSpan[2].innerHTML = currentStatistic.disk_usage + '%';
+ hostInfoSpan[3].innerHTML = currentStatistic.load_avg[0] + "，" + currentStatistic.load_avg[1] + "，" + currentStatistic.load_avg[2];
+
+ hostInfoSpan[4].innerHTML = MachineStatus.getFormatSeconds(currentStatistic.boot_seconds || 0, this.language.days, this.language.hours, this.language.minutes, this.language.seconds);
+
+ const machineIndex = ['memory', 'cpu', 'disk_usage', 'load_avg'];
+ machineIndex.forEach(function (item, index) {
+ let paramClass;
+ if (item === 'load_avg') {
+ let loadavgAvg = (currentStatistic.load_avg[0] + currentStatistic.load_avg[1] + currentStatistic.load_avg[2]) / 3;
+ paramClass = loadavgAvg >= LOADAVG_VALUE.WARNING ? loadavgAvg >= LOADAVG_VALUE.DANGER ? 'background-red' : 'background-orange' : 'background-green';
+ } else {
+ paramClass = currentStatistic[item] >= MACHINE_VALUE.WARNING ? currentStatistic.memory >= MACHINE_VALUE.DANGER ? 'background-red' : 'background-orange' : 'background-green';
}
+ let param = hostInfoSpan[index].classList;
+ param.remove('background-green', 'background-orange', 'background-red');
+ param.add(paramClass);
});
+
+ let hostInfoExtendSpan = document.getElementById('fs-redis-status').getElementsByClassName('fs-badge-content');
+ let hostInfoKeysList = ['used_memory', 'used_memory_rss', 'mem_fragmentation_ratio', 'hits_ratio', 'delta_hits_ratio', 'uptime_in_seconds', 'connected_clients'];
+ let hideRedis = true
+ for (let item of hostInfoKeysList) {
+ if (currentStatistic[item]) {
+ hideRedis = false
+ break
+ }
+ }
+ if (hideRedis) {
+ document.getElementById('fs-redis-status-title').innerHTML = '';
+ document.getElementById('fs-redis-status-title').style.marginTop = '0';
+ document.getElementById('fs-redis-status').style.display = 'none';
+ } else {
+ hostInfoKeysList.forEach((item, index) => {
+ switch (item) {
+ case 'used_memory':
+ hostInfoExtendSpan[index].innerHTML = Math.ceil(currentStatistic[item] / BIT_TO_MB) + ' M';
+ break;
+ case 'used_memory_rss':
+ hostInfoExtendSpan[index].innerHTML = Math.ceil(currentStatistic[item] / BIT_TO_MB) + ' M';
+ break;
+ case 'mem_fragmentation_ratio':
+ let ratio = currentStatistic[item];
+ hostInfoExtendSpan[index].innerHTML = currentStatistic[item];
+ if (ratio !== null && ratio !== undefined && ratio > 1) {
+ let hostInfoExtendSpanClass = hostInfoExtendSpan[index].classList;
+ hostInfoExtendSpanClass.remove('background-green');
+ hostInfoExtendSpanClass.add('background-red');
+ }
+ break;
+ case 'hits_ratio':
+ hostInfoExtendSpan[index].innerHTML = currentStatistic[item] + '%';
+ break;
+ case 'delta_hits_ratio':
+ hostInfoExtendSpan[index].innerHTML = currentStatistic[item] + '%';
+ break;
+ case 'uptime_in_seconds':
+ hostInfoExtendSpan[index].innerHTML = MachineStatus.getFormatSeconds(currentStatistic[item], this.language.days, this.language.hours, this.language.minutes, this.language.seconds);
+ break;
+ case 'connected_clients':
+ hostInfoExtendSpan[index].innerHTML = currentStatistic[item];
+ }
+ });
+ }
}
- }
- data.items.reverse();
- let dataMap = MachineStatus.getChartsData(data.items);
-
- let tsList = dataMap.ts_list;
- let cpuList = dataMap.cpu_list;
- let memoryList = dataMap.memory_list;
- let loadavgList = dataMap.load_avg_list[0];
- let loadavg5MinList = dataMap.load_avg_list[1];
- let loadavg15MinList = dataMap.load_avg_list[2];
- let diskUsageList = dataMap.disk_usage_list;
-
- this.memoryOption.xAxis.data = tsList;
- this.cpuOption.xAxis.data = tsList;
- this.loadavgOption.xAxis.data = tsList;
- this.diskUsageOption.xAxis.data = tsList;
-
- this.memoryOption.series[0].data = memoryList;
- this.cpuOption.series[0].data = cpuList;
- this.diskUsageOption.series[0].data = diskUsageList;
- this.loadavgOption.series[0].data = loadavgList;
- this.loadavgOption.series[1].data = loadavg5MinList;
- this.loadavgOption.series[2].data = loadavg15MinList;
-
- this.consoleMemoryChart.setOption(this.memoryOption);
- this.consoleCpuChart.setOption(this.cpuOption);
- this.consoleLoadavgChart.setOption(this.loadavgOption);
- this.consoleDiskusageChart.setOption(this.diskUsageOption);
- MachineStatus.resizeChart([this.consoleMemoryChart, this.consoleCpuChart, this.consoleLoadavgChart, this.consoleDiskusageChart]);
- },
- complete: () => {
- this.consoleMemoryChart.hideLoading();
- this.consoleCpuChart.hideLoading();
- this.consoleLoadavgChart.hideLoading();
- this.consoleDiskusageChart.hideLoading();
- },
- }).then();
+ data.items.reverse();
+ let dataMap = MachineStatus.getChartsData(data.items);
+
+ let tsList = dataMap.ts_list;
+ let cpuList = dataMap.cpu_list;
+ let memoryList = dataMap.memory_list;
+ let loadavgList = dataMap.load_avg_list[0];
+ let loadavg5MinList = dataMap.load_avg_list[1];
+ let loadavg15MinList = dataMap.load_avg_list[2];
+ let diskUsageList = dataMap.disk_usage_list;
+
+ this.memoryOption.xAxis.data = tsList;
+ this.cpuOption.xAxis.data = tsList;
+ this.loadavgOption.xAxis.data = tsList;
+ this.diskUsageOption.xAxis.data = tsList;
+
+ this.memoryOption.series[0].data = memoryList;
+ this.cpuOption.series[0].data = cpuList;
+ this.diskUsageOption.series[0].data = diskUsageList;
+ this.loadavgOption.series[0].data = loadavgList;
+ this.loadavgOption.series[1].data = loadavg5MinList;
+ this.loadavgOption.series[2].data = loadavg15MinList;
+
+ this.consoleMemoryChart.setOption(this.memoryOption);
+ this.consoleCpuChart.setOption(this.cpuOption);
+ this.consoleLoadavgChart.setOption(this.loadavgOption);
+ this.consoleDiskUsageChart.setOption(this.diskUsageOption);
+ MachineStatus.resizeChart([this.consoleMemoryChart, this.consoleCpuChart, this.consoleLoadavgChart, this.consoleDiskUsageChart]);
+ }).then(() => {
+ this.consoleMemoryChart.hideLoading();
+ this.consoleCpuChart.hideLoading();
+ this.consoleLoadavgChart.hideLoading();
+ this.consoleDiskUsageChart.hideLoading();
+ })
+ }
+ }).catch(function (err) {
+ console.log(err);
+ })
};
/* Check if the device is a mobile phone */
@@ -356,7 +365,8 @@
data: [lineName],
textStyle: {
fontSize: 14
- }
+ },
+ show: titleText === 'Load Avg',
},
grid: {
left: '3%',
@@ -368,8 +378,10 @@
toolbox: {
show: !isMobile,
feature: {
- saveAsImage: {}
- }
+ saveAsImage: {
+ title: ' ',
+ }
+ },
},
xAxis: {
type: 'category',
@@ -381,7 +393,10 @@
}
},
yAxis: {
- type: 'value'
+ type: 'value',
+ axisLabel: {
+ formatter: (value) => value + (titleText === 'Load Avg' ? '' : '%'),
+ },
},
series: [
{
@@ -466,64 +481,6 @@
};
}
- /* Native Ajax classes */
- class Ajax {
- constructor(xhr) {
- xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");
- this.xhr = xhr;
- }
-
- send(options) {
-
- let xhr = this.xhr;
-
- let opt = {
- type: options.type || 'get',
- url: options.url || '',
- async: options.async || true,
- data: JSON.stringify(options.data),
- dataType: options.dataType || 'json',
- contentType: 'application/json',
- success: options.success || null,
- complete: options.complete || null
- };
-
-
- return new Promise((resolve, reject) => {
- xhr.open(opt.type, opt.url, opt.async);
- xhr.onreadystatechange = () => {
- // readyState: 0: init, 1: connect has set up, 2: receive request, 3: request.. , 4: request end, send response
- if (xhr.readyState === 4) {
- // status: 200: OK, 401: Verification Failed, 404: Not Found Page
- if (opt.dataType === 'json') {
- const data = JSON.parse(xhr.responseText);
- resolve(data);
- if (opt.success !== null) {
- opt.success(data);
- } else {
- reject(new Error(String(xhr.status) || 'No callback function.'));
- }
- } else {
- reject(new Error(String(xhr.status) || 'Error data type.'));
- }
- }
- };
-
- xhr.onerror = () => {
- reject(new Error(String(xhr.status) || 'Server is fail.'));
- };
-
- xhr.setRequestHeader("Content-type", opt.contentType);
- xhr.send(opt.data);
- xhr.onloadend = () => {
- if (opt.complete != null) {
- opt.complete();
- }
- };
- });
- }
- }
-
/* singleton */
const FlaskStateInstance = (function () {
let instance = null;
diff --git a/packages/cjs/flask-state.min.js b/packages/cjs/flask-state.min.js
index 273d161..1b71336 100644
--- a/packages/cjs/flask-state.min.js
+++ b/packages/cjs/flask-state.min.js
@@ -10,4 +10,4 @@
'use strict';
-module.exports=function(e){var t={};function s(a){if(t[a])return t[a].exports;var n=t[a]={i:a,l:!1,exports:{}};return e[a].call(n.exports,n,n.exports,s),n.l=!0,n.exports}return s.m=e,s.c=t,s.d=function(e,t,a){s.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:a})},s.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},s.t=function(e,t){if(1&t&&(e=s(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var a=Object.create(null);if(s.r(a),Object.defineProperty(a,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var n in e)s.d(a,n,function(t){return e[t]}.bind(null,n));return a},s.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return s.d(t,"a",t),t},s.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},s.p="",s(s.s=0)}([function(e,t,s){"use strict";const a=85,n=75,i=10,o=5,r=1048576;class d{constructor(e){this.language=e,this.mobile=d.isMobile(),this.index=0,this.ajax=new l,this.initFlaskStateContainer(this.mobile),this.setEventListener(),this.initFlaskStateLanguage(this.language),this.setInitParams(),this.mobile&&this.setTagChangeEventListener(this.consoleCpuChart,this.consoleMemoryChart,this.consoleLoadavgChart,this.consoleDiskusageChart),window.addEventListener("resize",(()=>{d.resizeChartTimer([this.consoleMemoryChart,this.consoleCpuChart,this.consoleLoadavgChart,this.consoleDiskusageChart])}))}setFlaskStateData(){document.getElementById("fs-background").style.display="block",document.getElementById("fs-info-container").style.display="block",document.getElementsByTagName("body")[0].style.overflowX="hidden",document.getElementsByTagName("body")[0].style.overflowY="hidden",document.getElementById("fs-select-days").value="1",this.setCharts("1")}initFlaskStateContainer(){let e='Host Status
Memory
CPU
Disk Usage
Load Avg
Uptime
Redis Status
Used Mem
Mem Fragmentation Ratio
Cache Hits Ratio
24h Hits Ratio
Uptime
Connections
'+(this.mobile?'
':"
")+"
";for(let a=0;a";return t}},legend:{data:[a],textStyle:{fontSize:14}},grid:{left:"3%",right:"4%",bottom:"3%",top:e?30:60,containLabel:!0},toolbox:{show:!e,feature:{saveAsImage:{}}},xAxis:{type:"category",boundaryGap:!1,axisLabel:{formatter:function(e){return echarts.format.formatTime("hh:mm",new Date(parseInt(e)),!1)}}},yAxis:{type:"value"},series:[{name:a,type:"line",symbol:"none",hoverAnimation:!1}]};return"loadavg"===s&&(n.legend.data=["1 "+a,"5 "+a,"15 "+a],n.series=[],n.legend.data.forEach((e=>{n.series.push({name:e,type:"line",symbol:"none",hoverAnimation:!1})}))),n}static getChartsData(e){let t=[],s=[],a=[],n=[],i=[],o=[],r=[];for(let d=0;d=60?(o=i/60,o>=60&&(r=o/60,o%=60),r>=24&&(d=r/24,r%=24)):l=i+n,o>0&&(l=Math.floor(o)+" "+a),r>0&&(l=Math.floor(r)+" "+s),d>0&&(l=Math.floor(d)+" "+t),l}}class l{constructor(e){e=window.XMLHttpRequest?new XMLHttpRequest:new ActiveXObject("Microsoft.XMLHTTP"),this.xhr=e}send(e){let t=this.xhr,s={type:e.type||"get",url:e.url||"",async:e.async||!0,data:JSON.stringify(e.data),dataType:e.dataType||"json",contentType:"application/json",success:e.success||null,complete:e.complete||null};return new Promise(((e,a)=>{t.open(s.type,s.url,s.async),t.onreadystatechange=()=>{if(4===t.readyState)if("json"===s.dataType){const n=JSON.parse(t.responseText);e(n),null!==s.success?s.success(n):a(new Error(String(t.status)||"No callback function."))}else a(new Error(String(t.status)||"Error data type."))},t.onerror=()=>{a(new Error(String(t.status)||"Server is fail."))},t.setRequestHeader("Content-type",s.contentType),t.send(s.data),t.onloadend=()=>{null!=s.complete&&s.complete()}}))}}const c=function(){let e=null;return function(t){return e||(e=new d(t))}}();t.init=function(e){let t=null,s={};if(null!==e&&"object"==typeof e&&(t=e.hasOwnProperty("dom")?e.dom:null,s=e.hasOwnProperty("lang")&&e.lang.hasOwnProperty("language")?e.lang:{}),t instanceof HTMLElement){if(t.getAttribute("flaskState"))return;t.setAttribute("flaskState","true"),t.addEventListener("click",(()=>c(s).setFlaskStateData()))}else{if(document.getElementById("fs-state-circular"))return;let e="";document.getElementsByTagName("body")[0].insertAdjacentHTML("beforeend",e);let t,n=document.getElementById("fs-state-circular");function a(e){n.style.top=e.clientY-t+300+"px"}n.onclick=function(){this.classList.add("fs-circular-out"),c(s).setFlaskStateData()},n.onmousedown=function(e){t=t||e.clientY,document.addEventListener("mousemove",a)},document.onmouseup=function(){document.removeEventListener("mousemove",a);const e=parseInt(n.style.top);n.classList.add("fs-circular-animation"),n.style.top=Math.min(Math.max(e,50),window.screen.height-200)+"px",setTimeout((()=>n.classList.remove("fs-circular-animation")),500)}}}}]);
\ No newline at end of file
+module.exports=function(e){var t={};function s(a){if(t[a])return t[a].exports;var n=t[a]={i:a,l:!1,exports:{}};return e[a].call(n.exports,n,n.exports,s),n.l=!0,n.exports}return s.m=e,s.c=t,s.d=function(e,t,a){s.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:a})},s.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},s.t=function(e,t){if(1&t&&(e=s(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var a=Object.create(null);if(s.r(a),Object.defineProperty(a,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var n in e)s.d(a,n,function(t){return e[t]}.bind(null,n));return a},s.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return s.d(t,"a",t),t},s.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},s.p="",s(s.s=0)}([function(e,t,s){"use strict";const a=85,n=75,i=10,o=5,d=1048576;class r{constructor(e){this.language=e,this.mobile=r.isMobile(),this.index=0,this.initFlaskStateContainer(this.mobile),this.setEventListener(),this.initFlaskStateLanguage(this.language),this.setInitParams(),this.mobile&&this.setTagChangeEventListener(this.consoleCpuChart,this.consoleMemoryChart,this.consoleLoadavgChart,this.consoleDiskUsageChart),window.addEventListener("resize",(()=>{r.resizeChartTimer([this.consoleMemoryChart,this.consoleCpuChart,this.consoleLoadavgChart,this.consoleDiskUsageChart])}))}setFlaskStateData(){document.getElementById("fs-background").style.display="block",document.getElementById("fs-info-container").style.display="block",document.getElementsByTagName("body")[0].style.overflowX="hidden",document.getElementsByTagName("body")[0].style.overflowY="hidden",document.getElementById("fs-select-days").value="1",this.setCharts("1")}initFlaskStateContainer(){let e='Host Status
Memory
CPU
Disk Usage
Load Avg
Uptime
Redis Status
Used Mem
Mem Fragmentation Ratio
Cache Hits Ratio
24h Hits Ratio
Uptime
Connections
'+(this.mobile?'
':"
")+"
";for(let a=0;a";return t}},legend:{data:[a],textStyle:{fontSize:14},show:"Load Avg"===t},grid:{left:"3%",right:"4%",bottom:"3%",top:e?30:60,containLabel:!0},toolbox:{show:!e,feature:{saveAsImage:{title:" "}}},xAxis:{type:"category",boundaryGap:!1,axisLabel:{formatter:function(e){return echarts.format.formatTime("hh:mm",new Date(parseInt(e)),!1)}}},yAxis:{type:"value",axisLabel:{formatter:e=>e+("Load Avg"===t?"":"%")}},series:[{name:a,type:"line",symbol:"none",hoverAnimation:!1}]};return"loadavg"===s&&(n.legend.data=["1 "+a,"5 "+a,"15 "+a],n.series=[],n.legend.data.forEach((e=>{n.series.push({name:e,type:"line",symbol:"none",hoverAnimation:!1})}))),n}static getChartsData(e){let t=[],s=[],a=[],n=[],i=[],o=[],d=[];for(let r=0;r=60?(o=i/60,o>=60&&(d=o/60,o%=60),d>=24&&(r=d/24,d%=24)):l=i+n,o>0&&(l=Math.floor(o)+" "+a),d>0&&(l=Math.floor(d)+" "+s),r>0&&(l=Math.floor(r)+" "+t),l}}const l=function(){let e=null;return function(t){return e||(e=new r(t))}}();t.init=function(e){let t=null,s={};if(null!==e&&"object"==typeof e&&(t=e.hasOwnProperty("dom")?e.dom:null,s=e.hasOwnProperty("lang")&&e.lang.hasOwnProperty("language")?e.lang:{}),t instanceof HTMLElement){if(t.getAttribute("flaskState"))return;t.setAttribute("flaskState","true"),t.addEventListener("click",(()=>l(s).setFlaskStateData()))}else{if(document.getElementById("fs-state-circular"))return;let e="";document.getElementsByTagName("body")[0].insertAdjacentHTML("beforeend",e);let t,n=document.getElementById("fs-state-circular");function a(e){n.style.top=e.clientY-t+300+"px"}n.onclick=function(){this.classList.add("fs-circular-out"),l(s).setFlaskStateData()},n.onmousedown=function(e){t=t||e.clientY,document.addEventListener("mousemove",a)},document.onmouseup=function(){document.removeEventListener("mousemove",a);const e=parseInt(n.style.top);n.classList.add("fs-circular-animation"),n.style.top=Math.min(Math.max(e,50),window.screen.height-200)+"px",setTimeout((()=>n.classList.remove("fs-circular-animation")),500)}}}}]);
\ No newline at end of file
diff --git a/packages/umd/flask-state.js b/packages/umd/flask-state.js
index 6570a81..147b611 100644
--- a/packages/umd/flask-state.js
+++ b/packages/umd/flask-state.js
@@ -36,17 +36,16 @@
this.language = language;
this.mobile = MachineStatus.isMobile();
this.index = 0;
- this.ajax = new Ajax();
this.initFlaskStateContainer(this.mobile);
this.setEventListener();
this.initFlaskStateLanguage(this.language);
this.setInitParams();
if (this.mobile) {
- this.setTagChangeEventListener(this.consoleCpuChart, this.consoleMemoryChart, this.consoleLoadavgChart, this.consoleDiskusageChart);
+ this.setTagChangeEventListener(this.consoleCpuChart, this.consoleMemoryChart, this.consoleLoadavgChart, this.consoleDiskUsageChart);
}
// Bind window resizing redraw event
window.addEventListener('resize', () => {
- MachineStatus.resizeChartTimer([this.consoleMemoryChart, this.consoleCpuChart, this.consoleLoadavgChart, this.consoleDiskusageChart]);
+ MachineStatus.resizeChartTimer([this.consoleMemoryChart, this.consoleCpuChart, this.consoleLoadavgChart, this.consoleDiskUsageChart]);
})
};
@@ -158,7 +157,7 @@
this.consoleCpuChart = echarts.init(document.getElementById('fs-info-cpu-chart'), null, {renderer: 'svg'});
this.consoleMemoryChart = echarts.init(document.getElementById('fs-info-memory-chart'), null, {renderer: 'svg'});
this.consoleLoadavgChart = echarts.init(document.getElementById('fs-info-loadavg-chart'), null, {renderer: 'svg'});
- this.consoleDiskusageChart = echarts.init(document.getElementById('fs-info-diskusage-chart'), null, {renderer: 'svg'});
+ this.consoleDiskUsageChart = echarts.init(document.getElementById('fs-info-diskusage-chart'), null, {renderer: 'svg'});
this.cpuOption = MachineStatus.generateChatOption(this.mobile, this.language.cpu || 'CPU', '', this.language.today || 'Today');
this.memoryOption = MachineStatus.generateChatOption(this.mobile, this.language.memory || 'Memory', '', this.language.today || 'Today');
this.diskUsageOption = MachineStatus.generateChatOption(this.mobile, this.language.disk_usage || 'Disk Usage', '', this.language.today || 'Today');
@@ -170,134 +169,144 @@
this.consoleCpuChart.showLoading();
this.consoleMemoryChart.showLoading();
this.consoleLoadavgChart.showLoading();
- this.consoleDiskusageChart.showLoading();
- this.ajax.send({
- type: 'POST',
- url: '/v0/state/hoststatus',
- data: {'timeQuantum': days},
- success: response => {
- if (response.code !== 200) {
- return;
- }
+ this.consoleDiskUsageChart.showLoading();
+ fetch(
+ "/v0/state/hoststatus",
+ {
+ method: "POST",
+ credentials: "include",
+ headers: {
+ "Content-Type": "application/json;charset=UTF-8",
+ },
+ body: JSON.stringify({"timeQuantum": days}),
+ }
+ ).then((res) => {
+ if (res.ok) {
+ res.json().then((response) => {
+ if (response.code !== 200) {
+ return;
+ }
- const fields = ["ts", "cpu", "memory", "load_avg", "disk_usage"];
- const data = response.data;
+ const fields = ["ts", "cpu", "memory", "load_avg", "disk_usage"];
+ const data = response.data;
- data.items = data.items.map(item => {
- let element = {};
- fields.forEach((field, index) => {
- if (field === "ts") return element[field] = SECONDS_TO_MILLISECONDS * item[index];
- element[field] = item[index];
- });
- return element;
- });
- let currentStatistic = data.currentStatistic;
- if (Object.keys(currentStatistic).length) {
- let hostInfoSpan = document.getElementById('fs-host-status').getElementsByClassName('fs-badge-content');
- hostInfoSpan[0].innerHTML = currentStatistic.memory + '%';
- hostInfoSpan[1].innerHTML = currentStatistic.cpu + '%';
- hostInfoSpan[2].innerHTML = currentStatistic.disk_usage + '%';
- hostInfoSpan[3].innerHTML = currentStatistic.load_avg[0] + "，" + currentStatistic.load_avg[1] + "，" + currentStatistic.load_avg[2];
-
- hostInfoSpan[4].innerHTML = MachineStatus.getFormatSeconds(currentStatistic.boot_seconds || 0, this.language.days, this.language.hours, this.language.minutes, this.language.seconds);
-
- const machineIndex = ['memory', 'cpu', 'disk_usage', 'load_avg'];
- machineIndex.forEach(function (item, index) {
- let paramClass = '';
- if (item === 'load_avg') {
- let loadavgAvg = (currentStatistic.load_avg[0] + currentStatistic.load_avg[1] + currentStatistic.load_avg[2]) / 3;
- paramClass = loadavgAvg >= LOADAVG_VALUE.WARNING ? loadavgAvg >= LOADAVG_VALUE.DANGER ? 'background-red' : 'background-orange' : 'background-green';
- } else {
- paramClass = currentStatistic[item] >= MACHINE_VALUE.WARNING ? currentStatistic.memory >= MACHINE_VALUE.DANGER ? 'background-red' : 'background-orange' : 'background-green';
- }
- let param = hostInfoSpan[index].classList;
- param.remove('background-green', 'background-orange', 'background-red');
- param.add(paramClass);
+ data.items = data.items.map(item => {
+ let element = {};
+ fields.forEach((field, index) => {
+ if (field === "ts") return element[field] = SECONDS_TO_MILLISECONDS * item[index];
+ element[field] = item[index];
+ });
+ return element;
});
-
- let hostInfoExtendSpan = document.getElementById('fs-redis-status').getElementsByClassName('fs-badge-content');
- let hostInfoKeysList = ['used_memory', 'used_memory_rss', 'mem_fragmentation_ratio', 'hits_ratio', 'delta_hits_ratio', 'uptime_in_seconds', 'connected_clients'];
- let hideRedis = true
- for (let item of hostInfoKeysList) {
- if (currentStatistic[item]) {
- hideRedis = false
- break
- }
- }
- if (hideRedis) {
- document.getElementById('fs-redis-status-title').innerHTML = '';
- document.getElementById('fs-redis-status-title').style.marginTop = '0';
- document.getElementById('fs-redis-status').style.display = 'none';
- } else {
- hostInfoKeysList.forEach((item, index) => {
- switch (item) {
- case 'used_memory':
- hostInfoExtendSpan[index].innerHTML = Math.ceil(currentStatistic[item] / BIT_TO_MB) + ' M';
- break;
- case 'used_memory_rss':
- hostInfoExtendSpan[index].innerHTML = Math.ceil(currentStatistic[item] / BIT_TO_MB) + ' M';
- break;
- case 'mem_fragmentation_ratio':
- let ratio = currentStatistic[item];
- hostInfoExtendSpan[index].innerHTML = currentStatistic[item];
- if (ratio !== null && ratio !== undefined && ratio > 1) {
- let hostInfoExtendSpanClass = hostInfoExtendSpan[index].classList;
- hostInfoExtendSpanClass.remove('background-green');
- hostInfoExtendSpanClass.add('background-red');
- }
- break;
- case 'hits_ratio':
- hostInfoExtendSpan[index].innerHTML = currentStatistic[item] + '%';
- break;
- case 'delta_hits_ratio':
- hostInfoExtendSpan[index].innerHTML = currentStatistic[item] + '%';
- break;
- case 'uptime_in_seconds':
- hostInfoExtendSpan[index].innerHTML = MachineStatus.getFormatSeconds(currentStatistic[item], this.language.days, this.language.hours, this.language.minutes, this.language.seconds);
- break;
- case 'connected_clients':
- hostInfoExtendSpan[index].innerHTML = currentStatistic[item];
+ let currentStatistic = data.currentStatistic;
+ if (Object.keys(currentStatistic).length) {
+ let hostInfoSpan = document.getElementById('fs-host-status').getElementsByClassName('fs-badge-content');
+ hostInfoSpan[0].innerHTML = currentStatistic.memory + '%';
+ hostInfoSpan[1].innerHTML = currentStatistic.cpu + '%';
+ hostInfoSpan[2].innerHTML = currentStatistic.disk_usage + '%';
+ hostInfoSpan[3].innerHTML = currentStatistic.load_avg[0] + "，" + currentStatistic.load_avg[1] + "，" + currentStatistic.load_avg[2];
+
+ hostInfoSpan[4].innerHTML = MachineStatus.getFormatSeconds(currentStatistic.boot_seconds || 0, this.language.days, this.language.hours, this.language.minutes, this.language.seconds);
+
+ const machineIndex = ['memory', 'cpu', 'disk_usage', 'load_avg'];
+ machineIndex.forEach(function (item, index) {
+ let paramClass;
+ if (item === 'load_avg') {
+ let loadavgAvg = (currentStatistic.load_avg[0] + currentStatistic.load_avg[1] + currentStatistic.load_avg[2]) / 3;
+ paramClass = loadavgAvg >= LOADAVG_VALUE.WARNING ? loadavgAvg >= LOADAVG_VALUE.DANGER ? 'background-red' : 'background-orange' : 'background-green';
+ } else {
+ paramClass = currentStatistic[item] >= MACHINE_VALUE.WARNING ? currentStatistic.memory >= MACHINE_VALUE.DANGER ? 'background-red' : 'background-orange' : 'background-green';
}
+ let param = hostInfoSpan[index].classList;
+ param.remove('background-green', 'background-orange', 'background-red');
+ param.add(paramClass);
});
+
+ let hostInfoExtendSpan = document.getElementById('fs-redis-status').getElementsByClassName('fs-badge-content');
+ let hostInfoKeysList = ['used_memory', 'used_memory_rss', 'mem_fragmentation_ratio', 'hits_ratio', 'delta_hits_ratio', 'uptime_in_seconds', 'connected_clients'];
+ let hideRedis = true
+ for (let item of hostInfoKeysList) {
+ if (currentStatistic[item]) {
+ hideRedis = false
+ break
+ }
+ }
+ if (hideRedis) {
+ document.getElementById('fs-redis-status-title').innerHTML = '';
+ document.getElementById('fs-redis-status-title').style.marginTop = '0';
+ document.getElementById('fs-redis-status').style.display = 'none';
+ } else {
+ hostInfoKeysList.forEach((item, index) => {
+ switch (item) {
+ case 'used_memory':
+ hostInfoExtendSpan[index].innerHTML = Math.ceil(currentStatistic[item] / BIT_TO_MB) + ' M';
+ break;
+ case 'used_memory_rss':
+ hostInfoExtendSpan[index].innerHTML = Math.ceil(currentStatistic[item] / BIT_TO_MB) + ' M';
+ break;
+ case 'mem_fragmentation_ratio':
+ let ratio = currentStatistic[item];
+ hostInfoExtendSpan[index].innerHTML = currentStatistic[item];
+ if (ratio !== null && ratio !== undefined && ratio > 1) {
+ let hostInfoExtendSpanClass = hostInfoExtendSpan[index].classList;
+ hostInfoExtendSpanClass.remove('background-green');
+ hostInfoExtendSpanClass.add('background-red');
+ }
+ break;
+ case 'hits_ratio':
+ hostInfoExtendSpan[index].innerHTML = currentStatistic[item] + '%';
+ break;
+ case 'delta_hits_ratio':
+ hostInfoExtendSpan[index].innerHTML = currentStatistic[item] + '%';
+ break;
+ case 'uptime_in_seconds':
+ hostInfoExtendSpan[index].innerHTML = MachineStatus.getFormatSeconds(currentStatistic[item], this.language.days, this.language.hours, this.language.minutes, this.language.seconds);
+ break;
+ case 'connected_clients':
+ hostInfoExtendSpan[index].innerHTML = currentStatistic[item];
+ }
+ });
+ }
}
- }
- data.items.reverse();
- let dataMap = MachineStatus.getChartsData(data.items);
-
- let tsList = dataMap.ts_list;
- let cpuList = dataMap.cpu_list;
- let memoryList = dataMap.memory_list;
- let loadavgList = dataMap.load_avg_list[0];
- let loadavg5MinList = dataMap.load_avg_list[1];
- let loadavg15MinList = dataMap.load_avg_list[2];
- let diskUsageList = dataMap.disk_usage_list;
-
- this.memoryOption.xAxis.data = tsList;
- this.cpuOption.xAxis.data = tsList;
- this.loadavgOption.xAxis.data = tsList;
- this.diskUsageOption.xAxis.data = tsList;
-
- this.memoryOption.series[0].data = memoryList;
- this.cpuOption.series[0].data = cpuList;
- this.diskUsageOption.series[0].data = diskUsageList;
- this.loadavgOption.series[0].data = loadavgList;
- this.loadavgOption.series[1].data = loadavg5MinList;
- this.loadavgOption.series[2].data = loadavg15MinList;
-
- this.consoleMemoryChart.setOption(this.memoryOption);
- this.consoleCpuChart.setOption(this.cpuOption);
- this.consoleLoadavgChart.setOption(this.loadavgOption);
- this.consoleDiskusageChart.setOption(this.diskUsageOption);
- MachineStatus.resizeChart([this.consoleMemoryChart, this.consoleCpuChart, this.consoleLoadavgChart, this.consoleDiskusageChart]);
- },
- complete: () => {
- this.consoleMemoryChart.hideLoading();
- this.consoleCpuChart.hideLoading();
- this.consoleLoadavgChart.hideLoading();
- this.consoleDiskusageChart.hideLoading();
- },
- }).then();
+ data.items.reverse();
+ let dataMap = MachineStatus.getChartsData(data.items);
+
+ let tsList = dataMap.ts_list;
+ let cpuList = dataMap.cpu_list;
+ let memoryList = dataMap.memory_list;
+ let loadavgList = dataMap.load_avg_list[0];
+ let loadavg5MinList = dataMap.load_avg_list[1];
+ let loadavg15MinList = dataMap.load_avg_list[2];
+ let diskUsageList = dataMap.disk_usage_list;
+
+ this.memoryOption.xAxis.data = tsList;
+ this.cpuOption.xAxis.data = tsList;
+ this.loadavgOption.xAxis.data = tsList;
+ this.diskUsageOption.xAxis.data = tsList;
+
+ this.memoryOption.series[0].data = memoryList;
+ this.cpuOption.series[0].data = cpuList;
+ this.diskUsageOption.series[0].data = diskUsageList;
+ this.loadavgOption.series[0].data = loadavgList;
+ this.loadavgOption.series[1].data = loadavg5MinList;
+ this.loadavgOption.series[2].data = loadavg15MinList;
+
+ this.consoleMemoryChart.setOption(this.memoryOption);
+ this.consoleCpuChart.setOption(this.cpuOption);
+ this.consoleLoadavgChart.setOption(this.loadavgOption);
+ this.consoleDiskUsageChart.setOption(this.diskUsageOption);
+ MachineStatus.resizeChart([this.consoleMemoryChart, this.consoleCpuChart, this.consoleLoadavgChart, this.consoleDiskUsageChart]);
+ }).then(() => {
+ this.consoleMemoryChart.hideLoading();
+ this.consoleCpuChart.hideLoading();
+ this.consoleLoadavgChart.hideLoading();
+ this.consoleDiskUsageChart.hideLoading();
+ })
+ }
+ }).catch(function (err) {
+ console.log(err);
+ })
};
/* Check if the device is a mobile phone */
@@ -360,7 +369,8 @@
data: [lineName],
textStyle: {
fontSize: 14
- }
+ },
+ show: titleText === 'Load Avg',
},
grid: {
left: '3%',
@@ -372,8 +382,10 @@
toolbox: {
show: !isMobile,
feature: {
- saveAsImage: {}
- }
+ saveAsImage: {
+ title: ' ',
+ }
+ },
},
xAxis: {
type: 'category',
@@ -385,7 +397,10 @@
}
},
yAxis: {
- type: 'value'
+ type: 'value',
+ axisLabel: {
+ formatter: (value) => value + (titleText === 'Load Avg' ? '' : '%'),
+ },
},
series: [
{
@@ -470,64 +485,6 @@
};
}
- /* Native Ajax classes */
- class Ajax {
- constructor(xhr) {
- xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");
- this.xhr = xhr;
- }
-
- send(options) {
-
- let xhr = this.xhr;
-
- let opt = {
- type: options.type || 'get',
- url: options.url || '',
- async: options.async || true,
- data: JSON.stringify(options.data),
- dataType: options.dataType || 'json',
- contentType: 'application/json',
- success: options.success || null,
- complete: options.complete || null
- };
-
-
- return new Promise((resolve, reject) => {
- xhr.open(opt.type, opt.url, opt.async);
- xhr.onreadystatechange = () => {
- // readyState: 0: init, 1: connect has set up, 2: receive request, 3: request.. , 4: request end, send response
- if (xhr.readyState === 4) {
- // status: 200: OK, 401: Verification Failed, 404: Not Found Page
- if (opt.dataType === 'json') {
- const data = JSON.parse(xhr.responseText);
- resolve(data);
- if (opt.success !== null) {
- opt.success(data);
- } else {
- reject(new Error(String(xhr.status) || 'No callback function.'));
- }
- } else {
- reject(new Error(String(xhr.status) || 'Error data type.'));
- }
- }
- };
-
- xhr.onerror = () => {
- reject(new Error(String(xhr.status) || 'Server is fail.'));
- };
-
- xhr.setRequestHeader("Content-type", opt.contentType);
- xhr.send(opt.data);
- xhr.onloadend = () => {
- if (opt.complete != null) {
- opt.complete();
- }
- };
- });
- }
- }
-
/* singleton */
const FlaskStateInstance = (function () {
let instance = null;
diff --git a/packages/umd/flask-state.min.js b/packages/umd/flask-state.min.js
index 1cc6f82..a0318ee 100644
--- a/packages/umd/flask-state.min.js
+++ b/packages/umd/flask-state.min.js
@@ -10,4 +10,4 @@
'use strict';
-!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.flaskState=t():e.flaskState=t()}(window,(function(){return function(e){var t={};function s(a){if(t[a])return t[a].exports;var n=t[a]={i:a,l:!1,exports:{}};return e[a].call(n.exports,n,n.exports,s),n.l=!0,n.exports}return s.m=e,s.c=t,s.d=function(e,t,a){s.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:a})},s.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},s.t=function(e,t){if(1&t&&(e=s(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var a=Object.create(null);if(s.r(a),Object.defineProperty(a,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var n in e)s.d(a,n,function(t){return e[t]}.bind(null,n));return a},s.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return s.d(t,"a",t),t},s.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},s.p="",s(s.s=0)}([function(e,t,s){"use strict";const a=85,n=75,i=10,o=5,r=1048576;class d{constructor(e){this.language=e,this.mobile=d.isMobile(),this.index=0,this.ajax=new l,this.initFlaskStateContainer(this.mobile),this.setEventListener(),this.initFlaskStateLanguage(this.language),this.setInitParams(),this.mobile&&this.setTagChangeEventListener(this.consoleCpuChart,this.consoleMemoryChart,this.consoleLoadavgChart,this.consoleDiskusageChart),window.addEventListener("resize",(()=>{d.resizeChartTimer([this.consoleMemoryChart,this.consoleCpuChart,this.consoleLoadavgChart,this.consoleDiskusageChart])}))}setFlaskStateData(){document.getElementById("fs-background").style.display="block",document.getElementById("fs-info-container").style.display="block",document.getElementsByTagName("body")[0].style.overflowX="hidden",document.getElementsByTagName("body")[0].style.overflowY="hidden",document.getElementById("fs-select-days").value="1",this.setCharts("1")}initFlaskStateContainer(){let e='Host Status
Memory
CPU
Disk Usage
Load Avg
Uptime
Redis Status
Used Mem
Mem Fragmentation Ratio
Cache Hits Ratio
24h Hits Ratio
Uptime
Connections
'+(this.mobile?'
':"
")+"
";for(let a=0;a";return t}},legend:{data:[a],textStyle:{fontSize:14}},grid:{left:"3%",right:"4%",bottom:"3%",top:e?30:60,containLabel:!0},toolbox:{show:!e,feature:{saveAsImage:{}}},xAxis:{type:"category",boundaryGap:!1,axisLabel:{formatter:function(e){return echarts.format.formatTime("hh:mm",new Date(parseInt(e)),!1)}}},yAxis:{type:"value"},series:[{name:a,type:"line",symbol:"none",hoverAnimation:!1}]};return"loadavg"===s&&(n.legend.data=["1 "+a,"5 "+a,"15 "+a],n.series=[],n.legend.data.forEach((e=>{n.series.push({name:e,type:"line",symbol:"none",hoverAnimation:!1})}))),n}static getChartsData(e){let t=[],s=[],a=[],n=[],i=[],o=[],r=[];for(let d=0;d=60?(o=i/60,o>=60&&(r=o/60,o%=60),r>=24&&(d=r/24,r%=24)):l=i+n,o>0&&(l=Math.floor(o)+" "+a),r>0&&(l=Math.floor(r)+" "+s),d>0&&(l=Math.floor(d)+" "+t),l}}class l{constructor(e){e=window.XMLHttpRequest?new XMLHttpRequest:new ActiveXObject("Microsoft.XMLHTTP"),this.xhr=e}send(e){let t=this.xhr,s={type:e.type||"get",url:e.url||"",async:e.async||!0,data:JSON.stringify(e.data),dataType:e.dataType||"json",contentType:"application/json",success:e.success||null,complete:e.complete||null};return new Promise(((e,a)=>{t.open(s.type,s.url,s.async),t.onreadystatechange=()=>{if(4===t.readyState)if("json"===s.dataType){const n=JSON.parse(t.responseText);e(n),null!==s.success?s.success(n):a(new Error(String(t.status)||"No callback function."))}else a(new Error(String(t.status)||"Error data type."))},t.onerror=()=>{a(new Error(String(t.status)||"Server is fail."))},t.setRequestHeader("Content-type",s.contentType),t.send(s.data),t.onloadend=()=>{null!=s.complete&&s.complete()}}))}}const c=function(){let e=null;return function(t){return e||(e=new d(t))}}();t.init=function(e){let t=null,s={};if(null!==e&&"object"==typeof e&&(t=e.hasOwnProperty("dom")?e.dom:null,s=e.hasOwnProperty("lang")&&e.lang.hasOwnProperty("language")?e.lang:{}),t instanceof HTMLElement){if(t.getAttribute("flaskState"))return;t.setAttribute("flaskState","true"),t.addEventListener("click",(()=>c(s).setFlaskStateData()))}else{if(document.getElementById("fs-state-circular"))return;let e="";document.getElementsByTagName("body")[0].insertAdjacentHTML("beforeend",e);let t,n=document.getElementById("fs-state-circular");function a(e){n.style.top=e.clientY-t+300+"px"}n.onclick=function(){this.classList.add("fs-circular-out"),c(s).setFlaskStateData()},n.onmousedown=function(e){t=t||e.clientY,document.addEventListener("mousemove",a)},document.onmouseup=function(){document.removeEventListener("mousemove",a);const e=parseInt(n.style.top);n.classList.add("fs-circular-animation"),n.style.top=Math.min(Math.max(e,50),window.screen.height-200)+"px",setTimeout((()=>n.classList.remove("fs-circular-animation")),500)}}}}])}));
\ No newline at end of file
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.flaskState=t():e.flaskState=t()}(window,(function(){return function(e){var t={};function s(a){if(t[a])return t[a].exports;var n=t[a]={i:a,l:!1,exports:{}};return e[a].call(n.exports,n,n.exports,s),n.l=!0,n.exports}return s.m=e,s.c=t,s.d=function(e,t,a){s.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:a})},s.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},s.t=function(e,t){if(1&t&&(e=s(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var a=Object.create(null);if(s.r(a),Object.defineProperty(a,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var n in e)s.d(a,n,function(t){return e[t]}.bind(null,n));return a},s.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return s.d(t,"a",t),t},s.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},s.p="",s(s.s=0)}([function(e,t,s){"use strict";const a=85,n=75,i=10,o=5,d=1048576;class r{constructor(e){this.language=e,this.mobile=r.isMobile(),this.index=0,this.initFlaskStateContainer(this.mobile),this.setEventListener(),this.initFlaskStateLanguage(this.language),this.setInitParams(),this.mobile&&this.setTagChangeEventListener(this.consoleCpuChart,this.consoleMemoryChart,this.consoleLoadavgChart,this.consoleDiskUsageChart),window.addEventListener("resize",(()=>{r.resizeChartTimer([this.consoleMemoryChart,this.consoleCpuChart,this.consoleLoadavgChart,this.consoleDiskUsageChart])}))}setFlaskStateData(){document.getElementById("fs-background").style.display="block",document.getElementById("fs-info-container").style.display="block",document.getElementsByTagName("body")[0].style.overflowX="hidden",document.getElementsByTagName("body")[0].style.overflowY="hidden",document.getElementById("fs-select-days").value="1",this.setCharts("1")}initFlaskStateContainer(){let e='Host Status
Memory
CPU
Disk Usage
Load Avg
Uptime
Redis Status
Used Mem
Mem Fragmentation Ratio
Cache Hits Ratio
24h Hits Ratio
Uptime
Connections
'+(this.mobile?'
':"
")+"
";for(let a=0;a";return t}},legend:{data:[a],textStyle:{fontSize:14},show:"Load Avg"===t},grid:{left:"3%",right:"4%",bottom:"3%",top:e?30:60,containLabel:!0},toolbox:{show:!e,feature:{saveAsImage:{title:" "}}},xAxis:{type:"category",boundaryGap:!1,axisLabel:{formatter:function(e){return echarts.format.formatTime("hh:mm",new Date(parseInt(e)),!1)}}},yAxis:{type:"value",axisLabel:{formatter:e=>e+("Load Avg"===t?"":"%")}},series:[{name:a,type:"line",symbol:"none",hoverAnimation:!1}]};return"loadavg"===s&&(n.legend.data=["1 "+a,"5 "+a,"15 "+a],n.series=[],n.legend.data.forEach((e=>{n.series.push({name:e,type:"line",symbol:"none",hoverAnimation:!1})}))),n}static getChartsData(e){let t=[],s=[],a=[],n=[],i=[],o=[],d=[];for(let r=0;r=60?(o=i/60,o>=60&&(d=o/60,o%=60),d>=24&&(r=d/24,d%=24)):l=i+n,o>0&&(l=Math.floor(o)+" "+a),d>0&&(l=Math.floor(d)+" "+s),r>0&&(l=Math.floor(r)+" "+t),l}}const l=function(){let e=null;return function(t){return e||(e=new r(t))}}();t.init=function(e){let t=null,s={};if(null!==e&&"object"==typeof e&&(t=e.hasOwnProperty("dom")?e.dom:null,s=e.hasOwnProperty("lang")&&e.lang.hasOwnProperty("language")?e.lang:{}),t instanceof HTMLElement){if(t.getAttribute("flaskState"))return;t.setAttribute("flaskState","true"),t.addEventListener("click",(()=>l(s).setFlaskStateData()))}else{if(document.getElementById("fs-state-circular"))return;let e="";document.getElementsByTagName("body")[0].insertAdjacentHTML("beforeend",e);let t,n=document.getElementById("fs-state-circular");function a(e){n.style.top=e.clientY-t+300+"px"}n.onclick=function(){this.classList.add("fs-circular-out"),l(s).setFlaskStateData()},n.onmousedown=function(e){t=t||e.clientY,document.addEventListener("mousemove",a)},document.onmouseup=function(){document.removeEventListener("mousemove",a);const e=parseInt(n.style.top);n.classList.add("fs-circular-animation"),n.style.top=Math.min(Math.max(e,50),window.screen.height-200)+"px",setTimeout((()=>n.classList.remove("fs-circular-animation")),500)}}}}])}));
\ No newline at end of file