blob: eceb9cf4eec437fd226258fdea9f9a29bcb0001e (
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
115
116
|
/**
* 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;
}
if (user1.rate > user2.rate) {
return -1;
}
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) {
const 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';
}
if (rate >= MEDIUM_USE_BOUND && rate < HIGH_USE_BOUND) {
return 'orange';
}
if (rate >= HIGH_USE_BOUND) {
return 'red';
}
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.forEach(userData => {
const userRateColor = getUserRateColor(userData.rate);
const 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;
const 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;
default:
}
document.getElementById('stats-traffic-message').className = 'stats-server-status-item stats-server-status-' + serverTraffic;
document.getElementById('stats-traffic-message').innerHTML = `<p>${serverTrafficMessage}</p>`;
}
|
