Address suggestions from #27

src/components/AudioPlayer.vue

@@ -6,6 +6,7 @@
 <script lang="ts">
 // Importing video-js
 import Hls from 'hls.js'
+import { getSetting } from '@/settingsManager'
 
 export default {
     name: 'VideoJsPlayer',
@@ -52,7 +53,9 @@ export default {
             hls.loadSource(this.audioOnlyManifest || "");
             hls.attachMedia(video);
             hls.on(Hls.Events.MANIFEST_PARSED, () => {
-                video.play();
+                if(getSetting("autoplay")) {
+                    video.play();
+                }
             });
         }
     }

src/locales

@@ -1 +1 @@
-Subproject commit 898c2d31e71f1962e8be067287055b50c960ec34
+Subproject commit 7327c0e819101f55885acde77512a5bf8eee2761

src/settingsManager.ts

@@ -42,6 +42,11 @@ export function getDefaultSettings() {
             name: 'streamerAboutSectionVisible',
             selected: true,
             type: 'checkbox'
+        },
+        autoplay: {
+            name: 'autoplay',
+            selected: false,
+            type: 'checkbox'
         }
     }
 }

src/views/SettingsView.vue

@@ -22,7 +22,9 @@ export default {
       const settings = JSON.stringify(this.settings)
       localStorage.setItem('settings', settings)
       setLanguage(this.settings.language.selected, this.$i18n)
-      window.location.reload()
+
+      // Reload needed
+      location.href = "/"
     }
     //     download() {
     //         var hiddenElement = document.createElement('a');

src/views/UserView.vue

@@ -23,7 +23,7 @@ export default {
     const status = ref<'ok' | 'error'>()
     const rootBackendUrl = inject('rootBackendUrl')
     const videoOptions = {
-      autoplay: true,
+      autoplay: getSetting("autoplay"),
       controls: true,
       sources: [
         {
@@ -71,7 +71,8 @@ export default {
   methods: {
     truncate,
     abbreviate,
-    chatVisible
+    chatVisible,
+    getSetting
   }
 }
 </script>
@@ -144,6 +145,7 @@ export default {
           <div v-else class="w-full">
             <ul
               class="text-xs font-bold text-left md:text-right space-x-1 space-y-1 overflow-y-auto"
+              v-if="getSetting('streamTagsVisible')"
             >
               <li
                 v-for="tag in data.stream!.tags"
@@ -168,7 +170,7 @@ export default {
       <video-tab class="mb-4"></video-tab>
 
       <!-- ABOUT TAB -->
-      <div class="bg-ctp-mantle mt-1 p-5 pt-3 rounded-lg w-full space-y-3">
+      <div v-if="getSetting('streamerAboutSectionVisible')" class="bg-ctp-mantle mt-1 p-5 pt-3 rounded-lg w-full space-y-3">
         <div class="inline-flex w-full">
           <span class="pr-3 font-bold text-3xl">{{ $t('streamer.about') }}</span>
         </div>

src/views/VodView.vue

@@ -10,7 +10,7 @@ import LoadingScreen from '@/components/LoadingScreen.vue'
 
 import type { Video } from '@/types'
 import { truncate, abbreviate, getEndpoint } from '@/mixins'
-import { chatVisible } from '@/settingsManager'
+import { chatVisible, getSetting } from '@/settingsManager'
 
 interface ChatComponent {
   updateVodComments: (time: number) => void
@@ -68,7 +68,8 @@ export default {
       const chat = this.$refs.chat as ChatComponent
       chat.updateVodComments(time)
     },
-    chatVisible
+    chatVisible,
+    getSetting
   }
 }
 </script>
@@ -118,7 +119,7 @@ export default {
       </div>
 
       <!-- ABOUT TAB -->
-      <div class="bg-ctp-mantle mt-1 p-5 pt-3 rounded-lg w-full space-y-3">
+      <div v-if="getSetting('streamerAboutSectionVisible')" class="bg-ctp-mantle mt-1 p-5 pt-3 rounded-lg w-full space-y-3">
         <div class="inline-flex w-full">
           <span class="pr-3 font-bold text-3xl">{{ $t('streamer.about') }}</span>
         </div>
@@ -139,7 +140,7 @@ export default {
     </div>
 
     <twitch-chat
-      v-if="chatVisible()"
+      v-if="getSetting('chatVisible')"
       :isVod="true"
       :channelName="data.streamer.login"
       ref="chat"