100 lines
2.3 KiB
TypeScript
100 lines
2.3 KiB
TypeScript
|
|
|
|
declare const Guacamole: any;
|
|
|
|
export function openConsole(
|
|
container: HTMLElement,
|
|
wsUrl: string,
|
|
connectData = ""
|
|
): {
|
|
disconnect: () => void;
|
|
setScale: (scale: number) => void;
|
|
resize: (width: number, height: number) => void;
|
|
focus: () => void;
|
|
} {
|
|
|
|
|
|
const tunnel = new Guacamole.WebSocketTunnel(wsUrl);
|
|
const client = new Guacamole.Client(tunnel);
|
|
|
|
container.innerHTML = "";
|
|
container.appendChild(client.getDisplay().getElement());
|
|
|
|
container.tabIndex = 0;
|
|
container.style.outline = "none";
|
|
|
|
client.connect(connectData);
|
|
|
|
const display = client.getDisplay();
|
|
let scale = 1;
|
|
|
|
|
|
|
|
|
|
|
|
const mouse = new Guacamole.Mouse(display.getElement());
|
|
mouse.onmousedown = mouse.onmouseup = mouse.onmousemove = (state: any) => {
|
|
const s = new Guacamole.Mouse.State(
|
|
state.x / scale,
|
|
state.y / scale,
|
|
state.left,
|
|
state.middle,
|
|
state.right,
|
|
state.up,
|
|
state.down
|
|
);
|
|
client.sendMouseState(s);
|
|
};
|
|
|
|
|
|
|
|
|
|
const keyboard = new Guacamole.Keyboard(container);
|
|
keyboard.onkeydown = (k: number) => client.sendKeyEvent(1, k);
|
|
keyboard.onkeyup = (k: number) => client.sendKeyEvent(0, k);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const refocus = () => {
|
|
if (document.activeElement !== container) container.focus({ preventScroll: true });
|
|
};
|
|
container.addEventListener("pointerdown", refocus, true);
|
|
container.addEventListener("mousedown", refocus, true);
|
|
container.addEventListener("touchstart", refocus, true);
|
|
|
|
|
|
|
|
const onBlur = () => {
|
|
if (typeof keyboard.reset === "function") keyboard.reset();
|
|
};
|
|
container.addEventListener("blur", onBlur);
|
|
window.addEventListener("blur", onBlur);
|
|
|
|
container.focus({ preventScroll: true });
|
|
|
|
return {
|
|
disconnect() {
|
|
container.removeEventListener("pointerdown", refocus, true);
|
|
container.removeEventListener("mousedown", refocus, true);
|
|
container.removeEventListener("touchstart", refocus, true);
|
|
container.removeEventListener("blur", onBlur);
|
|
window.removeEventListener("blur", onBlur);
|
|
keyboard.onkeydown = null;
|
|
keyboard.onkeyup = null;
|
|
if (typeof keyboard.reset === "function") keyboard.reset();
|
|
client.disconnect();
|
|
},
|
|
focus: refocus,
|
|
setScale(s: number) {
|
|
scale = s;
|
|
display.scale(s);
|
|
},
|
|
resize(width: number, height: number) {
|
|
client.sendSize(width, height);
|
|
},
|
|
};
|
|
}
|