From e7a2f06dae9d30120611d8efb6e845c79b277575 Mon Sep 17 00:00:00 2001
From: quickiwiki <eldargafiyatov@gmail.com>
Date: Tue, 5 Aug 2025 18:21:05 +0500
Subject: [PATCH] Bugfix/multi monitor issues (#154)

* VNC-212 Fix monitors addition issue

* Add control input visibility for display button
---
 app/ui.js       | 32 ++++++++++++++++++++++----------
 core/display.js |  2 +-
 2 files changed, 23 insertions(+), 11 deletions(-)

diff --git a/app/ui.js b/app/ui.js
index da9f67d9..83def8d3 100644
--- a/app/ui.js
+++ b/app/ui.js
@@ -1458,6 +1458,9 @@ const UI = {
         }
         url += '/' + path;
 
+        UI.monitors = [];
+        UI.sortedMonitors = [];
+        UI.showControlInput('noVNC_displays_button')
         UI.rfb = new RFB(document.getElementById('noVNC_container'),
                         document.getElementById('noVNC_keyboardinput'),
                         url,
@@ -1604,6 +1607,7 @@ const UI = {
         UI.updateVisualState('disconnecting');
 
         clearInterval(UI._sessionTimeoutInterval);
+        UI.hideControlInput('noVNC_displays_button');
     },
 
     reconnect() {
@@ -1657,6 +1661,8 @@ const UI = {
         UI.connected = false;
 
         UI.rfb = undefined;
+        UI.monitors = [];
+        UI.sortedMonitors = [];
 
         if (!e.detail.clean) {
             UI.updateVisualState('disconnected');
@@ -1969,11 +1975,13 @@ const UI = {
 
     openDisplays() {
         document.getElementById('noVNC_displays').classList.add("noVNC_open");
-        if (UI.monitors.length < 1 ) {
+        if (UI.monitors.length < 1  && UI.rfb) {
             let screenPlan = UI.rfb.getScreenPlan();
-            UI.initMonitors(screenPlan)
+            UI.initMonitors(screenPlan);
+        }
+        if (UI.monitors.length > 0) {
+            UI.displayMonitors()
         }
-        UI.displayMonitors()
     },
 
     closeDisplays() {
@@ -2106,6 +2114,9 @@ const UI = {
     recenter() {
         const monitors = UI.sortedMonitors
         UI.removeSpaces()
+        if (!monitors.length) {
+            return;
+        }
         const { startLeft, startTop } = UI.getSizes(monitors)
 
         for (var i = 0; i < monitors.length; i++) {
@@ -2183,11 +2194,12 @@ const UI = {
     },
 
     getSizes(monitors) {
-        const { canvasWidth, canvasHeight } = UI.multiMonitorSettings()
-        let top = monitors[0].y
-        let left = monitors[0].x
-        let width = monitors[0].w
-        let height = monitors[0].h
+        const { canvasWidth, canvasHeight } = UI.multiMonitorSettings();
+
+        let top = monitors[0].y;
+        let left = monitors[0].x;
+        let width = monitors[0].w;
+        let height = monitors[0].h;
         for (var i = 0; i < monitors.length; i++) {
             var m = monitors[i];
             if (m.x < left) {
@@ -3017,12 +3029,12 @@ const UI = {
         UI.sendMessage('sharedSessionUserJoin', e.detail)
 
     },
-    
+
     sharedSessionUserLeft(e) {
         Log.Info('shared session user left: ' + e.detail)
         UI.sendMessage('sharedSessionUserLeft', e.detail)
     },
-    
+
     //Helper to add options to dropdown.
     addOption(selectbox, text, value) {
         const optn = document.createElement("OPTION");
diff --git a/core/display.js b/core/display.js
index c635caf3..1f342a9e 100644
--- a/core/display.js
+++ b/core/display.js
@@ -473,7 +473,7 @@ export default class Display {
             for (let i=1; i<this._screens.length; i++) {
                 this.screens[i].screenIndex = i;
                 if (i > 0) {
-                    this._screens[i].channel.postMessage({ eventType: "registered", screenIndex: i });
+                    this._screens[i].channel?.postMessage({ eventType: "registered", screenIndex: i });
                 }
             }
             return removed;