118 lines
3.3 KiB
JavaScript
118 lines
3.3 KiB
JavaScript
var hackRunning = false;
|
|
|
|
// --- Panel container ---
|
|
var panel = document.createElement("div");
|
|
panel.style = `
|
|
background: #1e293b;
|
|
border: 1px solid #334155;
|
|
border-radius: 8px;
|
|
padding: 6px 10px;
|
|
margin: 4px 0;
|
|
font-family: 'Segoe UI', sans-serif;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 5px;
|
|
box-shadow: 0 2px 8px rgba(0,0,0,0.4);
|
|
`;
|
|
|
|
// Row 1: title + depth slider + value + button
|
|
var controlRow = document.createElement("div");
|
|
controlRow.style = `display:flex;align-items:center;gap:8px;`;
|
|
|
|
var panelTitle = document.createElement("span");
|
|
panelTitle.textContent = "Chess Assist";
|
|
panelTitle.style = `font-size:11px;font-weight:600;color:#64748b;white-space:nowrap;`;
|
|
|
|
var depthSlider = document.createElement("input");
|
|
depthSlider.type = "range";
|
|
depthSlider.min = "5"; depthSlider.max = "30"; depthSlider.value = globalDepth;
|
|
depthSlider.style = `flex:1;accent-color:#3b82f6;cursor:pointer;height:4px;`;
|
|
|
|
var depthValue = document.createElement("span");
|
|
depthValue.textContent = globalDepth;
|
|
depthValue.style = `font-size:11px;color:#64748b;min-width:16px;font-family:monospace;`;
|
|
|
|
depthSlider.addEventListener("input", function() {
|
|
globalDepth = parseInt(this.value);
|
|
depthValue.textContent = this.value;
|
|
});
|
|
|
|
var actionBtn = document.createElement("button");
|
|
actionBtn.id = "hack_button";
|
|
actionBtn.textContent = "Start";
|
|
actionBtn.style = `
|
|
padding: 4px 12px;
|
|
border: none;
|
|
border-radius: 5px;
|
|
font-size: 11px;
|
|
font-weight: 600;
|
|
cursor: pointer;
|
|
background: #22c55e;
|
|
color: #fff;
|
|
white-space: nowrap;
|
|
transition: opacity 0.2s;
|
|
`;
|
|
actionBtn.onmouseenter = () => { if (!actionBtn.disabled) actionBtn.style.opacity = "0.8"; };
|
|
actionBtn.onmouseleave = () => { actionBtn.style.opacity = "1"; };
|
|
|
|
controlRow.appendChild(panelTitle);
|
|
controlRow.appendChild(depthSlider);
|
|
controlRow.appendChild(depthValue);
|
|
controlRow.appendChild(actionBtn);
|
|
panel.appendChild(controlRow);
|
|
|
|
// Row 2: best move + eval bar (hidden until running)
|
|
var infoRow = document.createElement("div");
|
|
infoRow.style = `display:none;align-items:center;gap:8px;`;
|
|
|
|
var bestMoveDisplay = document.createElement("span");
|
|
bestMoveDisplay.id = "best-move";
|
|
bestMoveDisplay.style = `font-size:11px;color:#94a3b8;font-family:monospace;white-space:nowrap;`;
|
|
bestMoveDisplay.textContent = "Calculating...";
|
|
|
|
infoRow.appendChild(bestMoveDisplay);
|
|
infoRow.appendChild(evalLabel);
|
|
infoRow.appendChild(evalTrack);
|
|
infoRow.appendChild(evalPercent);
|
|
panel.appendChild(infoRow);
|
|
|
|
// --- State machine ---
|
|
function setIdleState() {
|
|
hackRunning = false;
|
|
actionBtn.textContent = "Start";
|
|
actionBtn.style.background = "#22c55e";
|
|
actionBtn.disabled = false;
|
|
infoRow.style.display = "none";
|
|
depthSlider.disabled = false;
|
|
depthSlider.style.opacity = "1";
|
|
}
|
|
|
|
function setRunningState() {
|
|
actionBtn.textContent = "Stop";
|
|
actionBtn.style.background = "#ef4444";
|
|
actionBtn.disabled = false;
|
|
infoRow.style.display = "flex";
|
|
depthSlider.disabled = true;
|
|
depthSlider.style.opacity = "0.4";
|
|
}
|
|
|
|
function startHack() {
|
|
if (hackRunning) return;
|
|
hackRunning = true;
|
|
actionBtn.textContent = "...";
|
|
actionBtn.style.background = "#475569";
|
|
actionBtn.disabled = true;
|
|
startEngines(getPlayerColour());
|
|
setRunningState();
|
|
}
|
|
|
|
function stopHack() {
|
|
stopEngines();
|
|
setIdleState();
|
|
}
|
|
|
|
actionBtn.onclick = () => {
|
|
if (!hackRunning) startHack();
|
|
else stopHack();
|
|
};
|