Fix a race condition with debuglogs viewing.

This commit is contained in:
Greyson Parrelli
2025-08-11 10:48:37 -04:00
parent 9f7a78bf3c
commit 3995608fd8
4 changed files with 67 additions and 33 deletions

File diff suppressed because one or more lines are too long

View File

@@ -37,7 +37,7 @@
</head>
<body>
<div id="container"></div>
<script src="https://www.unpkg.com/ace-builds@latest/src-noconflict/ace.js"></script>
<script src="ace.min.js"></script>
<script src="debuglogs-viewer.js"></script>
</body>
</html>

View File

@@ -1,6 +1,40 @@
let editor;
let timeout;
let session;
let logLines = ""; // Original logLines
let input = ""; // Search query input
let selectedLevels = []; // Log levels that are selected in checkboxes
let markers = []; // IDs of highlighted search markers
let matchRanges = []; // Ranges of all search matches
let matchCount = 0; // Total number of matches
let isFiltered = false;
let isCaseSensitive = false;
// Create custom text mode to color different levels of debug log lines
const TextMode = ace.require("ace/mode/text").Mode;
const TextHighlightRules = ace.require("ace/mode/text_highlight_rules").TextHighlightRules;
const Range = ace.require("ace/range").Range;
function main() {
// Create Ace Editor using the custom mode
editor = ace.edit("container", {
mode: new CustomMode(),
theme: "ace/theme/textmate",
wrap: false, // Allow for horizontal scrolling
readOnly: true,
showGutter: false,
highlightActiveLine: false,
highlightSelectedWord: false, // Prevent Ace Editor from automatically highlighting all instances of a selected word (really laggy!)
showPrintMargin: false,
});
editor.session.on("changeScrollTop", showScrollBar);
editor.session.on("changeScrollLeft", showScrollBar);
// Generate highlight markers for all search matches
session = editor.getSession();
}
function CustomHighlightRules() {
this.$rules = {
@@ -14,53 +48,22 @@ function CustomHighlightRules() {
],
};
}
CustomHighlightRules.prototype = new TextHighlightRules();
function CustomMode() {
TextMode.call(this);
this.HighlightRules = CustomHighlightRules;
}
CustomMode.prototype = Object.create(TextMode.prototype);
CustomMode.prototype.constructor = CustomMode;
// Create Ace Editor using the custom mode
let editor = ace.edit("container", {
mode: new CustomMode(),
theme: "ace/theme/textmate",
wrap: false, // Allow for horizontal scrolling
readOnly: true,
showGutter: false,
highlightActiveLine: false,
highlightSelectedWord: false, // Prevent Ace Editor from automatically highlighting all instances of a selected word (really laggy!)
showPrintMargin: false,
});
// Show scrollbar that fades after a second since last scroll
let timeout;
function showScrollBar() {
editor.container.classList.add("show-scrollbar");
clearTimeout(timeout);
timeout = setTimeout(() => editor.container.classList.remove("show-scrollbar"), 1000);
}
editor.session.on("changeScrollTop", showScrollBar);
editor.session.on("changeScrollLeft", showScrollBar);
// Generate highlight markers for all search matches
const Range = ace.require("ace/range").Range;
const session = editor.getSession();
let logLines = ""; // Original logLines
let input = ""; // Search query input
let selectedLevels = []; // Log levels that are selected in checkboxes
let markers = []; // IDs of highlighted search markers
let matchRanges = []; // Ranges of all search matches
let matchCount = 0; // Total number of matches
let isFiltered = false;
let isCaseSensitive = false;
// Clear all search markers and match info
function clearMarkers() {
markers.forEach((id) => session.removeMarker(id));
@@ -180,7 +183,6 @@ function onFilterClose() {
}
}
function onFilterLevel(sLevels) {
selectedLevels = sLevels;
@@ -217,3 +219,5 @@ function applyFilter() {
editor.setValue(filtered, -1);
}
main();