Creepso/stremio-web
1
0
Fork 0
mirror of https://github.com/Stremio/stremio-web.git synced 2026-04-20 19:02:15 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

Add Select Options for External Players

Browse source
This commit is contained in:
Alexandru Branza 2023-05-30 16:52:05 +03:00
parent 4e2d8bfad4
commit d709f2c741
5 changed files with 42 additions and 25 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
src/common/externalPlayerOptions.js Normal file
View file

@ -0,0 +1,15 @@
const platform = require('./platform');
let options = [{ label: 'Disabled', value: 'internal' }];
if (platform.name === 'ios') {
options = options.concat([{ label: 'VLC', value: 'vlc' }, { label: 'Outplayer', value: 'outplayer' }, { label: 'Infuse', value: 'infuse' }]);
} else if (platform.name === 'android') {
options = options.concat([{ label: 'Allow Choosing', value: 'choose' }, { label: 'VLC', value: 'vlc' }, { label: 'Just Player', value: 'justplayer' },{ label: 'MX Player', value: 'mxplayer' }]);
} else if (['windows', 'macos', 'linux'].includes(platform.name)) {
options = options.concat([{ label: 'VLC', value: 'vlc' }]);
} else {
options = options.concat([{ label: 'M3U Playlist', value: 'm3u' }]);
}
module.exports = options;

4
src/common/index.js
View file

@ -41,6 +41,7 @@ const useProfile = require('./useProfile');
const useStreamingServer = require('./useStreamingServer');
const useTorrent = require('./useTorrent');
const platform = require('./platform');
const externalPlayerOptions = require('./externalPlayerOptions');
module.exports = {
AddonDetailsModal,
@ -86,5 +87,6 @@ module.exports = {
useProfile,
useStreamingServer,
useTorrent,
platform
platform,
externalPlayerOptions,
};

4
src/routes/MetaDetails/StreamsList/Stream/Stream.js
View file

@ -17,9 +17,9 @@ const Stream = ({ className, addonName, name, description, thumbnail, progress,
const href = React.useMemo(() => {
const haveStreamingServer = streamingServer.settings !== null && streamingServer.settings.type === 'Ready';
return deepLinks ?
profile.settings.playerType === 'external' ?
profile.settings.playerType && profile.settings.playerType !== 'internal' ?
platform.isMobile() || !haveStreamingServer ?
(deepLinks.externalPlayer.vlc || {})[platform.name] || deepLinks.externalPlayer.href
(deepLinks.externalPlayer[profile.settings.playerType] || {})[platform.name] || deepLinks.externalPlayer.href
: null
:
typeof deepLinks.player === 'string' ?

9
src/routes/Settings/Settings.js
View file

@ -35,10 +35,10 @@ const Settings = () => {
subtitlesOutlineColorInput,
audioLanguageSelect,
seekTimeDurationSelect,
playInExternalPlayerSelect,
nextVideoPopupDurationSelect,
bingeWatchingCheckbox,
playInBackgroundCheckbox,
playInExternalPlayerCheckbox,
hardwareDecodingCheckbox,
streamingServerUrlInput
} = useProfileSettingsInputs(profile);
@ -399,10 +399,9 @@ const Settings = () => {
<div className={styles['option-name-container']}>
<div className={styles['label']}>{ t('SETTINGS_PLAY_IN_EXTERNAL_PLAYER') }</div>
</div>
<Checkbox
className={classnames(styles['option-input-container'], styles['checkbox-container'])}
tabIndex={-1}
{...playInExternalPlayerCheckbox}
<Multiselect
className={classnames(styles['option-input-container'], styles['multiselect-container'])}
{...playInExternalPlayerSelect}
/>
</div>
<div className={styles['option-container']}>

35
src/routes/Settings/useProfileSettingsInputs.js
View file

@ -3,7 +3,7 @@
const React = require('react');
const { useTranslation } = require('react-i18next');
const { useServices } = require('stremio/services');
const { CONSTANTS, interfaceLanguages, languageNames } = require('stremio/common');
const { CONSTANTS, interfaceLanguages, languageNames, externalPlayerOptions } = require('stremio/common');
const useProfileSettingsInputs = (profile) => {
const { t } = useTranslation();
@ -157,6 +157,22 @@ const useProfileSettingsInputs = (profile) => {
});
}
}), [profile.settings]);
const playInExternalPlayerSelect = React.useMemo(() => ({
options: externalPlayerOptions,
selected: [`${profile.settings.playerType || 'internal'}`],
onSelect: (event) => {
core.transport.dispatch({
action: 'Ctx',
args: {
action: 'UpdateSettings',
args: {
...profile.settings,
playerType: event.value
}
}
});
}
}), [profile.settings]);
const nextVideoPopupDurationSelect = React.useMemo(() => ({
options: CONSTANTS.NEXT_VIDEO_POPUP_DURATIONS.map((duration) => ({
value: `${duration}`,
@ -212,21 +228,6 @@ const useProfileSettingsInputs = (profile) => {
});
}
}), [profile.settings]);
const playInExternalPlayerCheckbox = React.useMemo(() => ({
checked: profile.settings.playerType === 'external',
onClick: () => {
core.transport.dispatch({
action: 'Ctx',
args: {
action: 'UpdateSettings',
args: {
...profile.settings,
playerType: profile.settings.playerType !== 'external' ? 'external' : 'internal'
}
}
});
}
}), [profile.settings]);
const hardwareDecodingCheckbox = React.useMemo(() => ({
checked: profile.settings.hardwareDecoding,
onClick: () => {
@ -266,10 +267,10 @@ const useProfileSettingsInputs = (profile) => {
subtitlesOutlineColorInput,
audioLanguageSelect,
seekTimeDurationSelect,
playInExternalPlayerSelect,
nextVideoPopupDurationSelect,
bingeWatchingCheckbox,
playInBackgroundCheckbox,
playInExternalPlayerCheckbox,
hardwareDecodingCheckbox,
streamingServerUrlInput
};