feat: add video mode setting

src/routes/Player/Player.js

@@ -345,6 +345,7 @@ const Player = ({ urlParams, queryParams }) => {
                 forceTranscoding: forceTranscoding || casting,
                 maxAudioChannels: settings.surroundSound ? 32 : 2,
                 hardwareDecoding: settings.hardwareDecoding,
+                videoMode: settings.videoMode,
                 streamingServerURL: streamingServer.baseUrl ?
                     casting ?
                         streamingServer.baseUrl

src/routes/Settings/Player/Player.tsx

@@ -3,6 +3,7 @@ import { ColorInput, MultiselectMenu, Toggle } from 'stremio/components';
 import { useServices } from 'stremio/services';
 import { Category, Option, Section } from '../components';
 import usePlayerOptions from './usePlayerOptions';
+import { usePlatform } from 'stremio/common';
 
 type Props = {
     profile: Profile,
@@ -10,6 +11,7 @@ type Props = {
 
 const Player = forwardRef<HTMLDivElement, Props>(({ profile }: Props, ref) => {
     const { shell } = useServices();
+    const platform = usePlatform();
 
     const {
         subtitlesLanguageSelect,
@@ -26,6 +28,7 @@ const Player = forwardRef<HTMLDivElement, Props>(({ profile }: Props, ref) => {
         bingeWatchingToggle,
         playInBackgroundToggle,
         hardwareDecodingToggle,
+        videoModeSelect,
         pauseOnMinimizeToggle,
     } = usePlayerOptions(profile);
 
@@ -129,6 +132,15 @@ const Player = forwardRef<HTMLDivElement, Props>(({ profile }: Props, ref) => {
                             />
                         </Option>
                 }
+                {
+                    shell.active && platform.name === 'windows' &&
+                        <Option label={'SETTINGS_VIDEO_MODE'}>
+                            <MultiselectMenu
+                                className={'multiselect'}
+                                {...videoModeSelect}
+                            />
+                        </Option>
+                }
                 {
                     shell.active &&
                         <Option label={'SETTINGS_PAUSE_MINIMIZED'}>

src/routes/Settings/Player/usePlayerOptions.ts

@@ -287,6 +287,38 @@ const usePlayerOptions = (profile: Profile) => {
         }
     }), [profile.settings]);
 
+    const videoModeSelect = useMemo(() => ({
+        options: [
+            {
+                value: null,
+                label: t('SETTINGS_VIDEO_MODE_DEFAULT'),
+            },
+            {
+                value: 'legacy',
+                label: t('SETTINGS_VIDEO_MODE_LEGACY'),
+            }
+        ],
+        value: profile.settings.videoMode,
+        title: () => {
+            return profile.settings.videoMode === 'legacy' ?
+                t('SETTINGS_VIDEO_MODE_LEGACY')
+                :
+                t('SETTINGS_VIDEO_MODE_DEFAULT');
+        },
+        onSelect: (value: string | null) => {
+            core.transport.dispatch({
+                action: 'Ctx',
+                args: {
+                    action: 'UpdateSettings',
+                    args: {
+                        ...profile.settings,
+                        videoMode: value,
+                    }
+                }
+            });
+        }
+    }), [profile.settings]);
+
     const pauseOnMinimizeToggle = useMemo(() => ({
         checked: profile.settings.pauseOnMinimize,
         onClick: () => {
@@ -318,6 +350,7 @@ const usePlayerOptions = (profile: Profile) => {
         bingeWatchingToggle,
         playInBackgroundToggle,
         hardwareDecodingToggle,
+        videoModeSelect,
         pauseOnMinimizeToggle,
     };
 };

src/types/models/Ctx.d.ts

@@ -19,6 +19,7 @@ type Settings = {
     autoFrameRateMatching: boolean,
     bingeWatching: boolean,
     hardwareDecoding: boolean,
+    videoMode: string | null,
     escExitFullscreen: boolean,
     interfaceLanguage: string,
     quitOnClose: boolean,