From f9827ea06c5f6e48c07dfa7a312f0754bd953147 Mon Sep 17 00:00:00 2001 From: MarekWo Date: Thu, 1 Jan 2026 19:30:26 +0100 Subject: [PATCH] feat: Replace direct navigation with fullscreen modals for DM and Contact Management MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Implement modal dialogs to resolve PWA viewport corruption issues on Android. When navigating between pages using window.location.href, the viewport height calculation becomes corrupted, causing the status bar to be hidden under system UI. Changes: - Add fullscreen modals for Direct Messages and Contact Management in index.html - Configure FAB buttons to open modals instead of navigating to new pages - Add JavaScript to reload iframe content when modals are opened (ensures fresh data) - Remove DM and Contact Management from offcanvas menu to avoid duplication - Both modals use iframes to embed existing /dm and /contacts/manage pages - Modal headers styled with appropriate colors (green for DM, blue for Contacts) This approach bypasses the viewport corruption issue since modals don't trigger the problematic navigation flow that occurs with page changes in PWA mode. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Sonnet 4.5 --- app/templates/base.html | 11 -------- app/templates/index.html | 60 ++++++++++++++++++++++++++++++++++++++-- 2 files changed, 57 insertions(+), 14 deletions(-) diff --git a/app/templates/base.html b/app/templates/base.html index ca6a654..5ed8e1d 100644 --- a/app/templates/base.html +++ b/app/templates/base.html @@ -63,17 +63,6 @@ Manage Channels - -
diff --git a/app/templates/index.html b/app/templates/index.html index ec8fce8..76f98dd 100644 --- a/app/templates/index.html +++ b/app/templates/index.html @@ -106,15 +106,45 @@
- +
- -
+ + + + + + {% endblock %} {% block extra_scripts %} @@ -123,5 +153,29 @@ window.MC_CONFIG = { deviceName: "{{ device_name }}" }; + + // Reload iframe content when modals are opened to ensure fresh data + document.addEventListener('DOMContentLoaded', function() { + const dmModal = document.getElementById('dmModal'); + const contactsModal = document.getElementById('contactsModal'); + + if (dmModal) { + dmModal.addEventListener('show.bs.modal', function () { + const dmFrame = document.getElementById('dmFrame'); + if (dmFrame) { + dmFrame.src = dmFrame.src; + } + }); + } + + if (contactsModal) { + contactsModal.addEventListener('show.bs.modal', function () { + const contactsFrame = document.getElementById('contactsFrame'); + if (contactsFrame) { + contactsFrame.src = contactsFrame.src; + } + }); + } + }); {% endblock %}