2023-10-25 14:19:25 +08:00
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html>
|
|
|
|
|
|
|
|
|
|
<head>
|
|
|
|
|
<title>Reinstall Logs</title>
|
|
|
|
|
<style>
|
|
|
|
|
body {
|
|
|
|
|
margin: 0;
|
|
|
|
|
padding: 0;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#log-container {
|
2024-10-18 23:34:54 +08:00
|
|
|
height: calc(100vh);
|
|
|
|
|
margin: 0;
|
|
|
|
|
padding: 8px;
|
2023-10-25 14:19:25 +08:00
|
|
|
overflow-y: scroll;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#scroll-to-bottom {
|
|
|
|
|
position: fixed;
|
|
|
|
|
bottom: 24px;
|
|
|
|
|
right: 24px;
|
2024-10-18 23:34:54 +08:00
|
|
|
background-color: #0099FF;
|
2023-10-25 14:19:25 +08:00
|
|
|
color: #fff;
|
|
|
|
|
border: none;
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
display: none;
|
|
|
|
|
width: 48px;
|
|
|
|
|
height: 48px;
|
|
|
|
|
border-radius: 50%;
|
|
|
|
|
}
|
|
|
|
|
|
2024-10-18 23:34:54 +08:00
|
|
|
#scroll-to-bottom:hover {
|
|
|
|
|
background-color: #00CCFF;
|
|
|
|
|
}
|
|
|
|
|
|
2023-10-25 14:19:25 +08:00
|
|
|
#scroll-to-bottom svg {
|
|
|
|
|
fill: #fff;
|
|
|
|
|
}
|
2024-10-18 23:34:54 +08:00
|
|
|
|
|
|
|
|
.done {
|
|
|
|
|
background-color: #cfc;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.error {
|
|
|
|
|
background-color: #fcc;
|
|
|
|
|
}
|
2023-10-25 14:19:25 +08:00
|
|
|
</style>
|
|
|
|
|
</head>
|
|
|
|
|
|
|
|
|
|
<body>
|
2023-11-06 19:08:23 +08:00
|
|
|
<pre id="log-container"></pre>
|
2023-10-25 14:19:25 +08:00
|
|
|
<button id="scroll-to-bottom">
|
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
|
|
|
|
|
<path d="M5 10l7 7 7-7H5z" />
|
|
|
|
|
</svg>
|
|
|
|
|
</button>
|
|
|
|
|
|
2024-10-18 23:34:54 +08:00
|
|
|
<script
|
|
|
|
|
src="https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-d/reconnecting-websocket/1.0.0/reconnecting-websocket.min.js"
|
|
|
|
|
type="application/javascript"></script>
|
|
|
|
|
|
2023-10-25 14:19:25 +08:00
|
|
|
<script>
|
|
|
|
|
const logContainer = document.getElementById('log-container');
|
|
|
|
|
const scrollToBottomButton = document.getElementById('scroll-to-bottom');
|
|
|
|
|
let shouldScrollToBottom = true;
|
|
|
|
|
|
|
|
|
|
scrollToBottomButton.addEventListener('click', () => {
|
|
|
|
|
logContainer.scrollTop = logContainer.scrollHeight;
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
logContainer.addEventListener('scroll', () => {
|
|
|
|
|
const isAtBottom = Math.ceil(logContainer.scrollTop + logContainer.clientHeight) >= logContainer.scrollHeight;
|
|
|
|
|
if (isAtBottom) {
|
|
|
|
|
scrollToBottomButton.style.display = 'none';
|
|
|
|
|
} else {
|
|
|
|
|
scrollToBottomButton.style.display = 'block';
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
shouldScrollToBottom = isAtBottom;
|
|
|
|
|
});
|
|
|
|
|
|
2024-10-18 23:34:54 +08:00
|
|
|
var ws = new ReconnectingWebSocket('ws://' + location.host + '/');
|
|
|
|
|
ws.onopen = function () {
|
|
|
|
|
logContainer.textContent += '\nWebSocket Connected.';
|
|
|
|
|
};
|
|
|
|
|
ws.onclose = function () {
|
|
|
|
|
logContainer.textContent += '\nWebSocket Disconnected.';
|
|
|
|
|
};
|
|
|
|
|
ws.onmessage = function (event) {
|
|
|
|
|
logContainer.textContent += '\n' + event.data;
|
|
|
|
|
if (shouldScrollToBottom) {
|
|
|
|
|
logContainer.scrollTop = logContainer.scrollHeight;
|
|
|
|
|
}
|
|
|
|
|
// 开始/重新开始
|
|
|
|
|
if (event.data.includes('***** START TRANS *****')) {
|
|
|
|
|
document.body.className = ''
|
|
|
|
|
}
|
|
|
|
|
// 错误
|
|
|
|
|
else if (event.data.includes('***** ERROR *****')) {
|
|
|
|
|
document.body.className = 'error'
|
|
|
|
|
}
|
|
|
|
|
// 完成
|
|
|
|
|
else if (event.data.includes('***** DONE *****')) {
|
|
|
|
|
document.body.className = 'done'
|
|
|
|
|
}
|
|
|
|
|
};
|
2023-10-25 14:19:25 +08:00
|
|
|
</script>
|
|
|
|
|
</body>
|
|
|
|
|
|
2024-10-18 23:34:54 +08:00
|
|
|
</html>
|
