|
@@ -1,6 +1,5 @@
|
|
|
let logSource = null;
|
|
let logSource = null;
|
|
|
let currentUnit = null;
|
|
let currentUnit = null;
|
|
|
-let autoScroll = true;
|
|
|
|
|
|
|
|
|
|
const MAX_LOG_LINES = 2000;
|
|
const MAX_LOG_LINES = 2000;
|
|
|
let logLines = [];
|
|
let logLines = [];
|
|
@@ -62,15 +61,6 @@ function connectLog(unit, target) {
|
|
|
|
|
|
|
|
logSource = source;
|
|
logSource = source;
|
|
|
|
|
|
|
|
- el.addEventListener("scroll", () => {
|
|
|
|
|
- const distance = el.scrollHeight - el.scrollTop - el.clientHeight;
|
|
|
|
|
- if (distance < 20) {
|
|
|
|
|
- autoScroll = true;
|
|
|
|
|
- } else {
|
|
|
|
|
- autoScroll = false;
|
|
|
|
|
- }
|
|
|
|
|
- });
|
|
|
|
|
-
|
|
|
|
|
source.onmessage = (e) => {
|
|
source.onmessage = (e) => {
|
|
|
if (source !== logSource) {
|
|
if (source !== logSource) {
|
|
|
return;
|
|
return;
|
|
@@ -85,16 +75,18 @@ function connectLog(unit, target) {
|
|
|
const line = document.createElement("div");
|
|
const line = document.createElement("div");
|
|
|
line.innerHTML = colorLog(e.data);
|
|
line.innerHTML = colorLog(e.data);
|
|
|
|
|
|
|
|
|
|
+ const atBottom = el.scrollHeight - el.scrollTop - el.clientHeight < 2;
|
|
|
|
|
+
|
|
|
el.appendChild(line);
|
|
el.appendChild(line);
|
|
|
|
|
|
|
|
while (el.childElementCount > MAX_LOG_LINES) {
|
|
while (el.childElementCount > MAX_LOG_LINES) {
|
|
|
el.removeChild(el.firstElementChild);
|
|
el.removeChild(el.firstElementChild);
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
- if (autoScroll) {
|
|
|
|
|
- requestAnimationFrame(() => {
|
|
|
|
|
|
|
+ if (atBottom) {
|
|
|
|
|
+ requestAnimationFrame(() => {
|
|
|
el.scrollTop = el.scrollHeight;
|
|
el.scrollTop = el.scrollHeight;
|
|
|
- });
|
|
|
|
|
|
|
+ });
|
|
|
}
|
|
}
|
|
|
};
|
|
};
|
|
|
|
|
|