diff --git a/js/integration.js b/js/integration.js index 4a1d383..3fc56e0 100644 --- a/js/integration.js +++ b/js/integration.js @@ -67,6 +67,7 @@ const init = async () => { initDisplay(); initKeyboard(); initPageNumber(); + initPageZoom(); initPageUrl(); // Init client sensors @@ -130,6 +131,7 @@ const update = async () => { // Update client sensors updateKiosk(); updatePageNumber(); + updatePageZoom(); updatePageUrl(); updateUpTime(); updateLastActive(); @@ -453,6 +455,44 @@ const updatePageNumber = () => { publishState("page_number", pageNumber); }; +/** + * Initializes the page zoom and handles the execute logic. + */ +const initPageZoom = () => { + const root = `${INTEGRATION.root}/page_zoom`; + const config = { + name: "Page Zoom", + unique_id: `${INTEGRATION.node}_page_zoom`, + command_topic: `${root}/set`, + state_topic: `${root}/state`, + value_template: "{{ value | int }}", + mode: "slider", + min: 10, + max: 400, + unit_of_measurement: "%", + icon: "mdi:magnify-plus-outline", + device: INTEGRATION.device, + }; + publishConfig("number", config) + .on("message", (topic, message) => { + if (topic === config.command_topic) { + const zoom = parseInt(message, 10); + console.log("Set Page Zoom:", zoom); + WEBVIEW.viewZoom = zoom / 100.0; + } + }) + .subscribe(config.command_topic); + updatePageZoom(); +}; + +/** + * Updates the page zoom via the mqtt connection. + */ +const updatePageZoom = () => { + const pageZoom = Math.round(WEBVIEW.viewZoom * 100.0); + publishState("page_zoom", pageZoom); +}; + /** * Initializes the page url and handles the execute logic. */ diff --git a/js/webview.js b/js/webview.js index 05010f0..4accc57 100644 --- a/js/webview.js +++ b/js/webview.js @@ -38,7 +38,15 @@ const init = async () => { // Init global properties WEBVIEW.viewUrls = urls; - WEBVIEW.viewZoom = zoom; + Object.defineProperty(WEBVIEW, "viewZoom", { + get() { + return this._viewZoom || zoom; + }, + set(v) { + this._viewZoom = Math.max(0, v); + updateZoom(); + }, + }); WEBVIEW.viewTheme = theme; WEBVIEW.widgetTheme = theme; WEBVIEW.widgetEnabled = widget; @@ -315,6 +323,17 @@ const resizeView = () => { } }; +/** + * Updates zoom level for all webviews. + */ +const updateZoom = () => { + // And apply to all views + WEBVIEW.views.forEach((view) => { + view.webContents.setZoomFactor(WEBVIEW.viewZoom); + }); + +}; + /** * Register window events and handler. */