From 706e8350af0d26b108143d089dfeeb5b62c6fa7a Mon Sep 17 00:00:00 2001
From: E44 <129310925+programmer-44@users.noreply.github.com>
Date: Sun, 9 Nov 2025 19:51:47 +0100
Subject: [PATCH] start to implement show text

---
 .../src/components/ControlView.svelte         | 27 ++++++++++++++++++-
 control/frontend/src/components/PopUp.svelte  |  2 +-
 2 files changed, 27 insertions(+), 2 deletions(-)

diff --git a/control/frontend/src/components/ControlView.svelte b/control/frontend/src/components/ControlView.svelte
index c6c97c2..7ff7299 100644
--- a/control/frontend/src/components/ControlView.svelte
+++ b/control/frontend/src/components/ControlView.svelte
@@ -18,6 +18,10 @@
 	import { send_keyboard_input, show_blackscreen } from '../ts/api_handler';
 	import { run_on_all_selected_displays } from '../ts/stores/displays';
 	import { selected_display_ids } from '../ts/stores/select';
+	import { onMount } from 'svelte';
+
+	let show_text_body: string = `<p>I've been working on this <strong>new feature</strong> for the past few days. 
+	It's been quite <em>challenging</em> but I think I'm making good progress.</p>`;
 
 	let popup_content: PopupContent = $state({
 		open: false,
@@ -39,6 +43,20 @@
 			closable: true
 		};
 	};
+
+	const show_text_popup = () => {
+		popup_content = {
+			open: true,
+			snippet: text_popup,
+			title: 'Text anzeigen',
+			title_icon: TextAlignStart,
+			closable: true
+		};
+	};
+
+	onMount(() => {
+		show_text_popup();
+	});
 </script>
 
 {#snippet send_keys_popup()}
@@ -50,6 +68,12 @@
 	</div>
 {/snippet}
 
+{#snippet text_popup()}
+	<!-- <div class="flex flex-row justify-end gap-2">
+		<Button className="px-4 font-bold" click_function={popup_close_function}>Fertig</Button>
+	</div> -->
+{/snippet}
+
 <div class="grid grid-rows-[2.5rem_auto] bg-stone-800 rounded-2xl min-w-0">
 	<div class="text-xl font-bold pl-3 content-center bg-stone-700 rounded-t-2xl truncate min-w-0">
 		Bildschirme steuern
@@ -89,7 +113,8 @@
 				</div>
 				<Button
 					className="px-3 flex gap-3 w-75 justify-normal"
-					disabled={$selected_display_ids.length === 0}><TextAlignStart /> Text anzeigen</Button
+					disabled={$selected_display_ids.length === 0}
+					click_function={show_text_popup}><TextAlignStart /> Text anzeigen</Button
 				>
 				<Button
 					className="px-3 flex gap-3 w-75 justify-normal"
diff --git a/control/frontend/src/components/PopUp.svelte b/control/frontend/src/components/PopUp.svelte
index 7ee765c..91625a3 100644
--- a/control/frontend/src/components/PopUp.svelte
+++ b/control/frontend/src/components/PopUp.svelte
@@ -40,7 +40,7 @@
 		<!-- svelte-ignore a11y_no_static_element_interactions -->
 		<!-- svelte-ignore a11y_click_events_have_key_events -->
 		<div
-			class="bg-stone-800 rounded-2xl min-w-[30%] max-w-[80%] max-h-[80%] flex flex-col shadow-2xl/60 overflow-hidden"
+			class="bg-stone-800 rounded-2xl min-w-[30%] max-w-[95%] max-h-[90%] flex flex-col shadow-2xl/60 overflow-hidden"
 			onclick={(e) => e.stopPropagation()}
 		>
 			<div