From d52307c792d7d6bbbb4f916012dbdb0224716efb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Leon=20B=C3=B6sche?= <leonboesche1999@gmail.com>
Date: Mon, 12 Jan 2026 01:30:53 +0100
Subject: [PATCH] Implement Collabora Online iframe viewer with WOPI
 integration

- Added dart:html and dart:ui_web imports for iframe support
- Created _buildCollaboraIframe() method to register and display iframe
- Set proper sandbox and allow attributes for Collabora functionality
- Full-screen iframe embedding of Collabora Online document editor
- Replaces placeholder UI with actual document viewing capability
---
 b0esche_cloud/lib/pages/document_viewer.dart | 76 +++++++++-----------
 1 file changed, 34 insertions(+), 42 deletions(-)

diff --git a/b0esche_cloud/lib/pages/document_viewer.dart b/b0esche_cloud/lib/pages/document_viewer.dart
index b3c6307..dc0461d 100644
--- a/b0esche_cloud/lib/pages/document_viewer.dart
+++ b/b0esche_cloud/lib/pages/document_viewer.dart
@@ -1,5 +1,7 @@
 import 'package:flutter/material.dart';
 import 'dart:convert';
+import 'dart:html' as html;
+import 'dart:ui_web' as ui;
 import '../theme/app_theme.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 import '../blocs/document_viewer/document_viewer_bloc.dart';
@@ -450,49 +452,39 @@ class _DocumentViewerModalState extends State<DocumentViewerModal> {
     }
   }
 
+  Widget _buildCollaboraIframe(String collaboraUrl) {
+    // Register the iframe element
+    const String viewType = 'collabora-iframe';
+
+    // Create the iframe with proper attributes for Collabora Online
+    ui.platformViewRegistry.registerViewFactory(viewType, (int viewId) {
+      final iframe = html.IFrameElement()
+        ..src = collaboraUrl
+        ..style.border = 'none'
+        ..style.width = '100%'
+        ..style.height = '100%'
+        ..style.margin = '0'
+        ..style.padding = '0'
+        ..setAttribute(
+          'allow',
+          'microphone; camera; usb; autoplay; clipboard-read; clipboard-write',
+        );
+
+      // Prevent sandbox restrictions that might block Collabora
+      iframe.setAttribute(
+        'sandbox',
+        'allow-same-origin allow-scripts allow-popups allow-forms allow-top-navigation allow-pointer-lock allow-presentation allow-modals',
+      );
+
+      return iframe;
+    });
+
+    return HtmlElementView(viewType: viewType);
+  }
+
   Widget _buildWebView(String url) {
-    // For now, show a message with the Collabora URL
-    // In a full implementation, you would use webview_flutter or similar
-    return Center(
-      child: SingleChildScrollView(
-        child: Padding(
-          padding: const EdgeInsets.all(16.0),
-          child: Column(
-            mainAxisAlignment: MainAxisAlignment.center,
-            children: [
-              const Icon(
-                Icons.description,
-                size: 64,
-                color: AppTheme.accentColor,
-              ),
-              const SizedBox(height: 16),
-              Text(
-                'Collabora Online Viewer',
-                style: Theme.of(context).textTheme.headlineSmall,
-              ),
-              const SizedBox(height: 8),
-              Text(
-                'Document URL: ${url.substring(0, 100)}...',
-                style: Theme.of(context).textTheme.bodySmall,
-                textAlign: TextAlign.center,
-              ),
-              const SizedBox(height: 16),
-              ElevatedButton(
-                onPressed: () {
-                  // You can implement opening in browser or using webview here
-                  ScaffoldMessenger.of(context).showSnackBar(
-                    const SnackBar(
-                      content: Text('Collabora viewer loading...'),
-                    ),
-                  );
-                },
-                child: const Text('Open Document'),
-              ),
-            ],
-          ),
-        ),
-      ),
-    );
+    // Embed Collabora Online in an iframe for web platform
+    return _buildCollaboraIframe(url);
   }
 
   @override