blob: 090e112e7a8b64454def234a3f4d380646cb6136 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
|
/**
* statsviewcontroller.js stores the JavaScript functions to update the stats page
* when the websocket updates.
*/
const BUSY_SERVER_BOUND = 2;
const VERY_BUSY_SERVER_BOUND = 3;
const MEDIUM_USE_BOUND = 100; //operations per 10 seconds
const HIGH_USE_BOUND = 300;
const serverTrafficMessages = {
0 : "Not Busy",
1 : "Busy",
2: "Very Busy"
};
/**
* userDataComparator sorts the users based on the rate
*
* @param {*} user1 the first user to compare
* @param {*} user2 the second user to comapre
* @returns an integer indiciating which user should come first
*/
function userDataComparator(user1, user2) {
if(user1.rate < user2.rate) {
return 1;
} else if(user1.rate > user2.rate) {
return -1;
} else {
return 0;
}
}
/**
* calculateServerTraffic() returns an integer corresponding
* to the current traffic that can be used to get the message
* from "serverTrafficMessages"
*
* @param {*} data the incoming data from the backend
* @returns an integer where 0 is not busy, 1 is busy, and 2 is very busy.
*/
function calculateServerTraffic(data) {
let currentTraffic = data.connectedUsers.length;
let serverTraffic = 0;
if(currentTraffic < BUSY_SERVER_BOUND) {
serverTraffic = 0;
} else if(currentTraffic >= BUSY_SERVER_BOUND && currentTraffic < VERY_BUSY_SERVER_BOUND) {
serverTraffic = 1;
} else {
serverTraffic = 2;
}
return serverTraffic;
}
/**
* getUserRateColor determines what color the user's rate should
* be on the front end
* @param {*} rate the operations per time interval for a specific user
* @returns a string representing the color to make the user rate
*/
function getUserRateColor(rate) {
if(rate < MEDIUM_USE_BOUND) {
return "black";
} else if(rate >= MEDIUM_USE_BOUND && rate < HIGH_USE_BOUND) {
return "orange";
} else if(rate >= HIGH_USE_BOUND){
return "red";
} else {
return "black";
}
}
/**
* handleStatsUpdats() is called when new data is received from the backend
* from a websocket event. The method updates the HTML site to reflect the
* updated data
*
* @param {*} data the data coming from the backend.
*/
function handleStatsUpdate(data) {
let userListInnerHTML = "";
data.connectedUsers.sort(userDataComparator);
data.connectedUsers.map((userData, index) => {
let userRateColor = getUserRateColor(userData.rate);
let userEntry = `<p>${userData.time}</p>
<p>${userData.username}</p>
<p>Operations: ${userData.operations}</p>
<p style="color:${userRateColor}">Rate: ${userData.rate} operations per last 10 seconds</p>
`; // user data comes as last 10 seconds but it can be adjusted in DastStats.ts and websocket.ts
userListInnerHTML += "<li class=\"none\">" + userEntry + "</li>";
})
document.getElementById("connection-count").innerHTML = `Current Connections: ${data.connectedUsers.length}`
document.getElementById("connected-user-list").innerHTML = userListInnerHTML;
let serverTraffic = calculateServerTraffic(data);
let serverTrafficMessage = "Not Busy";
switch(serverTraffic) {
case 0:
serverTrafficMessage = "Not Busy";
break;
case 1:
serverTrafficMessage = "Busy";
break;
case 2:
serverTrafficMessage = "Very Busy";
break;
}
document.getElementById("stats-traffic-message").className="stats-server-status-item stats-server-status-" + serverTraffic;
document.getElementById("stats-traffic-message").innerHTML = `<p>${serverTrafficMessage}</p>`;
}
|
