From 59470f5396c7864386dc1eaa61c65a7d6d12fb3b Mon Sep 17 00:00:00 2001
From: Tobias Zoghaib <tobias.zoghaib@stud.uni-hannover.de>
Date: Thu, 17 Oct 2024 19:10:21 +0200
Subject: [PATCH] Add addressbar

---
 software/src/App.vue                          |  5 +-
 software/src/components/navigation/urlBar.vue | 62 +++++++++++++++++++
 2 files changed, 65 insertions(+), 2 deletions(-)
 create mode 100644 software/src/components/navigation/urlBar.vue

diff --git a/software/src/App.vue b/software/src/App.vue
index a42311f..5977f53 100644
--- a/software/src/App.vue
+++ b/software/src/App.vue
@@ -6,12 +6,11 @@ import navigationAppendItems from './components/navigation/navigationAppendItems
 import navigationPrependItems from './components/navigation/navigationPrependItems.vue';
 import { usePreferencesStore } from './data/stores/preferencesStore';
 import { useFeedbackStore } from './data/stores/feedbackStore';
-import { useShoppingStore } from './data/stores/shoppingStore';
 import footerItems from './components/navigation/footerItems.vue';
+import urlBar from './components/navigation/urlBar.vue';
 
 const preferencesStore = usePreferencesStore()
 const feedbackStore = useFeedbackStore()
-const shoppingStore = useShoppingStore()
 const theme = useTheme()
 
 theme.global.name.value = preferencesStore.theme
@@ -25,6 +24,8 @@ watch(() => preferencesStore.language, () => {
 
 <template>
   <v-app>
+    <url-bar />
+    
     <v-app-bar
       height="80"
       color="primary" 
diff --git a/software/src/components/navigation/urlBar.vue b/software/src/components/navigation/urlBar.vue
new file mode 100644
index 0000000..e4fa256
--- /dev/null
+++ b/software/src/components/navigation/urlBar.vue
@@ -0,0 +1,62 @@
+<script setup lang="ts">
+import { ref, watch } from 'vue';
+import { useRouter } from 'vue-router';
+
+const router = useRouter()
+const path = ref(router.currentRoute.value.fullPath)
+
+function navigate() {
+  router.replace({ path: path.value.substring(path.value.indexOf('.com') + 4) })
+}
+
+watch(() => router.currentRoute.value.fullPath, () => {
+  path.value = "https://www.eventmaster.com" + router.currentRoute.value.fullPath
+})
+</script>
+
+<template>
+  <v-app-bar
+    elevation="0"
+    height="50"
+  >
+    <v-row>
+      <v-col></v-col>
+      <v-col cols="auto" class="d-flex justify-start align-center">
+        <v-btn
+          density="comfortable"
+          icon="mdi-arrow-left"
+          @click="router.go(-1)"
+        />
+        <v-btn
+          density="comfortable"
+          icon="mdi-arrow-right"
+          @click="router.go(1)"
+        />
+        <v-btn
+          density="comfortable"
+          icon="mdi-refresh"
+          @click="router.replace({ path: router.currentRoute.value.fullPath })"
+        />
+      </v-col>
+
+      <v-col cols="8">
+        <v-text-field
+          variant="outlined"
+          density="compact"
+          hide-details
+          @keyup.enter="navigate"
+          v-model="path"
+        />
+      </v-col>
+
+      <v-col cols="2" class="d-flex justify-start align-center">
+        <v-btn
+          density="comfortable"
+          icon="mdi-arrow-right"
+          @click="navigate"
+        />
+      </v-col>
+
+    </v-row>
+  </v-app-bar>
+</template>
\ No newline at end of file