Tracking de l'application VApp (IHM du jeu)

VApp/src/plugins/README.md

@@ -0,0 +1,3 @@
+# Plugins
+
+Plugins are a way to extend the functionality of your Vue application. Use this folder for registering plugins that you want to use globally.

VApp/src/plugins/index.js

@@ -0,0 +1,14 @@
+/**
+ * plugins/index.js
+ *
+ * Automatically included in `./src/main.js`
+ */
+
+// Plugins
+import vuetify from './vuetify'
+import router from './router'
+
+export function registerPlugins (app) {
+  app.use(vuetify)
+  app.use(router)
+}

VApp/src/plugins/router.js

@@ -0,0 +1,33 @@
+import { createRouter, createWebHistory } from 'vue-router'
+import HomeView from '../views/HomeView.vue'
+
+const router = createRouter({
+  history: createWebHistory(import.meta.env.BASE_URL),
+  routes: [ {   
+    path: '/',   
+    name: 'Accueil',   
+    component: HomeView 
+  }, 
+  {   
+    path: '/game/control',  
+    name: 'Game Control (Présentateur)',   
+    component: () => import('@/views/GameControl.vue') 
+  }, 
+  {   
+    path: '/game/display',   
+    name: 'Game Display (Projection)',   
+    component: () => import('@/views/GameDisplay.vue') 
+  }, 
+  {   
+    path: '/mqtt-debugger',   
+    name: 'Debugger MQTT',   
+    component: () => import('@/views/MQTTDebugView.vue') 
+  }, 
+  {   
+    path: '/settings',   
+    name: 'Paramètres',   
+    component: () => import('@/views/SettingsView.vue') }
+  ]
+})
+
+export default router

VApp/src/plugins/vuetify.js

@@ -0,0 +1,59 @@
+/**
+ * plugins/vuetify.js
+ *
+ * Framework documentation: https://vuetifyjs.com`
+ */
+
+// Styles
+import '@mdi/font/css/materialdesignicons.css'
+import 'vuetify/styles'
+
+// Composables
+import { createVuetify } from 'vuetify'
+
+const CustomThemeDark = {
+  dark: true,
+  colors: { 
+    background: '#121212', 
+    primary: '#d42828', 
+    secondary: '#F44336', 
+    accent: '#FFC107', 
+    error: '#e91e1e', 
+    warning: '#FFC107', 
+    info: '#607D8B', 
+    success: '#15B01B', 
+    BlueBuzzer: '#2867d4', 
+    YellowBuzzer: '#D4D100', 
+    RedBuzzer: '#d42828', 
+    GreenBuzzer: '#28d42e',
+    DisconnectedBuzzer: '#595959',
+  }
+}
+const CustomThemeLight = {
+  dark: false,
+  colors: { 
+    background: '#ffffff', 
+    primary: '#d42828', 
+    secondary: '#F44336', 
+    accent: '#FFC107', 
+    error: '#e91e1e', 
+    warning: '#FFC107', 
+    info: '#607D8B', 
+    success: '#4CAF50', 
+    BlueBuzzer: '#2867d4', 
+    YellowBuzzer: '#D4D100', 
+    RedBuzzer: '#d42828', 
+    GreenBuzzer: '#28d42e',
+    DisconnectedBuzzer: '#595959',
+  }
+}
+
+// https://vuetifyjs.com/en/introduction/why-vuetify/#feature-guides
+export default createVuetify({
+  theme: { 
+    defaultTheme: 'CustomThemeDark', 
+    themes: {   
+      CustomThemeDark,   
+      CustomThemeLight, },
+  },
+})