1 files changed, 114 insertions, 0 deletions
diff --git a/views/resources/statsviewcontroller.js b/views/resources/statsviewcontroller.js
new file mode 100644
index 000000000..090e112e7
--- /dev/null
+++ b/views/resources/statsviewcontroller.js
@@ -0,0 +1,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>`;
+}
+\ No newline at end of file