New logfile viewer in website (#2671)

* Version

* New logfile viewer

* [pre-commit.ci lite] apply automatic fixes

* FIx path for log api

* Update custom-dictionary-workspace.txt

* [pre-commit.ci lite] apply automatic fixes

---------

Co-authored-by: pre-commit-ci-lite[bot] <117423508+pre-commit-ci-lite[bot]@users.noreply.github.com>

Author: springfall2008

.cspell/custom-dictionary-workspace.txt

@@ -22,6 +22,7 @@ Batpred
 battemperature
 batteri
 batteryb
+beforeunload
 bierner
 calib
 cexxxx
@@ -280,6 +281,7 @@ useid
 userinterface
 varh
 venv
+visibilitychange
 Wallbox
 weblink
 welink

apps/predbat/predbat.py

@@ -36,7 +36,7 @@
 import requests
 import asyncio
 
-THIS_VERSION = "v8.25.0"
+THIS_VERSION = "v8.25.1"
 
 # fmt: off
 PREDBAT_FILES = ["predbat.py", "config.py", "prediction.py", "gecloud.py","utils.py", "inverter.py", "ha.py", "download.py", "unit_test.py", "web.py", "web_helper.py", "predheat.py", "futurerate.py", "octopus.py", "solcast.py","execute.py", "plan.py", "fetch.py", "output.py", "userinterface.py", "energydataservice.py", "alertfeed.py", "compare.py", "db_manager.py", "db_engine.py", "plugin_system.py", "ohme.py", "components.py", "fox.py"]

apps/predbat/web.py

@@ -19,7 +19,7 @@
 import shutil
 import html as html_module
 import time
-from web_helper import get_header_html, get_plan_css, get_editor_js, get_editor_css, get_log_css, get_charts_css, get_apps_css, get_html_config_css, get_apps_js, get_components_css
+from web_helper import get_header_html, get_plan_css, get_editor_js, get_editor_css, get_log_css, get_charts_css, get_apps_css, get_html_config_css, get_apps_js, get_components_css, get_logfile_js
 
 from utils import calc_percent_limit, str2time, dp0, dp2
 from config import TIME_FORMAT, TIME_FORMAT_DAILY
@@ -141,6 +141,7 @@ async def start(self):
         app.router.add_get("/api/ping", self.html_api_ping)
         app.router.add_post("/api/state", self.html_api_post_state)
         app.router.add_post("/api/service", self.html_api_post_service)
+        app.router.add_get("/api/log", self.html_api_get_log)
         app.router.add_post("/api/login", self.html_api_login)
 
         # Notify plugin system that web interface is ready
@@ -926,6 +927,73 @@ def render_chart(self, series_data, yaxis_name, chart_name, now_str, tagname="ch
         text += "</script>\n"
         return text
 
+    async def html_api_get_log(self, request):
+        """
+        JSON API to get log data with filtering
+        """
+        try:
+            logfile = "predbat.log"
+            logdata = ""
+
+            if os.path.exists(logfile):
+                with open(logfile, "r") as f:
+                    logdata = f.read()
+
+            # Get query parameters
+            args = request.query
+            filter_type = args.get("filter", "warnings")  # all, warnings, errors
+            since_line = int(args.get("since", 0))  # Line number to start from
+            max_lines = int(args.get("max_lines", 1024))  # Maximum lines to return
+
+            loglines = logdata.split("\n")
+            total_lines = len(loglines)
+
+            # Process log lines with filtering
+            result_lines = []
+            count_lines = 0
+            lineno = total_lines - 1
+
+            while count_lines < max_lines and lineno >= 0:
+                line = loglines[lineno]
+                line_lower = line.lower()
+
+                # Skip empty lines
+                if not line.strip():
+                    lineno -= 1
+                    continue
+
+                # Apply filtering
+                include_line = False
+                line_type = "info"
+
+                if "error" in line_lower:
+                    line_type = "error"
+                    include_line = True
+                elif "warn" in line_lower:
+                    line_type = "warning"
+                    include_line = filter_type in ["all", "warnings"]
+                else:
+                    line_type = "info"
+                    include_line = filter_type == "all"
+
+                if include_line and (since_line == 0 or lineno > since_line):
+                    start_line = line[0:27] if len(line) >= 27 else line
+                    rest_line = line[27:] if len(line) >= 27 else ""
+
+                    result_lines.append({"line_number": lineno, "timestamp": start_line, "message": rest_line, "type": line_type, "full_line": line})
+                    count_lines += 1
+
+                lineno -= 1
+
+            # Reverse to get reverse chronological order (newest first)
+            result_lines.reverse()
+
+            return web.json_response({"status": "success", "total_lines": total_lines, "returned_lines": len(result_lines), "lines": result_lines, "filter": filter_type})
+
+        except Exception as e:
+            self.log(f"Error in html_api_get_log: {e}")
+            return web.json_response({"status": "error", "message": str(e)}, status=500)
+
     async def html_api_post_state(self, request):
         """
         JSON API
@@ -1186,16 +1254,11 @@ def add_button_to_load(match):
 
     async def html_log(self, request):
         """
-        Return the Predbat log as an HTML page
+        Return the Predbat log as an HTML page with dynamic updates
         """
-        logfile = "predbat.log"
-        logdata = ""
         self.default_page = "./log"
-        if os.path.exists(logfile):
-            with open(logfile, "r") as f:
-                logdata = f.read()
 
-        # Decode method get arguments
+        # Decode method get arguments to determine filter type
         args = request.query
         errors = False
         warnings = False
@@ -1212,59 +1275,48 @@ async def html_log(self, request):
             self.default_log = "warnings"
             warnings = True
 
-        loglines = logdata.split("\n")
-        text = self.get_header("Predbat Log", refresh=10)
+        # Remove refresh from header since we'll update dynamically
+        text = self.get_header("Predbat Log", refresh=0)
         text += """<body>"""
         text += get_log_css()
 
         if errors:
             active_all = ""
             active_warnings = ""
             active_errors = "active"
+            filter_type = "errors"
         elif warnings:
             active_all = ""
             active_warnings = "active"
             active_errors = ""
+            filter_type = "warnings"
         else:
             active_all = "active"
             active_warnings = ""
             active_errors = ""
+            filter_type = "all"
 
         text += '<div class="log-menu">'
         text += "<h3>Logfile</h3> "
         text += f'<a href="./log?all" class="{active_all}">All</a>'
         text += f'<a href="./log?warnings" class="{active_warnings}">Warnings</a>'
         text += f'<a href="./log?errors" class="{active_errors}">Errors</a>'
         text += '<a href="./debug_log">Download</a>'
+        text += '<label class="auto-scroll-toggle"><input type="checkbox" id="autoScroll"> Auto-scroll to new</label>'
+        text += '<button class="scroll-to-bottom" onclick="scrollToBottom()">Scroll to Bottom</button>'
+        text += '<button id="pauseResumeBtn" onclick="toggleUpdates()" style="margin-left: 10px; padding: 4px 8px;">Pause</button>'
         text += "</div>"
 
-        text += "<table width=100%>\n"
-
-        total_lines = len(loglines)
-        count_lines = 0
-        lineno = total_lines - 1
-        while count_lines < 1024 and lineno >= 0:
-            line = loglines[lineno]
-            line_lower = line.lower()
-            lineno -= 1
-
-            start_line = line[0:27]
-            rest_line = line[27:]
-
-            if "error" in line_lower:
-                text += "<tr><td>{}</td><td nowrap><font color=#ff3333>{}</font> {}</td></tr>\n".format(lineno, start_line, rest_line)
-                count_lines += 1
-                continue
-            elif (not errors) and ("warn" in line_lower):
-                text += "<tr><td>{}</td><td nowrap><font color=#ffA500>{}</font> {}</td></tr>\n".format(lineno, start_line, rest_line)
-                count_lines += 1
-                continue
+        text += '<div id="logStatus" class="log-status">Loading log data...</div>'
+        text += "<table width=100% id='logTable'>\n"
+        text += "<tbody id='logTableBody'>\n"
+        text += "<!-- Log entries will be loaded dynamically via JavaScript -->\n"
+        text += "</tbody>\n"
+        text += "</table>"
 
-            if line and (not errors) and (not warnings):
-                text += "<tr><td>{}</td><td nowrap><font color=#33cc33>{}</font> {}</td></tr>\n".format(lineno, start_line, rest_line)
-                count_lines += 1
+        # Add JavaScript for dynamic updates
+        text += get_logfile_js(filter_type)
 
-        text += "</table>"
         text += "</body></html>\n"
         return web.Response(content_type="text/html", text=text)