Introduce feature-toggles;

index.html

@@ -19,7 +19,7 @@
         <nav class="navbar navbar-expand-lg navbar-light bg-light">
             <a class="navbar-brand">
                 <img :src="dashboardLogo" alt="logo" class="logo-nav float-end" v-if="dashboardLogo"/>
-                <div>
+                <div v-if="experimental.trackWorktime">
                     <template v-if="worktimeTracker.tracking">
                         <i class="far fa-pause-circle"></i>
                         <i class="far fa-stop-circle" @click="stopTracking(worktimeTracker)"></i>
@@ -33,7 +33,7 @@
                 <h5 class="brand-title">Timetrack</h5>
             </a>
         </nav>
-        <div class="row" v-if="view === 'trackers'">
+        <div class="row" v-if="!experimental.boardView || view === 'trackers'">
             <div class="col-md-12">
                 <div class="row">
                     <template v-for="(ticket, ticketIndex) in tickets">
@@ -103,7 +103,7 @@
                 </div>
             </div>
         </div>
-        <div class="row" v-if="view === 'board'" id="board-view">
+        <div class="row" v-if="experimental.boardView && view === 'board'" id="board-view">
             <div class="col-4 col-board-inner">
                 <h5>Todo</h5>
                 <template v-for="(ticket, ticketIndex) in tickets">
@@ -639,6 +639,17 @@
                         <i class="fas fa-random"></i>
                     </a>
                 </div>
+                <div class="col" v-if="experimental.snippetSpace">
+                    <a type="button"
+                       class="btn btn-info text-light bottom-menu-item"
+                       data-toggle="modal"
+                       data-target="#switcherModal"
+                       data-bs-toggle="tooltip"
+                       data-bs-placement="top"
+                       title="Snippet Space">
+                        <i class="fas fa-code"></i>
+                    </a>
+                </div>
                 <div class="col">
                     <a type="button"
                        class="btn btn-dark text-light bottom-menu-item"

js/app.js

@@ -1,8 +1,13 @@
 const TimeTrack = {
     data() {
         return {
+            experimental: {
+                trackWorktime: false,
+                boardView: false,
+                snippetSpace: false
+            },
             view: 'board',
-            theme: 'quartz',
+            theme: 'materia',
             themes: null,
             dashboardLogo: 'assets/img/logo.png',
             ticketSystemUrl: '',
@@ -31,14 +36,14 @@ const TimeTrack = {
                 bad: [
                     'alert',
                     'wilhelm',
-                    'wtf',
+                    // 'wtf',
-                    'jesus_wtf'
+                    // 'jesus_wtf'
                 ],
                 animals: [
-                    'meow',
+                    // 'meow',
-                    'moo',
+                    // 'moo',
-                    'quack',
+                    // 'quack',
-                    'pika',
+                    // 'pika',
                     'transition'
                 ]
             },
@@ -405,7 +410,11 @@ const TimeTrack = {
                     message: 'Portal-Wechsel erfolgreich',
                     color: 'green'
                 });
+
+                if (vue.fun) {
                     playSound(oneOf(vue.sounds.animals));
+                }
+
                 vue.updateStorage();
             })
         },

js/components/ticket-card.js

@@ -1,4 +1,4 @@
-Vue.component('tracker-card', {
+app.component('tracker-card', {
   data: function () {
     return {
       count: 0