Add fullykiosk browser special cases

This commit is contained in:
2022-07-15 19:49:38 +00:00
parent a46d2b3cb0
commit 11d75426fb
8 changed files with 505 additions and 248 deletions

View File

@@ -36,16 +36,29 @@ export const ScreenSaverMixin = (SuperClass) => {
this.addEventListener("command-screen_off", () => this._screen_off());
this.addEventListener("command-screen_on", (ev) => this._screen_on(ev));
this.addEventListener("fully-update", () => this.send_screen_status());
this.connectionPromise.then(() => this._screen_on());
}
private _screen_off() {
this._panel.setAttribute("dark", "");
send_screen_status() {
let screen_on = !this._panel.hasAttribute("dark");
let screen_brightness = this._brightness;
if (this.fully) {
screen_on = this.fully_screen;
screen_brightness = this.fully_brightness;
}
this.sendUpdate({
screen_on: false,
screen_brightness: 0,
});
this.sendUpdate({ screen_on, screen_brightness });
}
private _screen_off() {
if (this.fully) {
this.fully_screen = false;
} else {
this._panel.setAttribute("dark", "");
}
this.send_screen_status();
const l = () => this._screen_on();
for (const ev of ["pointerdown", "pointermove", "keydown"]) {
@@ -55,18 +68,22 @@ export const ScreenSaverMixin = (SuperClass) => {
}
private _screen_on(ev = undefined) {
if (ev?.detail?.brightness) {
this._brightness = ev.detail.brightness;
this._panel.style.setProperty(
"--darkness",
1 - ev.detail.brightness / 255
);
if (this.fully) {
this.fully_screen = true;
if (ev?.detail?.brightness) {
this.fully_brightness = ev.detail.brightness;
}
} else {
if (ev?.detail?.brightness) {
this._brightness = ev.detail.brightness;
this._panel.style.setProperty(
"--darkness",
1 - ev.detail.brightness / 255
);
}
this._panel.removeAttribute("dark");
}
this._panel.removeAttribute("dark");
this.sendUpdate({
screen_on: true,
screen_brightness: this._brightness,
});
this.send_screen_status();
for (const ev of ["pointerdown", "pointermove", "keydown"]) {
if (this._listeners[ev]) {
@@ -79,141 +96,141 @@ export const ScreenSaverMixin = (SuperClass) => {
return ScreenSaverMixinClass;
};
export const BrowserModScreensaverMixin = (C) =>
class extends C {
constructor() {
super();
this._blackout_panel = document.createElement("div");
// export const BrowserModScreensaverMixin = (C) =>
// class extends C {
// constructor() {
// super();
// this._blackout_panel = document.createElement("div");
this._screenSaver = undefined;
this._screenSaverTimer = undefined;
this._screenSaverTimeOut = 0;
// this._screenSaver = undefined;
// this._screenSaverTimer = undefined;
// this._screenSaverTimeOut = 0;
this._screenSaver = {
fn: undefined,
clearfn: undefined,
timer: undefined,
timeout: undefined,
listeners: {},
active: false,
};
// this._screenSaver = {
// fn: undefined,
// clearfn: undefined,
// timer: undefined,
// timeout: undefined,
// listeners: {},
// active: false,
// };
this._blackout_panel.style.cssText = `
position: fixed;
left: 0;
top: 0;
padding: 0;
margin: 0;
width: 100%;
height: 100%;
background: black;
display: none;
`;
document.body.appendChild(this._blackout_panel);
}
// this._blackout_panel.style.cssText = `
// position: fixed;
// left: 0;
// top: 0;
// padding: 0;
// margin: 0;
// width: 100%;
// height: 100%;
// background: black;
// display: none;
// `;
// document.body.appendChild(this._blackout_panel);
// }
screensaver_set(fn, clearfn, time) {
this._ss_clear();
this._screenSaver = {
fn,
clearfn,
timer: undefined,
timeout: time,
listeners: {},
active: false,
};
const l = () => this.screensaver_update();
for (const event of ["mousemove", "mousedown", "keydown", "touchstart"]) {
window.addEventListener(event, l);
this._screenSaver.listeners[event] = l;
}
this._screenSaver.timer = window.setTimeout(
() => this._ss_run(),
time * 1000
);
}
// screensaver_set(fn, clearfn, time) {
// this._ss_clear();
// this._screenSaver = {
// fn,
// clearfn,
// timer: undefined,
// timeout: time,
// listeners: {},
// active: false,
// };
// const l = () => this.screensaver_update();
// for (const event of ["mousemove", "mousedown", "keydown", "touchstart"]) {
// window.addEventListener(event, l);
// this._screenSaver.listeners[event] = l;
// }
// this._screenSaver.timer = window.setTimeout(
// () => this._ss_run(),
// time * 1000
// );
// }
screensaver_update() {
if (this._screenSaver.active) {
this.screensaver_stop();
} else {
window.clearTimeout(this._screenSaver.timer);
this._screenSaver.timer = window.setTimeout(
() => this._ss_run(),
this._screenSaver.timeout * 1000
);
}
}
// screensaver_update() {
// if (this._screenSaver.active) {
// this.screensaver_stop();
// } else {
// window.clearTimeout(this._screenSaver.timer);
// this._screenSaver.timer = window.setTimeout(
// () => this._ss_run(),
// this._screenSaver.timeout * 1000
// );
// }
// }
screensaver_stop() {
this._ss_clear();
this._screenSaver.active = false;
if (this._screenSaver.clearfn) this._screenSaver.clearfn();
if (this._screenSaver.timeout) {
this.screensaver_set(
this._screenSaver.fn,
this._screenSaver.clearfn,
this._screenSaver.timeout
);
}
}
// screensaver_stop() {
// this._ss_clear();
// this._screenSaver.active = false;
// if (this._screenSaver.clearfn) this._screenSaver.clearfn();
// if (this._screenSaver.timeout) {
// this.screensaver_set(
// this._screenSaver.fn,
// this._screenSaver.clearfn,
// this._screenSaver.timeout
// );
// }
// }
_ss_clear() {
window.clearTimeout(this._screenSaverTimer);
for (const [k, v] of Object.entries(this._screenSaver.listeners)) {
window.removeEventListener(k as any, v as any);
}
}
// _ss_clear() {
// window.clearTimeout(this._screenSaverTimer);
// for (const [k, v] of Object.entries(this._screenSaver.listeners)) {
// window.removeEventListener(k as any, v as any);
// }
// }
_ss_run() {
this._screenSaver.active = true;
this._screenSaver.fn();
}
// _ss_run() {
// this._screenSaver.active = true;
// this._screenSaver.fn();
// }
do_blackout(timeout) {
this.screensaver_set(
() => {
if (this.isFully) {
if (this.config.screensaver) window.fully.startScreensaver();
else window.fully.turnScreenOff(true);
} else {
this._blackout_panel.style.display = "block";
}
this.screen_update();
},
() => {
if ((this._blackout_panel.style.display = "block"))
this._blackout_panel.style.display = "none";
if (this.isFully) {
if (!window.fully.getScreenOn()) window.fully.turnScreenOn();
window.fully.stopScreensaver();
}
this.screen_update();
},
timeout || 0
);
}
// do_blackout(timeout) {
// this.screensaver_set(
// () => {
// if (this.isFully) {
// if (this.config.screensaver) window.fully.startScreensaver();
// else window.fully.turnScreenOff(true);
// } else {
// this._blackout_panel.style.display = "block";
// }
// this.screen_update();
// },
// () => {
// if ((this._blackout_panel.style.display = "block"))
// this._blackout_panel.style.display = "none";
// if (this.isFully) {
// if (!window.fully.getScreenOn()) window.fully.turnScreenOn();
// window.fully.stopScreensaver();
// }
// this.screen_update();
// },
// timeout || 0
// );
// }
no_blackout() {
if (this.isFully) {
window.fully.turnScreenOn();
window.fully.stopScreensaver();
}
this.screensaver_stop();
}
// no_blackout() {
// if (this.isFully) {
// window.fully.turnScreenOn();
// window.fully.stopScreensaver();
// }
// this.screensaver_stop();
// }
screen_update() {
this.sendUpdate({
screen: {
blackout: this.isFully
? this.fully_screensaver !== undefined
? this.fully_screensaver
: !window.fully.getScreenOn()
: Boolean(this._blackout_panel.style.display === "block"),
brightness: this.isFully
? window.fully.getScreenBrightness()
: undefined,
},
});
}
};
// screen_update() {
// this.sendUpdate({
// screen: {
// blackout: this.isFully
// ? this.fully_screensaver !== undefined
// ? this.fully_screensaver
// : !window.fully.getScreenOn()
// : Boolean(this._blackout_panel.style.display === "block"),
// brightness: this.isFully
// ? window.fully.getScreenBrightness()
// : undefined,
// },
// });
// }
// };