73 lines
3.2 KiB
JavaScript
Executable File
73 lines
3.2 KiB
JavaScript
Executable File
// /public/app.js
|
|
// Small bootstrap moved out of index.html to satisfy CSP (`script-src 'self'`).
|
|
(function () {
|
|
const isSecure = location.protocol === 'https:';
|
|
const wsProto = isSecure ? 'wss' : 'ws';
|
|
const base = `${wsProto}://${location.host}`;
|
|
|
|
// Camera 0 with control channel
|
|
window.VideoService.attachStream({
|
|
url: `${base}/ws/video0`,
|
|
canvas: document.getElementById('canvas0'),
|
|
statusEl: document.getElementById('status0'),
|
|
control: {
|
|
resSelect: document.getElementById('res0'),
|
|
fpsSelect: document.getElementById('fps0'),
|
|
qSelect: document.getElementById('q0'),
|
|
applyBtn: document.getElementById('apply0'),
|
|
snapshotBtn: document.getElementById('snap0'),
|
|
startBtn: document.getElementById('start0'),
|
|
stopBtn: document.getElementById('stop0'),
|
|
snapshotOutEl: document.getElementById('snapshotLink'),
|
|
}
|
|
});
|
|
|
|
// Camera 1 (no control)
|
|
window.VideoService.attachStream({
|
|
url: `${base}/ws/video1`,
|
|
canvas: document.getElementById('canvas1'),
|
|
statusEl: document.getElementById('status1'),
|
|
});
|
|
|
|
// Run an automatic snapshot shortly after the page loads so the client
|
|
// receives the freshest annotated image/CSV on startup. This uses a
|
|
// synthetic click on the snapshot button; the handler will no-op if the
|
|
// WebSocket isn't open yet.
|
|
setTimeout(() => {
|
|
const snapBtn = document.getElementById('snap0');
|
|
if (snapBtn) snapBtn.click();
|
|
}, 200);
|
|
|
|
// Attach handlers for the Point/Up/Down buttons (no inline JS, CSP-safe)
|
|
const btnPoint = document.getElementById('btnPoint');
|
|
const btnDown = document.getElementById('btnDown');
|
|
const btnUp = document.getElementById('btnUp');
|
|
if (btnPoint) btnPoint.addEventListener('click', () => {
|
|
console.log('FPoint!');
|
|
try { socketDriver.send('FPoint'); socketDriver.send('FShow'); } catch (e) { console.error(e); }
|
|
});
|
|
if (btnDown) btnDown.addEventListener('click', () => {
|
|
console.log('FPlus');
|
|
try { socketDriver.send('FPlus'); socketDriver.send('FShow'); } catch (e) { console.error(e); }
|
|
});
|
|
if (btnUp) btnUp.addEventListener('click', () => {
|
|
console.log('FMinus');
|
|
try { socketDriver.send('FMinus'); socketDriver.send('FShow'); } catch (e) { console.error(e); }
|
|
});
|
|
|
|
// Other buttons that were previously using inline onclicks.
|
|
const btnInfo = document.getElementById('b_M114');
|
|
const btnNull = document.getElementById('b_G28');
|
|
const btnListFile = document.getElementById('btnListFile');
|
|
const btnSendGCode = document.getElementById('btnSendGCode');
|
|
if (btnInfo) btnInfo.addEventListener('click', () => { try { socketDriver.send('M114'); } catch (e) { console.error(e); } });
|
|
if (btnNull) btnNull.addEventListener('click', () => { try { socketDriver.send('G28'); } catch (e) { console.error(e); } });
|
|
if (btnListFile) btnListFile.addEventListener('click', () => { try { socketDriver.send('FShow'); } catch (e) { console.error(e); } });
|
|
if (btnSendGCode) btnSendGCode.addEventListener('click', () => {
|
|
try {
|
|
const input = document.getElementById('GKarth');
|
|
if (input && input.value) socketDriver.send(input.value);
|
|
} catch (e) { console.error(e); }
|
|
});
|
|
})();
|