Ok next the backend refactor ig2

client/src/views/managers/GameManager.vue

@@ -57,10 +57,8 @@ function OpenDatabaseWindow(){
     CreateWindow('database');
 }
 
-watch(game, () => {
-    if(game.value && in_game.value){
-        AddSound(game.value);
-
+watch(in_game, () => {
+    if(in_game.value){
         // Check if we are dm
         is_dm.value = GetClient().is_dm;
     }

client/src/views/partials/FixedBottomButtons.vue

@@ -0,0 +1,29 @@
+<script setup>
+import IconButton from '@/views/partials/game/IconButton.vue'
+
+const props = defineProps(['plus', 'edit', 'view', 'remove']);
+
+let plus = props.plus;
+let edit = props.edit;
+let view = props.view;
+let remove = props.remove;
+</script>
+
+<template>
+<div class="fixed-bottom-buttons">
+    <IconButton v-show="plus" icon="/icons/iconoir/regular/plus.svg" :action="plus"></IconButton>
+    <IconButton v-show="edit" icon="/icons/iconoir/regular/edit-pencil.svg" :action="edit"></IconButton>
+    <IconButton v-show="view" icon="/icons/iconoir/solid/eye.svg" :action="view"></IconButton>
+    <IconButton v-show="remove" icon="/icons/iconoir/solid/trash.svg" :action="remove"></IconButton>
+</div>
+</template>
+
+<style lang="scss" scoped>
+.fixed-bottom-buttons {
+    position: absolute;
+    bottom: 10px;
+    right: 10px;
+    z-index: 2;
+    display: flex;
+}
+</style>

client/src/views/partials/MarkdownEditor.vue

@@ -3,8 +3,7 @@ import { onMounted, ref, watch } from 'vue';
 import { marked } from "https://cdn.jsdelivr.net/npm/marked/lib/marked.esm.js";
 
 const props = defineProps(['done', 'editable']);
-
-import IconButton from '../partials/game/IconButton.vue';
+import FixedBottomButtons from './FixedBottomButtons.vue';
 
 const editing = ref(false);
 const isEditable = ref(true);
@@ -62,17 +61,11 @@ defineExpose({
         <div v-show="!editing" class="preview">
             <div class="document" ref="preview">
             </div>
-
-            <div class="fixed-bottom-buttons">
-                <IconButton v-show="isEditable" icon="/icons/iconoir/regular/edit-pencil.svg" :action="EditContent"></IconButton>
-            </div>
+            <FixedBottomButtons v-show="isEditable" :edit="EditContent"></FixedBottomButtons>
         </div>
         <div v-show="editing" class="editor">
             <textarea class="editing" ref="editor"></textarea>
-            
-            <div class="fixed-bottom-buttons">
-                <IconButton v-show="isEditable" icon="/icons/iconoir/solid/eye.svg" :action="PreviewContent"></IconButton>
-            </div>
+            <FixedBottomButtons v-show="isEditable" :view="PreviewContent"></FixedBottomButtons>
         </div>
     </div>
 </div>
@@ -116,11 +109,4 @@ defineExpose({
     flex-direction: column;
     background-color: var(--color-background);
 }
-.fixed-bottom-buttons {
-    position: absolute;
-    bottom: 10px;
-    right: 10px;
-    z-index: 2;
-    display: flex;
-}
 </style>

client/src/views/windows/EditProfileWindow.vue

@@ -9,6 +9,7 @@ import BigIconTemplate from '@/views/partials/BigIconTemplate.vue';
 import { SetMinSize, SetResizable } from '@/services/Windows';
 import { backendUrl } from '@/services/BackendURL';
 import { GetUser } from '@/services/User';
+import FixedBottomButtons from '../partials/FixedBottomButtons.vue';
 
 const props = defineProps(['data']);
 const data = props.data;
@@ -35,6 +36,10 @@ onMounted(() => {
         else userIcon.value = "public/img/def-avatar.jpg";
     }).catch((err) => console.log("Internal error"));
 });
+
+function RemoveUser(){
+    alert("Remove")
+}
 </script>
 
 
@@ -43,10 +48,15 @@ onMounted(() => {
         <WindowHandle :window="id" ref="handle"></WindowHandle>
 
         <BigIconTemplate :title="data.user.username" :img="userIcon">
-            <div v-show="isAdmin">
-                Admin
+        <div v-if="props.data.editable || isAdmin">
+            
+        </div>
+        <div v-else>
+
         </div>
         </BigIconTemplate>
+
+        <FixedBottomButtons v-if="isAdmin" :remove="RemoveUser"></FixedBottomButtons>
     </div>
 </template>
 

client/src/views/windows/game/DatabaseWindow.vue

@@ -3,11 +3,11 @@ import WindowHandle from '@/views/partials/WindowHandle.vue';
 
 import { onMounted, ref, shallowRef, watch } from 'vue';
 import { ClearWindow, CreateWindow, ResetPosition, SetMinSize, SetResizable, SetSize, SetupHandle } from '@/services/Windows';
-import IconButton from '@/views/partials/game/IconButton.vue'
 import ConceptList from '@/views/partials/ConceptList.vue';
 import { FetchConcepts, GetConcepts } from '@/services/Data';
 import Tabs from '@/views/partials/Tabs.vue';
 import { GetCampaignModuleName } from '@/services/Campaign';
+import FixedBottomButtons from '@/views/partials/FixedBottomButtons.vue';
 
 const handle = ref(null);
 
@@ -90,10 +90,7 @@ function ElementIcon(element){
             </Tabs>
         </div>
 
-
-        <div class="fixed-bottom-buttons">
-            <IconButton icon="/icons/iconoir/regular/plus.svg" :action="OpenCreateItemPrompt"></IconButton>
-        </div>
+        <FixedBottomButtons :plus="OpenCreateItemPrompt"></FixedBottomButtons>
     </div>
 </template>
 

client/src/views/windows/settings/AccountManagementWindow.vue

@@ -7,12 +7,11 @@ import { onMounted, ref, shallowRef, toRaw } from 'vue';
 import { SetupHandle, SetSize, ResetPosition } from '@/services/Windows';
 import Api from '@/services/Api'
 
-import IconButton from '@/views/partials/game/IconButton.vue'
-
 import WindowHandle from '@/views/partials/WindowHandle.vue';
-import ConceptList from '../../partials/ConceptList.vue';
-import { backendUrl } from '../../../services/BackendURL';
-import { ClearWindow, CreateChildWindow, CreateWindow } from '../../../services/Windows';
+import ConceptList from '@/views/partials/ConceptList.vue';
+import { backendUrl } from '@/services/BackendURL';
+import { ClearWindow, CreateChildWindow } from '@/services/Windows';
+import FixedBottomButtons from '@/views/partials/FixedBottomButtons.vue';
 
 const handle = ref(null);
 
@@ -104,9 +103,7 @@ function OpenCreateAccount(){
             :open="OpenAccount"
         ></ConceptList>
 
-        <div class="fixed-bottom-buttons">
-            <IconButton icon="/icons/iconoir/regular/plus.svg" :action="OpenCreateAccount"></IconButton>
-        </div>
+        <FixedBottomButtons :plus="OpenCreateAccount"></FixedBottomButtons>
     </div>
 </template>
 
@@ -116,14 +113,6 @@ function OpenCreateAccount(){
     display: flex;
     align-items: center;
 }
-
-.fixed-bottom-buttons {
-    position: absolute;
-    bottom: 10px;
-    right: 10px;
-    z-index: 2;
-    display: flex;
-}
 </style>