Files
lst/controller/index.html

284 lines
10 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<title>Go Socket.IO Logs Test</title>
<!-- Socket.IO v2 client -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.3.0/socket.io.js"></script>
<style>
body {
font-family: monospace;
background: #111;
color: #eee;
}
#controls {
margin-bottom: 10px;
}
#logWindow {
border: 1px solid #444;
background: #000;
padding: 10px;
width: 100%;
height: 400px;
overflow-y: auto;
white-space: pre-wrap;
font-size: 14px;
}
.info {
color: #0f0;
}
.log {
color: #0af;
}
.error {
color: #f33;
}
</style>
</head>
<body>
<h2>Go Socket.IO Log Viewer</h2>
<div id="controls">
<button id="btnLogs">Subscribe Logs</button>
<button id="btnLeaveLogs">Leave Logs</button>
<button id="btnErrors">Subscribe Errors</button>
<button id="btnLeaveErrors">Leave Errors</button>
<button id="btnSubscribeBuild">Subscribe Build</button>
<button id="btnUnsubscribeBuild">Leave Build</button>
<button id="btnBuildApp">Build</button>
<!-- update buttons: copy -->
<button id="btnSubscribeUpdate">Subscribe Update</button>
<button id="btnUnsubscribeUpdate">Leave Update</button>
<!-- <div>
<form onsubmit="return false;">
<input
type="text"
id="myInput"
placeholder="Type something here"
/>
<button type="button" id="btnCopyLatest">Send</button>
</form>
</div> -->
<div>
<form onsubmit="return false;">
<input
type="text"
id="updateServerInput"
placeholder="Type something here"
/>
<button type="button" id="updateServerButton">
Update Server
</button>
</form>
</div>
>
</div>
<div id="logWindow"></div>
<div>
<button id="USMCD1VMS036">USMCD1VMS036</button>
<button id="USBET1VMS006">USBET1VMS006</button>
<button id="USBOW1VMS006">USBOW1VMS006</button>
<button id="USKSC1VMS006">USKSC1VMS006</button>
<button id="USSLC1VMS006">USSLC1VMS006</button>
<button id="USSTP1VMS006">USSTP1VMS006</button>
<button id="USDAY1VMS006">USDAY1VMS006</button>
</div>
<script>
// ✅ Define socket in global scope
// const socket = io("https://usmcd1vms036.alpla.net", {
// path: "/lst/socket.io/",
// transports: ["polling"],
// });
const socket = io("http://localhost:8080", {
path: "/socket.io/",
transports: ["polling"],
});
// log window reference
const logWindow = document.getElementById("logWindow");
function logMessage(type, msg) {
const entry = document.createElement("div");
entry.textContent = `${new Date().toLocaleTimeString()} | ${msg}`;
entry.className = type;
logWindow.appendChild(entry);
logWindow.scrollTop = logWindow.scrollHeight; // auto-scroll
}
// connection events
// wire up buttons *after* socket is defined
document.getElementById("btnLogs").onclick = () => {
socket.emit("subscribe:logs");
logMessage("info", "Subscribed to logs");
};
document.getElementById("btnErrors").onclick = () => {
socket.emit("subscribe:errors");
logMessage("info", "Subscribed to errors");
};
document.getElementById("btnLeaveLogs").onclick = () => {
socket.emit("unsubscribe:logs");
logMessage("info", "👋 Left logs channel");
};
document.getElementById("btnLeaveErrors").onclick = () => {
socket.emit("unsubscribe:errors");
logMessage("info", "👋 Left errors channel");
};
document.getElementById("btnSubscribeBuild").onclick = () => {
socket.emit("subscribe:build");
logMessage("info", "📺 Subscribed to build");
};
document.getElementById("btnUnsubscribeBuild").onclick = () => {
socket.emit("unsubscribe:build");
logMessage("info", "👋 Left build room");
};
document.getElementById("btnBuildApp").onclick = () => {
socket.emit("build", "LST App"); // "frontend" = payload target
logMessage("info", "🚀 Build triggered");
};
// update stuff
document.getElementById("btnSubscribeUpdate").onclick = () => {
socket.emit("subscribe:update");
logMessage("info", "📺 Subscribed to update");
};
document.getElementById("btnUnsubscribeUpdate").onclick = () => {
socket.emit("unsubscribe:update");
logMessage("info", "👋 Left update room");
};
// document.getElementById("btnCopyLatest").onclick = () => {
// socket.emit("update", "usmcd1vms036"); // "frontend" = payload target
// logMessage("info", "Copying to USCMD1VMS036");
// };
window.onload = () => {
const input = document.getElementById("myInput");
const button = document.getElementById("btnCopyLatest");
const updateServerInput =
document.getElementById("updateServerInput");
const updateServerButton =
document.getElementById("updateServerButton");
// button.onclick = () => {
// const fromMyInput = input.value;
// if (!fromMyInput) return;
// // Emit to backend (adjust event name as required)
// socket.emit("update", {
// action: "copy",
// target: fromMyInput,
// });
// // You can define your own logMessage function
// logMessage("info", `Copying to ${fromMyInput}`);
// input.value = "";
// input.focus();
// };
updateServerButton.onclick = () => {
const fromMyInput = updateServerInput.value;
if (!fromMyInput) return;
// Emit to backend (adjust event name as required)
socket.emit("update", {
action: "update",
target: fromMyInput,
});
// You can define your own logMessage function
logMessage("info", `Updating to ${fromMyInput}`);
//input.value = "";
//input.focus();
};
};
// all the server copy buttons
document.getElementById("USMCD1VMS036").onclick = () => {
socket.emit("update", {
action: "copy",
target: "USMCD1VMS036",
drive: "e",
}); // "frontend" = payload target
logMessage("info", "Copying to USMCD1VMS036");
};
document.getElementById("USBET1VMS006").onclick = () => {
socket.emit("update", {
action: "copy",
target: "USBET1VMS006",
drive: "e",
}); // "frontend" = payload target
logMessage("info", "Copying to USBET1VMS006");
};
document.getElementById("USBOW1VMS006").onclick = () => {
socket.emit("update", {
action: "copy",
target: "USBOW1VMS006",
drive: "e",
}); // "frontend" = payload target
logMessage("info", "Copying to USBOW1VMS006");
};
document.getElementById("USSLC1VMS006").onclick = () => {
socket.emit("update", {
action: "copy",
target: "USSLC1VMS006",
drive: "e",
}); // "frontend" = payload target
logMessage("info", "Copying to USSLC1VMS006");
};
document.getElementById("USSTP1VMS006").onclick = () => {
socket.emit("update", {
action: "copy",
target: "USSTP1VMS006",
drive: "d",
}); // "frontend" = payload target
logMessage("info", "Copying to USSTP1VMS006");
};
document.getElementById("USKSC1VMS006").onclick = () => {
socket.emit("update", {
action: "copy",
target: "USksc1VMS006",
drive: "e",
}); // "frontend" = payload target
logMessage("info", "Copying to USKSC1VMS006");
};
document.getElementById("USDAY1VMS006").onclick = () => {
socket.emit("update", {
action: "copy",
target: "USDAY1VMS006",
drive: "e",
}); // "frontend" = payload target
logMessage("info", "Copying to USDAY1VMS006");
};
socket.on("logs", (msg) => logMessage("logs", msg));
socket.on("errors", (msg) => logMessage("errors", msg));
socket.on("buildlogs", (msg) => logMessage("build", msg));
socket.on("updateLogs", (msg) => logMessage("update", msg));
socket.on("connect", () => {
logMessage("info", "✅ Connected to server");
});
socket.on("disconnect", () => {
logMessage("info", "❌ Disconnected");
});
</script>
</body>
</html>