feat: added autoplay setting (#1303)

closes https://github.com/elk-zone/elk/issues/1235
zio/stable
Niklas Wolf 2023-01-19 19:33:50 +01:00 committed by GitHub
parent 33b5947170
commit 126619be92
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 13 additions and 1 deletions

View File

@ -65,9 +65,11 @@ const video = ref<HTMLVideoElement | undefined>()
const prefersReducedMotion = usePreferredReducedMotion()
const isAudio = $computed(() => attachment.type === 'audio')
const enableAutoplay = usePreferences('enableAutoplay')
useIntersectionObserver(video, (entries) => {
const ready = video.value?.dataset.ready === 'true'
if (prefersReducedMotion.value === 'reduce') {
if (prefersReducedMotion.value === 'reduce' || !enableAutoplay.value) {
if (ready && !video.value?.paused)
video.value?.pause()

View File

@ -8,6 +8,7 @@ export interface PreferencesSettings {
hideFavoriteCount: boolean
hideFollowerCount: boolean
grayscaleMode: boolean
enableAutoplay: boolean
experimentalVirtualScroller: boolean
experimentalGitHubCards: boolean
experimentalUserPicker: boolean
@ -58,6 +59,7 @@ export const DEFAULT__PREFERENCES_SETTINGS: PreferencesSettings = {
hideFavoriteCount: false,
hideFollowerCount: false,
grayscaleMode: false,
enableAutoplay: true,
experimentalVirtualScroller: true,
experimentalGitHubCards: true,
experimentalUserPicker: true,

View File

@ -330,6 +330,7 @@
},
"notifications_settings": "Benachrichtigungen",
"preferences": {
"enable_autoplay": "Autoplay aktivieren",
"github_cards": "GitHub Cards",
"hide_boost_count": "Boost-Zähler ausblenden",
"hide_favorite_count": "Favoritenzahl ausblenden",

View File

@ -366,6 +366,7 @@
},
"notifications_settings": "Notifications",
"preferences": {
"enable_autoplay": "Enable Autoplay",
"github_cards": "GitHub Cards",
"grayscale_mode": "Grayscale mode",
"hide_boost_count": "Hide boost count",

View File

@ -39,6 +39,12 @@ const userSettings = useUserSettings()
>
{{ $t('settings.preferences.grayscale_mode') }}
</SettingsToggleItem>
<SettingsToggleItem
:checked="getPreferences(userSettings, 'enableAutoplay')"
@click="togglePreferences('enableAutoplay')"
>
{{ $t('settings.preferences.enable_autoplay') }}
</SettingsToggleItem>
<h2 px6 py4 mt2 font-bold text-xl flex="~ gap-1" items-center>
<div i-ri-flask-line />
{{ $t('settings.preferences.title') }}