diff --git a/src/datastores/handlers/base.js b/src/datastores/handlers/base.js index 7c2eb4ec0539d..471aab47924a7 100644 --- a/src/datastores/handlers/base.js +++ b/src/datastores/handlers/base.js @@ -1,8 +1,34 @@ import * as db from '../index' +/* Mapping of older settings whose variable names have changed to their newer values */ +const outdatedSettings = { + defaultTheatreMode: 'defaultTheaterMode', + playNextVideo: 'enableAutoplay', + autoplayPlaylists: 'enablePlaylistAutoplay', + hideUnsubscribeButton: 'hideSubscribeButton', + autoplayVideos: 'startVideosAutomatically' +} + class Settings { - static find() { - return db.settings.findAsync({ _id: { $ne: 'bounds' } }) + static async find() { + const settings = await db.settings.findAsync({ _id: { $ne: 'bounds' } }) + // Apply existing values of outdated setting variables in the DB to their newer equivalents, + // then delete those older settings + const parseableSettings = {} + settings.forEach(({ _id, value }) => { parseableSettings[_id] = value }) + for (const outdatedSetting of Object.keys(outdatedSettings)) { + const outdatedSettingInDB = parseableSettings[outdatedSetting] + if (!outdatedSettingInDB) { + return + } + + const newSettingId = outdatedSettings[outdatedSetting] + const outdatedSettingValue = outdatedSettingInDB[1] + await this.upsert(newSettingId, outdatedSettingValue) + await this.delete(outdatedSetting) + } + + return settings } static upsert(_id, value) { @@ -13,6 +39,10 @@ class Settings { return db.settings.compactDatafileAsync() } + static delete(setting) { + return db.settings.removeAsync({ _id: setting }) + } + // ******************** // // Unique Electron main process handlers static _findAppReadyRelatedSettings() { diff --git a/src/datastores/handlers/electron.js b/src/datastores/handlers/electron.js index 31e8c96305ece..45ad74f57cf35 100644 --- a/src/datastores/handlers/electron.js +++ b/src/datastores/handlers/electron.js @@ -15,6 +15,13 @@ class Settings { { action: DBActions.GENERAL.UPSERT, data: { _id, value } } ) } + + static delete(setting) { + return ipcRenderer.invoke( + IpcChannels.DB_SETTINGS, + { action: DBActions.GENERAL.DELETE, data: setting } + ) + } } class History { diff --git a/src/datastores/handlers/web.js b/src/datastores/handlers/web.js index d5feccc998d07..5e54bce956d34 100644 --- a/src/datastores/handlers/web.js +++ b/src/datastores/handlers/web.js @@ -18,6 +18,10 @@ class Settings { static upsert(_id, value) { return baseHandlers.settings.upsert(_id, value) } + + static delete(setting) { + return baseHandlers.settings.delete(setting) + } } class History { diff --git a/src/main/index.js b/src/main/index.js index 928dfd7b6597c..c55d6da3acc09 100644 --- a/src/main/index.js +++ b/src/main/index.js @@ -834,7 +834,14 @@ function runApp() { // Do nothing for unmatched settings } return null - + case DBActions.GENERAL.DELETE: + await baseHandlers.settings.delete(data) + syncOtherWindows( + IpcChannels.SYNC_SETTINGS, + event, + { event: SyncEvents.GENERAL.DELETE, data } + ) + return null default: // eslint-disable-next-line no-throw-literal throw 'invalid settings db action' diff --git a/src/renderer/components/distraction-settings/distraction-settings.js b/src/renderer/components/distraction-settings/distraction-settings.js index a540b94bde48b..00fec610d2b2b 100644 --- a/src/renderer/components/distraction-settings/distraction-settings.js +++ b/src/renderer/components/distraction-settings/distraction-settings.js @@ -137,7 +137,7 @@ export default defineComponent({ methods: { handleHideRecommendedVideos: function (value) { if (value) { - this.updatePlayNextVideo(false) + this.updateEnableAutoplay(false) } this.updateHideRecommendedVideos(value) @@ -202,8 +202,8 @@ export default defineComponent({ 'updateHidePlaylists', 'updateHideLiveChat', 'updateHideActiveSubscriptions', - 'updatePlayNextVideo', - 'updateDefaultTheatreMode', + 'updateEnableAutoplay', + 'updateDefaultTheaterMode', 'updateHideVideoDescription', 'updateHideComments', 'updateHideCommentPhotos', diff --git a/src/renderer/components/ft-video-player/ft-video-player.js b/src/renderer/components/ft-video-player/ft-video-player.js index 4cacc6a195001..315e18abf587a 100644 --- a/src/renderer/components/ft-video-player/ft-video-player.js +++ b/src/renderer/components/ft-video-player/ft-video-player.js @@ -108,16 +108,16 @@ export default defineComponent({ type: Array, default: () => ([]) }, - theatrePossible: { + theaterPossible: { type: Boolean, default: false }, - useTheatreMode: { + useTheaterMode: { type: Boolean, default: false } }, - emits: ['ended', 'error', 'ready', 'store-caption-list', 'timeupdate', 'toggle-theatre-mode'], + emits: ['ended', 'error', 'ready', 'store-caption-list', 'timeupdate', 'toggle-theater-mode'], data: function () { return { powerSaveBlocker: null, @@ -175,7 +175,7 @@ export default defineComponent({ 'descriptionsButton', 'subsCapsButton', 'pictureInPictureToggle', - 'toggleTheatreModeButton', + 'toggleTheaterModeButton', 'fullWindowButton', 'qualitySelector', 'fullscreenToggle' @@ -213,8 +213,8 @@ export default defineComponent({ } }, - autoplayVideos: function () { - return this.$store.getters.getAutoplayVideos + startVideosAutomatically: function () { + return this.$store.getters.getStartVideosAutomatically }, videoVolumeMouseScroll: function () { @@ -397,7 +397,7 @@ export default defineComponent({ this.createFullWindowButton() this.createLoopButton() - this.createToggleTheatreModeButton() + this.createToggleTheaterModeButton() this.createScreenshotButton() this.determineFormatType() @@ -594,7 +594,7 @@ export default defineComponent({ }) } - if (this.autoplayVideos) { + if (this.startVideosAutomatically) { // Calling play() won't happen right away, so a quick timeout will make it function properly. setTimeout(() => { // `this.player` can be destroyed before this runs @@ -1507,28 +1507,28 @@ export default defineComponent({ videojs.registerComponent('fullWindowButton', fullWindowButton) }, - createToggleTheatreModeButton: function () { - if (!this.theatrePossible) { + createToggleTheaterModeButton: function () { + if (!this.theaterPossible) { return } - const theatreModeActive = this.useTheatreMode ? ' vjs-icon-theatre-active' : '' + const theaterModeActive = this.useTheaterMode ? ' vjs-icon-theatre-active' : '' - const toggleTheatreMode = this.toggleTheatreMode + const toggleTheaterMode = this.toggleTheaterMode const VjsButton = videojs.getComponent('Button') - class toggleTheatreModeButton extends VjsButton { + class toggleTheaterModeButton extends VjsButton { handleClick() { - toggleTheatreMode() + toggleTheaterMode() } createControlTextEl(button) { button.classList.add('vjs-button-theatre') - button.title = 'Toggle Theatre Mode' + button.title = 'Toggle Theater Mode' const div = document.createElement('div') - div.id = 'toggleTheatreModeButton' - div.className = `vjs-icon-theatre-inactive${theatreModeActive} vjs-button` + div.id = 'toggleTheaterModeButton' + div.className = `vjs-icon-theatre-inactive${theaterModeActive} vjs-button` button.appendChild(div) @@ -1536,20 +1536,20 @@ export default defineComponent({ } } - videojs.registerComponent('toggleTheatreModeButton', toggleTheatreModeButton) + videojs.registerComponent('toggleTheaterModeButton', toggleTheaterModeButton) }, - toggleTheatreMode: function () { + toggleTheaterMode: function () { if (!this.player.isFullscreen_) { - const toggleTheatreModeButton = document.getElementById('toggleTheatreModeButton') - if (!this.useTheatreMode) { - toggleTheatreModeButton.classList.add('vjs-icon-theatre-active') + const toggleTheaterModeButton = document.getElementById('toggleTheaterModeButton') + if (!this.useTheaterMode) { + toggleTheaterModeButton.classList.add('vjs-icon-theatre-active') } else { - toggleTheatreModeButton.classList.remove('vjs-icon-theatre-active') + toggleTheaterModeButton.classList.remove('vjs-icon-theatre-active') } } - this.$emit('toggle-theatre-mode') + this.$emit('toggle-theater-mode') }, createScreenshotButton: function () { @@ -2283,8 +2283,8 @@ export default defineComponent({ break case 'T': case 't': - // Toggle Theatre Mode - this.toggleTheatreMode() + // Toggle Theater Mode + this.toggleTheaterMode() break case 'U': case 'u': diff --git a/src/renderer/components/parental-control-settings/parental-control-settings.js b/src/renderer/components/parental-control-settings/parental-control-settings.js index fd064ae635dae..67d817f88be06 100644 --- a/src/renderer/components/parental-control-settings/parental-control-settings.js +++ b/src/renderer/components/parental-control-settings/parental-control-settings.js @@ -13,8 +13,8 @@ export default defineComponent({ hideSearchBar: function () { return this.$store.getters.getHideSearchBar }, - hideUnsubscribeButton: function() { - return this.$store.getters.getHideUnsubscribeButton + hideSubscribeButton: function() { + return this.$store.getters.getHideSubscribeButton }, showFamilyFriendlyOnly: function() { return this.$store.getters.getShowFamilyFriendlyOnly @@ -23,7 +23,7 @@ export default defineComponent({ methods: { ...mapActions([ 'updateHideSearchBar', - 'updateHideUnsubscribeButton', + 'updateHideSubscribeButton', 'updateShowFamilyFriendlyOnly' ]) } diff --git a/src/renderer/components/parental-control-settings/parental-control-settings.vue b/src/renderer/components/parental-control-settings/parental-control-settings.vue index 2d5485c48e982..68540711b0dcf 100644 --- a/src/renderer/components/parental-control-settings/parental-control-settings.vue +++ b/src/renderer/components/parental-control-settings/parental-control-settings.vue @@ -7,8 +7,8 @@ const state = { allSettingsSectionsExpandedByDefault: false, - autoplayPlaylists: true, - autoplayVideos: true, + enablePlaylistAutoplay: true, + startVideosAutomatically: true, backendFallback: process.env.SUPPORTS_LOCAL_API, backendPreference: !process.env.SUPPORTS_LOCAL_API ? 'invidious' : 'local', barColor: false, @@ -179,7 +179,7 @@ const state = { defaultProfile: MAIN_PROFILE_ID, defaultQuality: '720', defaultSkipInterval: 5, - defaultTheatreMode: false, + defaultTheaterMode: false, defaultVideoFormat: 'dash', disableSmoothScrolling: false, displayVideoPlayButton: true, @@ -221,7 +221,7 @@ const state = { hideSubscriptionsLive: false, hideSubscriptionsCommunity: false, hideTrendingVideos: false, - hideUnsubscribeButton: false, + hideSubscribeButton: false, hideUpcomingPremieres: false, hideVideoLikesAndDislikes: false, hideVideoViews: false, @@ -232,8 +232,8 @@ const state = { landingPage: 'subscriptions', listType: 'grid', maxVideoPlaybackRate: 3, + enableAutoplay: false, onlyShowLatestFromChannel: false, - playNextVideo: false, proxyHostname: '127.0.0.1', proxyPort: '9050', proxyProtocol: 'socks5', @@ -455,8 +455,7 @@ const customActions = { Object.fromEntries((await DBSettingHandlers.find()).map(({ _id, value }) => { return [_id, value] }))) ) - for (const setting of userSettings) { - const [_id, value] = setting + const loadSetting = (_id, value) => { if (getters.settingHasSideEffects(_id)) { dispatch(defaultSideEffectsTriggerId(_id), value) } @@ -465,6 +464,11 @@ const customActions = { commit(defaultMutationId(_id), value) } } + + for (const setting of userSettings) { + const [_id, value] = setting + loadSetting(_id, value) + } } catch (errMessage) { console.error(errMessage) } @@ -596,6 +600,10 @@ Object.assign( // Build default getters, mutations and actions for every setting id for (const settingId of Object.keys(state)) { + buildSettingsStoreMethods(settingId) +} + +function buildSettingsStoreMethods(settingId) { const getterId = defaultGetterId(settingId) const mutationId = defaultMutationId(settingId) const updaterId = defaultUpdaterId(settingId) diff --git a/src/renderer/views/Channel/Channel.js b/src/renderer/views/Channel/Channel.js index 32a7980366ea7..19ac647f7b0b3 100644 --- a/src/renderer/views/Channel/Channel.js +++ b/src/renderer/views/Channel/Channel.js @@ -149,8 +149,8 @@ export default defineComponent({ return this.$store.getters.getBackendFallback }, - hideUnsubscribeButton: function() { - return this.$store.getters.getHideUnsubscribeButton + hideSubscribeButton: function() { + return this.$store.getters.getHideSubscribeButton }, showFamilyFriendlyOnly: function() { diff --git a/src/renderer/views/Channel/Channel.vue b/src/renderer/views/Channel/Channel.vue index aed6e7f9694cd..52ed9af64ed86 100644 --- a/src/renderer/views/Channel/Channel.vue +++ b/src/renderer/views/Channel/Channel.vue @@ -66,7 +66,7 @@ />
= 1051px) { - &.useTheatreMode { - @include theatre-mode-template; + &.useTheaterMode { + @include theater-mode-template; } } diff --git a/src/renderer/views/Watch/Watch.vue b/src/renderer/views/Watch/Watch.vue index a6d805b05b699..8c687985f7116 100644 --- a/src/renderer/views/Watch/Watch.vue +++ b/src/renderer/views/Watch/Watch.vue @@ -3,8 +3,8 @@ class="videoLayout" :class="{ isLoading, - useTheatreMode: useTheatreMode && !isLoading, - noSidebar: !theatrePossible + useTheaterMode: useTheaterMode && !isLoading, + noSidebar: !theaterPossible }" >