apps/go2rtc
1
0
Fork 0
mirror of https://github.com/AlexxIT/go2rtc.git synced 2025-10-06 00:37:00 +08:00
Code Issues Packages Projects Releases Wiki Activity

Refactor log handling and add UI auto-update toggle

Browse Source 
This commit refactors the log handling in the API to use a switch statement for improved readability and maintainability. It also introduces error messages with more context when reading or truncating the log file fails.

On the frontend, a new auto-update toggle button has been added to the log viewer, allowing users to enable or disable automatic log updates. The button's appearance changes based on its state, providing a clear visual indication of whether auto-update is active. Additionally, the button styling has been updated to ensure consistency across the interface.
This commit is contained in:
Sergey Krashevich
2023-11-28 22:55:50 +03:00
parent 8d382afa0f
commit ab47d5718f
2 changed files with 56 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
internal/api/api.go
View File

@@ -268,25 +268,27 @@ func restartHandler(w http.ResponseWriter, r *http.Request) {
// //
// No return values are provided since the function writes directly to the response writer. // No return values are provided since the function writes directly to the response writer.
func logHandler(w http.ResponseWriter, r *http.Request) { func logHandler(w http.ResponseWriter, r *http.Request) {
switch r.Method {
case "GET":
logFilePath := app.GetLogFilepath()
if r.Method == "GET" { // Send current state of the log file immediately
data, err := os.ReadFile(app.GetLogFilepath()) data, err := os.ReadFile(logFilePath)
if err != nil { if err != nil {
http.Error(w, "", http.StatusNotFound) http.Error(w, "Error reading log file", http.StatusInternalServerError)
return return
} }
Response(w, data, "text/plain") Response(w, data, "text/plain")
} else if r.Method == "DELETE" { case "DELETE":
err := os.Truncate(app.GetLogFilepath(), 0) err := os.Truncate(app.GetLogFilepath(), 0)
if err != nil { if err != nil {
http.Error(w, "", http.StatusServiceUnavailable) http.Error(w, "Error truncating log file", http.StatusServiceUnavailable)
return return
} }
} else { Response(w, "Log file deleted", "text/plain")
http.Error(w, "", http.StatusBadRequest) default:
return http.Error(w, "Method not allowed", http.StatusBadRequest)
} }
} }
type Source struct { type Source struct {

47
www/log.html
View File

@@ -31,12 +31,41 @@
.info { color: #0174DF; } .info { color: #0174DF; }
.debug { color: #585858; } .debug { color: #585858; }
.error { color: #DF0101; } .error { color: #DF0101; }
/* Button styling */
#clean, .switch {
background-color: #b89d94;
border: none;
color: #695753;
padding: 10px 20px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
outline: none;
transition: background-color 0.3s;
}
/* Switch styling to make it look like a button */
.switch {
width: auto;
padding: 10px 20px;
background-color: #f4433644; /* Red */
}
.switch.active {
background-color: #4caf4f4e; /* Green */
}
</style> </style>
</head> </head>
<body> <body>
<script src="main.js"></script> <script src="main.js"></script>
<div> <div>
<button id="clean">Clean</button> <button id="clean">Clean</button>
<!-- Switch for auto-update -->
<button class="switch active" id="autoUpdate">Auto Update: ON</button>
</div> </div>
<br> <br>
<div class="log-viewer" id="log"></div> <div class="log-viewer" id="log"></div>
@@ -44,7 +73,7 @@
const logbody = document.getElementById('log'); const logbody = document.getElementById('log');
document.getElementById('clean').addEventListener('click', async () => { document.getElementById('clean').addEventListener('click', async () => {
r = await fetch('api/log', {method: 'DELETE'}); let r = await fetch('api/log', {method: 'DELETE'});
if (r.ok) { if (r.ok) {
reload(); reload();
alert('OK'); alert('OK');
@@ -78,6 +107,16 @@
return styledLines.join(''); return styledLines.join('');
} }
// Handle auto-update switch
const autoUpdateButton = document.getElementById('autoUpdate');
let autoUpdateEnabled = true;
autoUpdateButton.addEventListener('click', () => {
autoUpdateEnabled = !autoUpdateEnabled;
autoUpdateButton.classList.toggle('active');
autoUpdateButton.textContent = `Auto Update: ${autoUpdateEnabled ? 'ON' : 'OFF'}`;
});
function reload() { function reload() {
const url = new URL('api/log', location.href); const url = new URL('api/log', location.href);
fetch(url, {cache: 'no-cache'}) fetch(url, {cache: 'no-cache'})
@@ -92,7 +131,11 @@
} }
// Reload the logs every 5 seconds // Reload the logs every 5 seconds
setInterval(reload, 5000); setInterval(() => {
if (autoUpdateEnabled) {
reload();
}
}, 5000);
reload(); reload();
</script> </script>