From 2027967b7bab2398d8a9cc7344a579ab205473cb Mon Sep 17 00:00:00 2001 From: ehpersonal38 <103586016+ehpersonal38@users.noreply.github.com> Date: Sat, 16 Apr 2022 13:31:20 -0400 Subject: [PATCH] Update overview.php Now the left tally chart updates with JS too! Also cleaned up & optimized a few lines of code. --- scripts/overview.php | 64 ++++++++++++++++++++++++++------------------ 1 file changed, 38 insertions(+), 26 deletions(-) diff --git a/scripts/overview.php b/scripts/overview.php index 2af64f8..b844c0e 100644 --- a/scripts/overview.php +++ b/scripts/overview.php @@ -111,20 +111,9 @@ if(isset($_GET['ajax_detections']) && $_GET['ajax_detections'] == "true" && isse } die(); } + +if(isset($_GET['ajax_left_chart']) && $_GET['ajax_left_chart'] == "true") { ?> - - - - Overview - - -
-
-
@@ -153,6 +142,24 @@ body::-webkit-scrollbar {
Total
+ + + + + Overview + + +
+
+
+
@@ -170,12 +177,6 @@ if (file_exists('./Charts/'.$chart)) { echo "

No Detections For Today

"; } ?> -
@@ -186,12 +187,6 @@ $refresh = $config['RECORDING_LENGTH']; $time = time(); echo ""; ?> -
@@ -204,11 +199,22 @@ function loadDetectionIfNewExists(previous_detection_identifier=undefined) { // if there's a new detection that needs to be updated to the page if(this.responseText.length > 0) { document.getElementById("most_recent_detection").innerHTML = this.responseText; + + // only going to load left chart if there's a new detection + loadLeftChart(); } } xhttp.open("GET", "overview.php?ajax_detections=true&previous_detection_identifier="+previous_detection_identifier, true); xhttp.send(); } +function loadLeftChart() { + const xhttp = new XMLHttpRequest(); + xhttp.onload = function() { + document.getElementsByClassName("left-column")[0].innerHTML = this.responseText; + } + xhttp.open("GET", "overview.php?ajax_left_chart=true", true); + xhttp.send(); +} window.setInterval(function(){ var videoelement = document.getElementsByTagName("video")[0]; if(typeof videoelement !== "undefined") { @@ -220,9 +226,15 @@ window.setInterval(function(){ // image or audio didn't load for some reason, force a refresh in 5 seconds loadDetectionIfNewExists(); } -}, 5*1000); +}, *1000); window.addEventListener("load", function(){ loadDetectionIfNewExists(); + loadLeftChart(); }); +// every $refresh seconds, this loop will run and refresh the spectrogram image +window.setInterval(function(){ + document.getElementById("chart").src = "/Charts/?nocache="+Date.now(); + document.getElementById("spectrogramimage").src = "/spectrogram.png?nocache="+Date.now(); +}, *1000);