407 lines
14 KiB
HTML
407 lines
14 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;
|
|
}
|
|
#server-buttons {
|
|
display: grid;
|
|
grid-template-columns: repeat(4, 1fr); /* 4 equal columns */
|
|
gap: 0.75rem; /* roughly Tailwind gap-3 */
|
|
margin: 1rem 0;
|
|
}
|
|
|
|
#server-buttons button {
|
|
padding: 0.5rem 1rem;
|
|
font-family: monospace;
|
|
border: 1px solid #444;
|
|
background: #222;
|
|
color: #eee;
|
|
cursor: pointer;
|
|
border-radius: 4px;
|
|
transition: all 0.2s ease;
|
|
}
|
|
|
|
#server-buttons button:hover {
|
|
background: #333;
|
|
border-color: #888;
|
|
}
|
|
</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 id="controls">
|
|
<div id="server-buttons"></div>
|
|
<button id="btnAll">Copy to ALL</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"],
|
|
});
|
|
|
|
const servers = [
|
|
{
|
|
name: "Test server",
|
|
server: "USMCD1VMS036",
|
|
location: "E$\\LST",
|
|
},
|
|
{
|
|
name: "Bethlehem",
|
|
server: "USBET1VMS006",
|
|
location: "E$\\LST",
|
|
},
|
|
{
|
|
name: "Bowling Green 1",
|
|
server: "USBOW1VMS006",
|
|
location: "E$\\LST",
|
|
},
|
|
{
|
|
name: "Bowling Green 2",
|
|
server: "USBOW2VMS006",
|
|
location: "E$\\LST",
|
|
},
|
|
{
|
|
name: "Flornece",
|
|
server: "USFLO1VMS006",
|
|
location: "E$\\LST",
|
|
},
|
|
{
|
|
name: "Kasnas City",
|
|
server: "USKSC1VMS006",
|
|
location: "E$\\LST",
|
|
},
|
|
{
|
|
name: "Marked Tree",
|
|
server: "USMAR1VMS006",
|
|
location: "E$\\LST",
|
|
},
|
|
{
|
|
name: "McDonough",
|
|
server: "USMCD1VMS006",
|
|
location: "E$\\LST",
|
|
},
|
|
{
|
|
name: "Salt Lake City",
|
|
server: "USSLC1VMS006",
|
|
location: "E$\\LST",
|
|
},
|
|
{
|
|
name: "St.Peters",
|
|
server: "USSTP1VMS006",
|
|
location: "D$\\LST",
|
|
},
|
|
{ name: "Dayton", server: "USDAY1VMS006", location: "E$\\LST" },
|
|
{ name: "Lima", server: "USLIM1VMS006", location: "E$\\LST" },
|
|
{
|
|
name: "Iowa - EBM",
|
|
server: "USIOW1VMS006",
|
|
location: "D$\\LST\\LST",
|
|
},
|
|
{
|
|
name: "Iowa - ISBM",
|
|
server: "USIOW1VMS006",
|
|
location: "D$\\LST\\LST_2",
|
|
},
|
|
{
|
|
name: "Houston",
|
|
server: "USHOU1VMS006",
|
|
location: "E$\\LST",
|
|
},
|
|
{
|
|
name: "Sherman",
|
|
server: "USSHE1VMS006",
|
|
location: "E$\\LST",
|
|
},
|
|
{
|
|
name: "West Bend",
|
|
server: "USWEB1VMS006",
|
|
location: "E$\\LST",
|
|
},
|
|
{
|
|
name: "Jerfferson City",
|
|
server: "USJCI1VMS006",
|
|
location: "E$\\LST",
|
|
},
|
|
];
|
|
|
|
// 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();
|
|
};
|
|
};
|
|
|
|
const serverButtonsDiv = document.getElementById("server-buttons");
|
|
servers.forEach((srv) => {
|
|
const btn = document.createElement("button");
|
|
btn.textContent = srv.name;
|
|
btn.dataset.server = srv.server;
|
|
btn.dataset.drive = srv.drive;
|
|
|
|
btn.addEventListener("click", () => {
|
|
socket.emit("update", {
|
|
action: "copy",
|
|
target: srv.server,
|
|
location: srv.location,
|
|
});
|
|
logMessage(
|
|
"info",
|
|
`Copying to ${srv.name} (location ${srv.location})`
|
|
);
|
|
});
|
|
|
|
serverButtonsDiv.appendChild(btn);
|
|
});
|
|
|
|
let copyQueue = []; // Holds list of servers left
|
|
let currentServer = null; // Track which server is waiting confirmation
|
|
let isRunningAll = false;
|
|
|
|
document.getElementById("btnAll").onclick = () => {
|
|
if (isRunningAll) {
|
|
logMessage("info", "⚠️ Copy to ALL already running...");
|
|
return;
|
|
}
|
|
|
|
copyQueue = [...servers]; // fresh clone of the servers
|
|
isRunningAll = true;
|
|
logMessage(
|
|
"info",
|
|
"▶️ Starting sequential copy to ALL servers..."
|
|
);
|
|
|
|
runNextInQueue();
|
|
};
|
|
|
|
function runNextInQueue() {
|
|
if (copyQueue.length === 0) {
|
|
logMessage("info", "✅ Finished copying to ALL servers!");
|
|
isRunningAll = false;
|
|
currentServer = null;
|
|
return;
|
|
}
|
|
|
|
currentServer = copyQueue.shift();
|
|
logMessage(
|
|
"info",
|
|
`Copying to ${currentServer.name} (location ${currentServer.location})`
|
|
);
|
|
|
|
socket.emit("update", {
|
|
action: "copy",
|
|
target: currentServer.server,
|
|
location: currentServer.location,
|
|
});
|
|
}
|
|
|
|
socket.on("updateLogs", (msg) => {
|
|
//logMessage("update", msg);
|
|
|
|
// Only check queue progress if we're in All mode and have a currentServer
|
|
if (isRunningAll && currentServer) {
|
|
//const expected = `✅ Copy to ${currentServer.name} successful`;
|
|
const expected = "done";
|
|
|
|
if (msg.includes(expected)) {
|
|
logMessage(
|
|
"info",
|
|
`✅ Confirmed: ${currentServer.name} done`
|
|
);
|
|
runNextInQueue(); // trigger the next server
|
|
}
|
|
}
|
|
});
|
|
|
|
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>
|