From 468563229421c10c76093560e51d0966f8b3bbe2 Mon Sep 17 00:00:00 2001
From: duffyduck <info@hacker-net.de>
Date: Tue, 21 Jul 2026 00:51:59 +0200
Subject: [PATCH] feat(vnc): echtes Vollbild beim Verbinden (randlos ueber das
 ganze Display)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Der ⤢-Knopf war nur der Fit/1:1-Umschalter (Zoom) INNERHALB des eingerahmten
Streifens (Header+Dock drumrum) — sah deshalb wie Zoom aus, fuellte nie das
Display. Jetzt oeffnet "Verbinden" die VM in einem Fullscreen-Modal: randlos
ueber alles (Header + Dock weg), scaleViewport passt den VM-Screen sauber ein,
Landscape erlaubt. Buttons schweben drueber (‹ VMs links, ⌨/Strg+Alt+Entf/⤢
rechts, unter der Statusleiste). Android-Back verlaesst Vollbild.

tsc clean. App-only, Deploy: APK.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
---
 android/src/workspace/tiles/DesktopTile.tsx | 30 ++++++++++-----------
 android/src/workspace/tiles/VncTile.tsx     |  2 +-
 2 files changed, 16 insertions(+), 16 deletions(-)

diff --git a/android/src/workspace/tiles/DesktopTile.tsx b/android/src/workspace/tiles/DesktopTile.tsx
index 494d0a0..3ed2959 100644
--- a/android/src/workspace/tiles/DesktopTile.tsx
+++ b/android/src/workspace/tiles/DesktopTile.tsx
@@ -71,21 +71,6 @@ const DesktopTile: React.FC<Props> = ({ projectId, focused }) => {
     );
   }
 
-  // Verbunden → noVNC-Ansicht der VM + Zurück-Leiste.
-  if (connected) {
-    return (
-      <View style={styles.container}>
-        <View style={styles.bar}>
-          <TouchableOpacity onPress={() => setConnected(null)} style={styles.barBtn}>
-            <Text style={styles.barBtnText}>‹ VMs</Text>
-          </TouchableOpacity>
-          <Text style={styles.barTitle} numberOfLines={1}>{connected.name} · :{connected.vnc_display}</Text>
-        </View>
-        <VncTile projectId={projectId} focused port={connected.vnc_port || (5900 + (connected.vnc_display || 1))} />
-      </View>
-    );
-  }
-
   return (
     <View style={styles.container}>
       <View style={styles.bar}>
@@ -157,6 +142,18 @@ const DesktopTile: React.FC<Props> = ({ projectId, focused }) => {
           <Text style={styles.shotHint}>Tippen zum Schließen</Text>
         </TouchableOpacity>
       </Modal>
+
+      {/* Vollbild-VNC — randlos ueber das ganze Display (Header + Dock weg). */}
+      {connected && (
+        <Modal visible animationType="slide" onRequestClose={() => setConnected(null)} supportedOrientations={['portrait', 'landscape']}>
+          <View style={styles.fs}>
+            <VncTile projectId={projectId} focused port={connected.vnc_port || (5900 + (connected.vnc_display || 1))} />
+            <TouchableOpacity style={styles.fsBack} onPress={() => setConnected(null)} activeOpacity={0.8}>
+              <Text style={styles.fsBackText}>‹ VMs</Text>
+            </TouchableOpacity>
+          </View>
+        </Modal>
+      )}
     </View>
   );
 };
@@ -180,6 +177,9 @@ const styles = StyleSheet.create({
   vmBtns: { flexDirection: 'row', gap: 6, alignItems: 'center' },
   vmBtn: { borderWidth: 1, borderRadius: 8, paddingHorizontal: 10, paddingVertical: 6, minWidth: 34, alignItems: 'center' },
   vmBtnText: { fontSize: 12, fontWeight: '700' },
+  fs: { flex: 1, backgroundColor: '#000000' },
+  fsBack: { position: 'absolute', top: 34, left: 10, backgroundColor: 'rgba(18,18,42,0.9)', borderColor: '#2A2A3E', borderWidth: 1, borderRadius: 10, paddingHorizontal: 12, paddingVertical: 7 },
+  fsBackText: { color: '#0096FF', fontSize: 14, fontWeight: '700' },
   shotOverlay: { flex: 1, backgroundColor: 'rgba(0,0,0,0.92)', alignItems: 'center', justifyContent: 'center', padding: 12 },
   shotTitle: { color: '#E0E0F0', fontSize: 14, fontWeight: '700', marginBottom: 10 },
   shotImg: { width: '100%', height: '78%', backgroundColor: '#000' },
diff --git a/android/src/workspace/tiles/VncTile.tsx b/android/src/workspace/tiles/VncTile.tsx
index eefad01..2538b6f 100644
--- a/android/src/workspace/tiles/VncTile.tsx
+++ b/android/src/workspace/tiles/VncTile.tsx
@@ -119,7 +119,7 @@ const styles = StyleSheet.create({
   sub: { color: '#9090B0', fontSize: 14, marginTop: 8 },
   ctlBar: {
     position: 'absolute',
-    top: 8,
+    top: 34,
     right: 8,
     flexDirection: 'row',
     gap: 6,