mirror/elk
1
0
Fork 0
mirror of https://github.com/elk-zone/elk synced 2024-11-27 14:28:10 +09:00
Code

feat: added autoplay setting (#1303)

Browse Source 
closes https://github.com/elk-zone/elk/issues/1235
This commit is contained in:
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
components/status/StatusAttachment.vue
View File

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

2
composables/settings/definition.ts
View File

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

1
locales/de-DE.json
View File

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

1
locales/en-US.json
View File

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

6
pages/settings/preferences/index.vue
View File

@ -39,6 +39,12 @@ const userSettings = useUserSettings()
> >
{{ $t('settings.preferences.grayscale_mode') }} {{ $t('settings.preferences.grayscale_mode') }}
</SettingsToggleItem> </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> <h2 px6 py4 mt2 font-bold text-xl flex="~ gap-1" items-center>
<div i-ri-flask-line /> <div i-ri-flask-line />
{{ $t('settings.preferences.title') }} {{ $t('settings.preferences.title') }}