From 1b20085a3bdd4f72ccea1f3a6fd1e9ebe06fea00 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lev=20Z=20Kir=C3=A1ly?= <LeventeZoltan.Kiraly@oeaw.ac.at>
Date: Sun, 1 Oct 2023 22:24:07 +0200
Subject: [PATCH 1/8] Add windowMargin #45

---
 components/WindowManager.vue |  7 ++-----
 store/wm.ts                  | 11 ++++++-----
 2 files changed, 8 insertions(+), 10 deletions(-)

diff --git a/components/WindowManager.vue b/components/WindowManager.vue
index 7fbed45..40381a5 100644
--- a/components/WindowManager.vue
+++ b/components/WindowManager.vue
@@ -37,8 +37,6 @@
 			return false
 		}
 
-		console.log(newWindow)
-
 		let windowClasses = [ 'wb-vicav', 'no-min', 'no-max', 'no-full', 'no-resize', 'no-move']
 		if (!!newWindow.params?.customClass) {
 			windowClasses.push(newWindow.params.customClass)
@@ -70,8 +68,7 @@
 	}
 
 	function RegisterClientSize() {
-		// warning: WMStore.topMargin must already be set by the MenuBar component's onmounted event handler
-		WMStore.RegisterClientSize(document.documentElement.clientWidth, document.documentElement.clientHeight - WMStore.topMargin)
+		WMStore.RegisterClientSize(document.documentElement.clientWidth, document.documentElement.clientHeight)
 	}
 
 	const getDBSnippet = (params: string): void => {
@@ -129,13 +126,13 @@
 				:params="window.params"
 			/>
 		</VicavWinBox>
-
 	</div>
 </template>
 
 <style>
 	.wb-vicav {
 		background-color: rgb(168, 93, 143);
+		margin: 5px; /* must be in sync with windowMarginPx in WMStore */
 	}
 	.wb-vicav .wb-header {
 		height: 25px;
diff --git a/store/wm.ts b/store/wm.ts
index daa0915..3a37063 100644
--- a/store/wm.ts
+++ b/store/wm.ts
@@ -12,9 +12,10 @@ export const useWMStore = defineStore(
 		const clientSizeHeight = ref(0)
 		const RegisterClientSize = (width: number, height: number) => {
 			clientSizeWidth.value = width
-			clientSizeHeight.value = height
+			clientSizeHeight.value = height - topMargin.value
 		}
 
+		const windowMarginPx = ref(5) // must be in sync with css class .wb-vicav in WindowManager.vue
 		const counter = ref(0)
 		const windowList = ref([] as IWindow[])
 		const newWindow = ref(null as INewWindow|null)
@@ -57,7 +58,7 @@ export const useWMStore = defineStore(
 		const ArrangeAllMaximize = () => {
 			windowList.value.forEach((w, i) => {
 				w.ref
-					.resize(clientSizeWidth.value, clientSizeHeight.value)
+					.resize(clientSizeWidth.value - 2 * windowMarginPx.value, clientSizeHeight.value - 2 * windowMarginPx.value)
 					.move(0, topMargin.value)
 			})
 		}
@@ -76,7 +77,7 @@ export const useWMStore = defineStore(
 				let newX = windowWidth * (i % cols),
 					newY = topMargin.value + windowHeight * Math.floor(i / cols)
 				w.ref
-					.resize(windowWidth, windowHeight)
+					.resize(windowWidth - 2 * windowMarginPx.value, windowHeight - 2 * windowMarginPx.value)
 					.move(newX, newY)
 					.addClass('no-min').addClass('no-max').addClass('no-full').addClass('no-resize').addClass('no-move')
 			})
@@ -100,7 +101,7 @@ export const useWMStore = defineStore(
 				let windowWidth = Math.floor(clientSizeWidth.value / (i > upperBlockSize - 1 ? floorSqrtN : floorSqrtN + 1))
 				let windowHeight = Math.floor(clientSizeHeight.value / (isExtraRow ? floorSqrtN + 1 : floorSqrtN))
 				w.ref
-					.resize(windowWidth, windowHeight)
+					.resize(windowWidth - 2 * windowMarginPx.value, windowHeight - 2 * windowMarginPx.value)
 					.move(windowWidth * colNum, topMargin.value + windowHeight * rowNum)
 					.addClass('no-min').addClass('no-max').addClass('no-full').addClass('no-resize').addClass('no-move')
 			})
@@ -119,7 +120,7 @@ export const useWMStore = defineStore(
 				let newX = i * 40 > clientSizeWidth.value - windowWidth ? clientSizeWidth.value - windowWidth : i * 40
 				let newY = topMargin.value + (i * 40 > clientSizeHeight.value - windowHeight ? clientSizeHeight.value - windowHeight : i * 40)
 				w.ref
-					.resize(windowWidth, windowHeight)
+					.resize(windowWidth - 2 * windowMarginPx.value, windowHeight - 2 * windowMarginPx.value)
 					.move(newX, newY)
 					.addClass('no-min').addClass('no-max').addClass('no-full').addClass('no-resize').addClass('no-move')
 			})

From b465d38a5e6e38ddad51c57ff6291753a0b2df1c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lev=20Z=20Kir=C3=A1ly?= <LeventeZoltan.Kiraly@oeaw.ac.at>
Date: Sun, 1 Oct 2023 22:32:14 +0200
Subject: [PATCH 2/8] Add windowTypeId to window title #45

---
 components/WindowManager.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/components/WindowManager.vue b/components/WindowManager.vue
index 40381a5..60c3b63 100644
--- a/components/WindowManager.vue
+++ b/components/WindowManager.vue
@@ -46,7 +46,7 @@
 			ref: null,
 			type: windowType as IWindowType,
 			winBoxOptions: {
-				title: newWindow.title,
+				title: '[' + newWindow.windowTypeId + '] ' + newWindow.title,
 				top: WMStore.topMargin,
 				class: windowClasses,
 			},

From ad94fac635f067231a730011312db6f881e8e960 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lev=20Z=20Kir=C3=A1ly?= <LeventeZoltan.Kiraly@oeaw.ac.at>
Date: Sun, 1 Oct 2023 22:35:22 +0200
Subject: [PATCH 3/8] Fix arrange bug when resizing clientarea #45

---
 store/wm.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/store/wm.ts b/store/wm.ts
index 3a37063..852195d 100644
--- a/store/wm.ts
+++ b/store/wm.ts
@@ -13,6 +13,7 @@ export const useWMStore = defineStore(
 		const RegisterClientSize = (width: number, height: number) => {
 			clientSizeWidth.value = width
 			clientSizeHeight.value = height - topMargin.value
+			ArrangeWindows()
 		}
 
 		const windowMarginPx = ref(5) // must be in sync with css class .wb-vicav in WindowManager.vue

From 754b8768e678f4cf6a1fefd49b3dd26a92c30b09 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lev=20Z=20Kir=C3=A1ly?= <LeventeZoltan.Kiraly@oeaw.ac.at>
Date: Sun, 1 Oct 2023 22:47:05 +0200
Subject: [PATCH 4/8] Fix padding bug in WMap windows #45

---
 components/DictEntry.vue     | 8 +++++++-
 components/DictQuery.vue     | 4 ++++
 components/Text.vue          | 8 +++++++-
 components/WindowManager.vue | 2 +-
 4 files changed, 19 insertions(+), 3 deletions(-)

diff --git a/components/DictEntry.vue b/components/DictEntry.vue
index 86598c6..633431a 100644
--- a/components/DictEntry.vue
+++ b/components/DictEntry.vue
@@ -1,5 +1,5 @@
 <template>
-	<div v-html="htmlContents"></div>
+	<div v-html="htmlContents" class="vv-dict-entry"></div>
 </template>
 
 <script setup lang="ts">
@@ -29,3 +29,9 @@
 
 	htmlContents.value = await GetDictEntry()
 </script>
+
+<style>
+	.vv-dict-entry {
+		padding: 20px;
+	}
+</style>
diff --git a/components/DictQuery.vue b/components/DictQuery.vue
index 9fc05f5..4eed9a8 100644
--- a/components/DictQuery.vue
+++ b/components/DictQuery.vue
@@ -107,6 +107,10 @@
 </template>
 
 <style lang="scss" scoped>
+.vv-dict-query {
+	padding: 20px;
+}
+
 .biblQueryBtn, .crossDictQueryBtn {
     width: 300px;
     height: 40px;
diff --git a/components/Text.vue b/components/Text.vue
index 152bcc9..d835ca7 100644
--- a/components/Text.vue
+++ b/components/Text.vue
@@ -1,5 +1,5 @@
 <template>
-	<div v-html="htmlContents"></div>
+	<div v-html="htmlContents" class="vv-text"></div>
 </template>
 
 <script setup lang="ts">
@@ -21,3 +21,9 @@
 
 	htmlContents.value = await GetText()
 </script>
+
+<style>
+	.vv-text {
+		padding: 20px;
+	}
+</style>
diff --git a/components/WindowManager.vue b/components/WindowManager.vue
index 60c3b63..45f3991 100644
--- a/components/WindowManager.vue
+++ b/components/WindowManager.vue
@@ -146,7 +146,7 @@
 	.wb-vicav .wb-body {
 		top: 25px;
 		margin: 0;
-		padding: 20px;
+		/* padding: */ /* each content type should set the padding itself; standard is 20px */
 		background-color: #fff;
 	}
 

From 4c245ffbcf3ad50a0b77462c5ffb0696102398e5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lev=20Z=20Kir=C3=A1ly?= <LeventeZoltan.Kiraly@oeaw.ac.at>
Date: Mon, 2 Oct 2023 16:06:30 +0200
Subject: [PATCH 5/8] Sanitize links in Text windows (WIP) #45

---
 components/Text.vue          | 23 ++++++++++++++++++++++-
 components/WindowManager.vue | 35 -----------------------------------
 2 files changed, 22 insertions(+), 36 deletions(-)

diff --git a/components/Text.vue b/components/Text.vue
index d835ca7..90badde 100644
--- a/components/Text.vue
+++ b/components/Text.vue
@@ -1,5 +1,5 @@
 <template>
-	<div v-html="htmlContents" class="vv-text"></div>
+	<div v-html="htmlContents" class="vv-text" :id="domId"></div>
 </template>
 
 <script setup lang="ts">
@@ -8,6 +8,8 @@
 	const htmlContents: Ref<string | undefined> = ref("")
 	const props = defineProps(['params'])
 
+	const domId = 'id-' + Math.floor(Math.random() * 1000000)
+
 	const GetText = async () => {
 		const { $api } = useNuxtApp()
 		const id = String(props.params.id)
@@ -19,7 +21,26 @@
 		}
 	}
 
+	const SanitizeLinks = () => {
+		document.querySelectorAll(`#${domId} .aVicText`)
+		.forEach(a => {
+			let targetType = a.getAttribute('data-target-type'),
+				textId = a.getAttribute('data-text-id')
+			console.log('Link', targetType, textId)
+			if (targetType == 'external-link') {
+				return
+			}
+			a.addEventListener("click", e => {
+				e.preventDefault()
+				console.log(`You clicked a link, target-type: ${targetType}, text-id: ${textId}`)
+			}, false)
+		})
+	}
+
 	htmlContents.value = await GetText()
+	onMounted(() => {
+		SanitizeLinks()
+	})
 </script>
 
 <style>
diff --git a/components/WindowManager.vue b/components/WindowManager.vue
index 45f3991..3c83552 100644
--- a/components/WindowManager.vue
+++ b/components/WindowManager.vue
@@ -71,44 +71,9 @@
 		WMStore.RegisterClientSize(document.documentElement.clientWidth, document.documentElement.clientHeight)
 	}
 
-	const getDBSnippet = (params: string): void => {
-		// TODO: create a method in a "legacy vicav" helper plugin that returns a { windowTypeId, windowName, windowParams } object
-		// based on the getDBSnippet parameter
-		console.log('getDBSnippet: ', params)
-
-		let splitPoint = params.indexOf(":")
-		let sHead = params.substring(0, splitPoint)
-		let sTail = params.substring(splitPoint + 1)
-		let sh = sTail.split("/")
-		let snippetID = sh[0].trim()
-		let secLabel = ""
-		if (!!sh[1]) {
-			secLabel = sh[1].trim()
-			secLabel = secLabel.replace(/_/g, " ")
-		}
-		let sid = null;
-		let dict = null;
-		switch (sHead) {
-			case "dictID":
-				let st5 = sTail.split(",");
-				sid = st5[0];
-				dict = st5[1];
-				WMStore.Open('DictEntry', sid + ': ' + dict, { dict, sid })
-				console.log ('getDBSnippet: dictID,', { dict, sid })
-				break;
-			case "text":
-				WMStore.Open('Text', secLabel, { id: snippetID })
-				break;
-			default:
-				console.warn("getDBSnippet: sHead type unknown [" + sHead + "]")
-				break;
-		}
-	}
-
 	onMounted(() =>{
 		RegisterClientSize()
 		window.addEventListener('resize', RegisterClientSize, true)
-		window.getDBSnippet = getDBSnippet
 	})
 </script>
 

From f9522a163c1b4e0b0b9782e4760703939be1ad4f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lev=20Z=20Kir=C3=A1ly?= <LeventeZoltan.Kiraly@oeaw.ac.at>
Date: Tue, 3 Oct 2023 21:05:20 +0200
Subject: [PATCH 6/8] Increase window box-shadow #45

---
 components/WindowManager.vue | 1 +
 1 file changed, 1 insertion(+)

diff --git a/components/WindowManager.vue b/components/WindowManager.vue
index 3c83552..66dc208 100644
--- a/components/WindowManager.vue
+++ b/components/WindowManager.vue
@@ -98,6 +98,7 @@
 	.wb-vicav {
 		background-color: rgb(168, 93, 143);
 		margin: 5px; /* must be in sync with windowMarginPx in WMStore */
+		box-shadow: 0 0 28px rgba(0,0,0,.22),0 0 10px rgba(0,0,0,.76);
 	}
 	.wb-vicav .wb-header {
 		height: 25px;

From c37ab521c652936fed0e68cfce7de88a203f9fbc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lev=20Z=20Kir=C3=A1ly?= <LeventeZoltan.Kiraly@oeaw.ac.at>
Date: Tue, 3 Oct 2023 21:53:41 +0200
Subject: [PATCH 7/8] Finish SanitizeLinks, move to WMStore and add
 getDbSnippets temporarily #45

---
 components/DictEntry.vue |  9 +++++-
 components/DictQuery.vue |  9 ++++--
 components/Text.vue      | 25 ++++-------------
 store/wm.ts              | 60 ++++++++++++++++++++++++++++++++++++++++
 4 files changed, 80 insertions(+), 23 deletions(-)

diff --git a/components/DictEntry.vue b/components/DictEntry.vue
index 633431a..932f534 100644
--- a/components/DictEntry.vue
+++ b/components/DictEntry.vue
@@ -1,9 +1,10 @@
 <template>
-	<div v-html="htmlContents" class="vv-dict-entry"></div>
+	<div v-html="htmlContents" class="vv-dict-entry" :id="domId"></div>
 </template>
 
 <script setup lang="ts">
 	import { Ref } from "@vue/runtime-dom"
+	import { useWMStore } from '~~/store/wm'
 
 	const htmlContents: Ref<string | undefined> = ref("")
 	const props = defineProps<{
@@ -28,6 +29,12 @@
 	}
 
 	htmlContents.value = await GetDictEntry()
+
+	const domId = 'id-' + Math.floor(Math.random() * 1000000)
+	const WMStore = useWMStore()
+	onMounted(() => {
+		WMStore.SanitizeLinks(domId)
+	})
 </script>
 
 <style>
diff --git a/components/DictQuery.vue b/components/DictQuery.vue
index 4eed9a8..4151691 100644
--- a/components/DictQuery.vue
+++ b/components/DictQuery.vue
@@ -63,12 +63,17 @@
 
 	const resultHtml: Ref<string | undefined> = ref('')
 
+	const domId = 'id-' + Math.floor(Math.random() * 1000000)
+    const WMStore = useWMStore()
+
 	const QueryButtonClicked = async (e: Event) => {
 		e.preventDefault()
 		resultHtml.value = await QueryDictionaries()
+		nextTick(() => {
+			WMStore.SanitizeLinks(domId)
+		})
 	}
 
-    const WMStore = useWMStore()
 	const OpenExamples = (e: Event) => {
 		e.preventDefault()
 		WMStore.Open('Text', 'textQuery: TUNICO DICTIONARY', { id: 'dictFrontPage_Tunis', customClass: 'vicav-cover-page' })
@@ -102,7 +107,7 @@
 			For details as to how to formulate meaningful dictionary queries consult the
 			<a class="aVicText" href="" @click="OpenExamples">examples of the TUNICO dictionary</a>.
 		</p>
-		<div v-html="resultHtml"></div>
+		<div v-html="resultHtml" :id="domId"></div>
 	</div>
 </template>
 
diff --git a/components/Text.vue b/components/Text.vue
index 90badde..f6987b9 100644
--- a/components/Text.vue
+++ b/components/Text.vue
@@ -4,12 +4,11 @@
 
 <script setup lang="ts">
 	import { Ref } from "@vue/runtime-dom"
+	import { useWMStore } from '~~/store/wm'
 
 	const htmlContents: Ref<string | undefined> = ref("")
 	const props = defineProps(['params'])
 
-	const domId = 'id-' + Math.floor(Math.random() * 1000000)
-
 	const GetText = async () => {
 		const { $api } = useNuxtApp()
 		const id = String(props.params.id)
@@ -20,26 +19,12 @@
 			console.error(error)
 		}
 	}
-
-	const SanitizeLinks = () => {
-		document.querySelectorAll(`#${domId} .aVicText`)
-		.forEach(a => {
-			let targetType = a.getAttribute('data-target-type'),
-				textId = a.getAttribute('data-text-id')
-			console.log('Link', targetType, textId)
-			if (targetType == 'external-link') {
-				return
-			}
-			a.addEventListener("click", e => {
-				e.preventDefault()
-				console.log(`You clicked a link, target-type: ${targetType}, text-id: ${textId}`)
-			}, false)
-		})
-	}
-
 	htmlContents.value = await GetText()
+
+	const domId = 'id-' + Math.floor(Math.random() * 1000000)
+	const WMStore = useWMStore()
 	onMounted(() => {
-		SanitizeLinks()
+		WMStore.SanitizeLinks(domId)
 	})
 </script>
 
diff --git a/store/wm.ts b/store/wm.ts
index 852195d..61b4e17 100644
--- a/store/wm.ts
+++ b/store/wm.ts
@@ -173,6 +173,64 @@ export const useWMStore = defineStore(
 			}
 		}
 
+		const SanitizeLinks = (domId: string) => {
+			console.log('SanitizeLinks starts')
+			document.querySelectorAll(`#${domId} a`)
+			.forEach(a => {
+				console.log("SanitizeLinks focuses at:", a)
+				if (a instanceof HTMLAnchorElement) {
+					let targetType = a.getAttribute('data-target-type') as string,
+						textId = a.getAttribute('data-text-id') as string
+					console.log("SanitizeLinks found this:", targetType, textId)
+					a.addEventListener("click", e => {
+						let windowTitle = e.target.innerText
+						console.log(`You clicked a link, target-type: ${targetType}, text-id: ${textId}, reference text: ${windowTitle}`)
+						if (targetType == 'external-link') {
+							return
+						}
+						e.preventDefault()
+						if (targetType == null || textId == null) {
+							GetDbSnippet_YesThisIsDeprecatedAndWillBeRemovedASAP(a.href.split("\"")[1])
+							return
+						}
+						Open(targetType.charAt(0).toUpperCase() + targetType.slice(1), windowTitle, { id: textId })
+					}, false)
+				}
+			})
+		}
+
+		const GetDbSnippet_YesThisIsDeprecatedAndWillBeRemovedASAP = (params: string) => {
+			let splitPoint = params.indexOf(":")
+			let sHead = params.substring(0, splitPoint)
+			let sTail = params.substring(splitPoint + 1)
+			let sh = sTail.split("/")
+			let snippetID = sh[0].trim()
+			let secLabel = ""
+			if (!!sh[1]) {
+				secLabel = sh[1].trim()
+				secLabel = secLabel.replace(/_/g, " ")
+			}
+			let sid = null;
+			let dict = null;
+			switch (sHead) {
+				case "dictID":
+					let st5 = sTail.split(",");
+					sid = st5[0];
+					dict = st5[1];
+					Open ('DictEntry', sid + ': ' + dict, { dict, sid })
+					console.log('getDBSnippet: dictID,', { dict, sid })
+					break;
+				case "text":
+					Open('Text', secLabel, { id: snippetID })
+					console.log('getDBSnippet: text,', secLabel, { id: snippetID })
+					break;
+				default:
+					console.warn("getDBSnippet: sHead type unknown [" + sHead + "]")
+					break;
+			}
+		}
+	
+
 		return {
 			topMargin,
 			SetTopMargin,
@@ -189,6 +247,8 @@ export const useWMStore = defineStore(
 			desktopArrangeMethods,
 			SelectDesktopArrangeMethod,
 			selectedDesktopArrangeMethodId,
+
+			SanitizeLinks,
 		}
 	},
 	{

From 46323c6ca30f3cfdf8d7caa533210458e31a36a8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lev=20Z=20Kir=C3=A1ly?= <LeventeZoltan.Kiraly@oeaw.ac.at>
Date: Tue, 3 Oct 2023 21:59:45 +0200
Subject: [PATCH 8/8] Fix DictEntry api query #45

---
 components/DictEntry.vue | 6 ++----
 store/wm.ts              | 3 ++-
 2 files changed, 4 insertions(+), 5 deletions(-)

diff --git a/components/DictEntry.vue b/components/DictEntry.vue
index 932f534..57af856 100644
--- a/components/DictEntry.vue
+++ b/components/DictEntry.vue
@@ -17,12 +17,10 @@
 	const GetDictEntry = async () => {
 		const { $api } = useNuxtApp()
 		const id = String(props.params.sid)
-		const dict = String(props.params.sid)
+		const dict = String(props.params.dict)
 		$api.baseUrl = ("" + import.meta.env.VITE_APIBASEURL);
 		try {
-			// TODO: add GetDictEntry to api
-			// return (await $api.vicav.getDictEntry({id, dict})).text()
-			return `Error showing dictionary entry for dict=${dict}&id=${id} – api is missing`
+			return (await $api.restvle.getDictDictNameEntry(dict, id)).text()
 		} catch (error) {
 			console.error(error)
 		}
diff --git a/store/wm.ts b/store/wm.ts
index 61b4e17..5372fa9 100644
--- a/store/wm.ts
+++ b/store/wm.ts
@@ -200,6 +200,7 @@ export const useWMStore = defineStore(
 		}
 
 		const GetDbSnippet_YesThisIsDeprecatedAndWillBeRemovedASAP = (params: string) => {
+			console.log('getDBSnippet input: ', params)
 			let splitPoint = params.indexOf(":")
 			let sHead = params.substring(0, splitPoint)
 			let sTail = params.substring(splitPoint + 1)
@@ -217,7 +218,7 @@ export const useWMStore = defineStore(
 					let st5 = sTail.split(",");
 					sid = st5[0];
 					dict = st5[1];
-					Open ('DictEntry', sid + ': ' + dict, { dict, sid })
+					Open ('DictEntry', dict + ': ' + sid, { dict, sid })
 					console.log('getDBSnippet: dictID,', { dict, sid })
 					break;
 				case "text":