0
Fork 0
mirror of https://codeberg.org/SafeTwitch/safetwitch.git synced 2025-01-08 22:00:14 -05:00

feat(video): added button to actuall call theatre mode

This commit is contained in:
Seraph91P 2024-08-06 19:57:04 +02:00
parent 2681bfe10f
commit ca7b639a45
2 changed files with 22 additions and 4 deletions

View file

@ -12,6 +12,7 @@ import AudioPlayer from '@/components/AudioPlayer.vue'
import AboutTab from '@/components/user/AboutTab.vue' import AboutTab from '@/components/user/AboutTab.vue'
import ShareModal from '@/components/popups/ShareButtonModal.vue' import ShareModal from '@/components/popups/ShareButtonModal.vue'
import VueTitle from '@/components/VueTitle.vue' import VueTitle from '@/components/VueTitle.vue'
import TheatreModeToggle from '@/components/TheatreModeToggle.vue'
import type { StreamerData } from '@/types' import type { StreamerData } from '@/types'
import { truncate, abbreviate, getEndpoint } from '@/mixins' import { truncate, abbreviate, getEndpoint } from '@/mixins'
@ -43,7 +44,8 @@ export default {
status, status,
videoOptions, videoOptions,
audioOptions, audioOptions,
shareModalVisible: ref(false) shareModalVisible: ref(false),
isTheatreMode: ref(false)
} }
}, },
async mounted() { async mounted() {
@ -73,7 +75,8 @@ export default {
AudioPlayer, AudioPlayer,
AboutTab, AboutTab,
ShareModal, ShareModal,
VueTitle VueTitle,
TheatreModeToggle
}, },
methods: { methods: {
truncate, truncate,
@ -81,6 +84,9 @@ export default {
getSetting, getSetting,
toggleShareModal() { toggleShareModal() {
this.shareModalVisible = !this.shareModalVisible this.shareModalVisible = !this.shareModalVisible
},
toggleTheatreMode() {
this.isTheatreMode = !this.isTheatreMode
} }
} }
} }
@ -188,6 +194,9 @@ export default {
<button @click="toggleShareModal" class="px-2 py-1.5 rounded-lg bg-purple"> <button @click="toggleShareModal" class="px-2 py-1.5 rounded-lg bg-purple">
<v-icon name="fa-share-alt"></v-icon> <v-icon name="fa-share-alt"></v-icon>
</button> </button>
<button @click="toggleTheatreMode" class="px-2 py-1.5 rounded-lg bg-purple">
<v-icon name="fa-expand"></v-icon>
</button>
</div> </div>
</div> </div>

View file

@ -9,6 +9,7 @@ import FollowButton from '@/components/FollowButton.vue'
import LoadingScreen from '@/components/LoadingScreen.vue' import LoadingScreen from '@/components/LoadingScreen.vue'
import AboutTab from '@/components/user/AboutTab.vue' import AboutTab from '@/components/user/AboutTab.vue'
import ShareModal from '@/components/popups/ShareButtonModal.vue' import ShareModal from '@/components/popups/ShareButtonModal.vue'
import TheatreModeToggle from '@/components/TheatreModeToggle.vue'
import type { Video } from '@/types' import type { Video } from '@/types'
import { truncate, abbreviate, getEndpoint } from '@/mixins' import { truncate, abbreviate, getEndpoint } from '@/mixins'
@ -41,7 +42,8 @@ export default {
status: ref<'ok' | 'error'>(), status: ref<'ok' | 'error'>(),
videoOptions, videoOptions,
time: ref(0), time: ref(0),
shareModalVisible: ref(false) shareModalVisible: ref(false),
isTheatreMode: ref(false)
} }
}, },
async mounted() { async mounted() {
@ -63,7 +65,8 @@ export default {
LoadingScreen, LoadingScreen,
AboutTab, AboutTab,
ShareModal, ShareModal,
VueTitle VueTitle,
TheatreModeToggle
}, },
methods: { methods: {
truncate, truncate,
@ -77,6 +80,9 @@ export default {
getSetting, getSetting,
toggleShareModal() { toggleShareModal() {
this.shareModalVisible = !this.shareModalVisible this.shareModalVisible = !this.shareModalVisible
},
toggleTheatreMode() {
this.isTheatreMode = !this.isTheatreMode
} }
} }
} }
@ -138,6 +144,9 @@ export default {
<button @click="toggleShareModal" class="px-2 py-1.5 rounded-lg bg-purple"> <button @click="toggleShareModal" class="px-2 py-1.5 rounded-lg bg-purple">
<v-icon name="fa-share-alt"></v-icon> <v-icon name="fa-share-alt"></v-icon>
</button> </button>
<button @click="toggleTheatreMode" class="px-2 py-1.5 rounded-lg bg-purple">
<v-icon name="fa-expand"></v-icon>
</button>
</div> </div>
</div> </div>