From 0e5b74e3dd798703cf842257e528c85bc7c00121 Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Wed, 15 Aug 2018 12:51:21 +0300 Subject: [PATCH] Configurable video looping, option to not to loop silent videos. Updated localization strings. --- src/components/attachment/attachment.js | 18 ++++++++++++++++++ src/components/attachment/attachment.vue | 2 +- src/components/settings/settings.js | 20 ++++++++++++++++++-- src/components/settings/settings.vue | 21 ++++++++++++++++++++- src/i18n/messages.js | 13 ++++++++++--- src/modules/config.js | 3 +++ 6 files changed, 70 insertions(+), 7 deletions(-) diff --git a/src/components/attachment/attachment.js b/src/components/attachment/attachment.js index 775207c0..cc19714d 100644 --- a/src/components/attachment/attachment.js +++ b/src/components/attachment/attachment.js @@ -13,6 +13,7 @@ const Attachment = { return { nsfwImage, hideNsfwLocal: this.$store.state.config.hideNsfw, + loopVideo: this.$store.state.config.loopVideo, showHidden: false, loading: false, img: this.type === 'image' && document.createElement('img') @@ -59,6 +60,23 @@ const Attachment = { } else { this.showHidden = !this.showHidden } + }, + onVideoDataLoad (e) { + if (typeof e.srcElement.webkitAudioDecodedByteCount !== 'undefined') { + // non-zero if video has audio track + if (e.srcElement.webkitAudioDecodedByteCount > 0) { + this.loopVideo = this.loopVideo && !this.$store.state.config.loopVideoSilentOnly + } + } else if (typeof e.srcElement.mozHasAudio !== 'undefined') { + // true if video has audio track + if (e.srcElement.mozHasAudio) { + this.loopVideo = this.loopVideo && !this.$store.state.config.loopVideoSilentOnly + } + } else if (typeof e.srcElement.audioTracks !== 'undefined') { + if (e.srcElement.audioTracks.length > 0) { + this.loopVideo = this.loopVideo && !this.$store.state.config.loopVideoSilentOnly + } + } } } } diff --git a/src/components/attachment/attachment.vue b/src/components/attachment/attachment.vue index 66110de4..8342f34b 100644 --- a/src/components/attachment/attachment.vue +++ b/src/components/attachment/attachment.vue @@ -14,7 +14,7 @@ - + diff --git a/src/components/settings/settings.js b/src/components/settings/settings.js index e5f4b001..169b9080 100644 --- a/src/components/settings/settings.js +++ b/src/components/settings/settings.js @@ -1,3 +1,4 @@ +/* eslint-env browser */ import StyleSwitcher from '../style_switcher/style_switcher.vue' import { filter, trim } from 'lodash' @@ -7,12 +8,21 @@ const settings = { hideAttachmentsLocal: this.$store.state.config.hideAttachments, hideAttachmentsInConvLocal: this.$store.state.config.hideAttachmentsInConv, hideNsfwLocal: this.$store.state.config.hideNsfw, + loopVideoLocal: this.$store.state.config.loopVideo, + loopVideoSilentOnlyLocal: this.$store.state.config.loopVideoSilentOnly, muteWordsString: this.$store.state.config.muteWords.join('\n'), autoLoadLocal: this.$store.state.config.autoLoad, streamingLocal: this.$store.state.config.streaming, - pauseOnUnfocused: this.$store.state.config.pauseOnUnfocused, + pauseOnUnfocusedLocal: this.$store.state.config.pauseOnUnfocused, hoverPreviewLocal: this.$store.state.config.hoverPreview, - stopGifs: this.$store.state.config.stopGifs + stopGifs: this.$store.state.config.stopGifs, + loopSilentAvailable: + // Firefox + Object.getOwnPropertyDescriptor(HTMLVideoElement.prototype, 'mozHasAudio') || + // Chrome-likes + Object.getOwnPropertyDescriptor(HTMLMediaElement.prototype, 'webkitAudioDecodedByteCount') || + // Future spec, still not supported in Nightly 63 as of 08/2018 + Object.getOwnPropertyDescriptor(HTMLMediaElement.prototype, 'audioTracks') } }, components: { @@ -33,6 +43,12 @@ const settings = { hideNsfwLocal (value) { this.$store.dispatch('setOption', { name: 'hideNsfw', value }) }, + loopVideoLocal (value) { + this.$store.dispatch('setOption', { name: 'loopVideo', value }) + }, + loopVideoSilentOnlyLocal (value) { + this.$store.dispatch('setOption', { name: 'loopVideoSilentOnly', value }) + }, autoLoadLocal (value) { this.$store.dispatch('setOption', { name: 'autoLoad', value }) }, diff --git a/src/components/settings/settings.vue b/src/components/settings/settings.vue index d6dbab27..d6aec2ff 100644 --- a/src/components/settings/settings.vue +++ b/src/components/settings/settings.vue @@ -22,7 +22,7 @@ @@ -55,6 +55,19 @@ +
  • + + +
      +
    • + + +
      + ! {{$t('settings.limited_availability')}} +
      +
      • +
    +
    • @@ -78,6 +91,12 @@ height: 100px; } + .unavailable, + .unavailable i { + color: var(--cRed, $fallback--cRed); + color: $fallback--cRed; + } + .old-avatar { width: 128px; border-radius: $fallback--avatarRadius; diff --git a/src/i18n/messages.js b/src/i18n/messages.js index d672fc41..3c11af8c 100644 --- a/src/i18n/messages.js +++ b/src/i18n/messages.js @@ -314,7 +314,9 @@ const en = { stop_gifs: 'Play-on-hover GIFs', autoload: 'Enable automatic loading when scrolled to the bottom', streaming: 'Enable automatic streaming of new posts when scrolled to the top', - pauseOnUnfocused: 'Pause streaming when tab is not focused', + pause_on_unfocused: 'Pause streaming when tab is not focused', + loop_video: 'Loop videos', + loop_video_silent_only: 'Loop only videos without sound (i.e. Mastodon\'s "gifs")', reply_link_preview: 'Enable reply-link preview on mouse hover', follow_import: 'Follow import', import_followers_from_a_csv_file: 'Import follows from a csv file', @@ -333,7 +335,8 @@ const en = { confirm_new_password: 'Confirm new password', changed_password: 'Password changed successfully!', change_password_error: 'There was an issue changing your password.', - lock_account_description: 'Restrict your account to approved followers only' + lock_account_description: 'Restrict your account to approved followers only', + limited_availability: 'Unavailable in your browser' }, notifications: { notifications: 'Notifications', @@ -1606,6 +1609,9 @@ const ru = { nsfw_clickthrough: 'Включить скрытие NSFW вложений', autoload: 'Включить автоматическую загрузку при прокрутке вниз', streaming: 'Включить автоматическую загрузку новых сообщений при прокрутке вверх', + pause_on_unfocused: 'Приостановить загрузку когда вкладка не в фокусе', + loop_video: 'Зациливать видео', + loop_video_silent_only: 'Зацикливать только беззвучные видео (т.е. "гифки" с Mastodon)', reply_link_preview: 'Включить предварительный просмотр ответа при наведении мыши', follow_import: 'Импортировать читаемых', import_followers_from_a_csv_file: 'Импортировать читаемых из файла .csv', @@ -1623,7 +1629,8 @@ const ru = { new_password: 'Новый пароль', confirm_new_password: 'Подтверждение нового пароля', changed_password: 'Пароль изменён успешно.', - change_password_error: 'Произошла ошибка при попытке изменить пароль.' + change_password_error: 'Произошла ошибка при попытке изменить пароль.', + limited_availability: 'Не доступно в вашем браузере' }, notifications: { notifications: 'Уведомления', diff --git a/src/modules/config.js b/src/modules/config.js index 2b50655b..26930e1d 100644 --- a/src/modules/config.js +++ b/src/modules/config.js @@ -7,9 +7,12 @@ const defaultState = { hideAttachments: false, hideAttachmentsInConv: false, hideNsfw: true, + loopVideo: true, + loopVideoSilentOnly: true, autoLoad: true, streaming: false, hoverPreview: true, + pauseOnUnfocused: true, muteWords: [], highlight: {} }