diff --git a/src/components/subtitlesettings/subtitlesettings.js b/src/components/subtitlesettings/subtitlesettings.js index 5e55adfd51..7231842e68 100644 --- a/src/components/subtitlesettings/subtitlesettings.js +++ b/src/components/subtitlesettings/subtitlesettings.js @@ -61,6 +61,9 @@ function loadForm(context, user, userSettings, appearanceSettings, apiClient) { context.querySelector('#sliderVerticalPosition').value = appearanceSettings.verticalPosition; context.querySelector('#selectSubtitleBurnIn').value = appSettings.get('subtitleburnin') || ''; + context.querySelector('#chkSubtitleRenderPgs').checked = appSettings.get('subtitlerenderpgs') === 'true'; + + context.querySelector('#selectSubtitleBurnIn').dispatchEvent(new CustomEvent('change', {})); onAppearanceFieldChange({ target: context.querySelector('#selectTextSize') @@ -86,6 +89,7 @@ function save(instance, context, userId, userSettings, apiClient, enableSaveConf loading.show(); appSettings.set('subtitleburnin', context.querySelector('#selectSubtitleBurnIn').value); + appSettings.set('subtitlerenderpgs', context.querySelector('#chkSubtitleRenderPgs').checked); apiClient.getUser(userId).then(function (user) { saveUser(context, user, userSettings, instance.appearanceKey, apiClient).then(function () { @@ -111,6 +115,19 @@ function onSubtitleModeChange(e) { view.querySelector('.subtitles' + this.value + 'Help').classList.remove('hide'); } +function onSubtitleBurnInChange(e) { + const view = dom.parentWithClass(e.target, 'subtitlesettings'); + + const fieldRenderPgs = view.querySelector('.fldRenderPgs'); + + // Pgs option is only available if burn-in mode is set to 'auto' (empty string) + if (this.value) { + fieldRenderPgs.classList.add('hide'); + } else { + fieldRenderPgs.classList.remove('hide'); + } +} + function onAppearanceFieldChange(e) { const view = dom.parentWithClass(e.target, 'subtitlesettings'); @@ -166,6 +183,7 @@ function embed(options, self) { options.element.querySelector('form').addEventListener('submit', self.onSubmit.bind(self)); options.element.querySelector('#selectSubtitlePlaybackMode').addEventListener('change', onSubtitleModeChange); + options.element.querySelector('#selectSubtitleBurnIn').addEventListener('change', onSubtitleBurnInChange); options.element.querySelector('#selectTextSize').addEventListener('change', onAppearanceFieldChange); options.element.querySelector('#selectTextWeight').addEventListener('change', onAppearanceFieldChange); options.element.querySelector('#selectDropShadow').addEventListener('change', onAppearanceFieldChange); diff --git a/src/components/subtitlesettings/subtitlesettings.template.html b/src/components/subtitlesettings/subtitlesettings.template.html index 5f1f14ae9d..0bef96d787 100644 --- a/src/components/subtitlesettings/subtitlesettings.template.html +++ b/src/components/subtitlesettings/subtitlesettings.template.html @@ -32,6 +32,15 @@
${BurnSubtitlesHelp}
+ +
+ +
${RenderPgsSubtitleHelp}
+
diff --git a/src/scripts/browserDeviceProfile.js b/src/scripts/browserDeviceProfile.js index e85642faea..87a0726f5f 100644 --- a/src/scripts/browserDeviceProfile.js +++ b/src/scripts/browserDeviceProfile.js @@ -1424,6 +1424,7 @@ export default function (options) { // External vtt or burn in profile.SubtitleProfiles = []; const subtitleBurninSetting = appSettings.get('subtitleburnin'); + const subtitleRenderPgsSetting = appSettings.get('subtitlerenderpgs') === 'true'; if (subtitleBurninSetting !== 'all') { if (supportsTextTracks()) { profile.SubtitleProfiles.push({ @@ -1442,7 +1443,7 @@ export default function (options) { }); } - if (supportsCanvas2D() && options.enablePgsRender !== false && !options.isRetry + if (supportsCanvas2D() && options.enablePgsRender !== false && !options.isRetry && subtitleRenderPgsSetting && subtitleBurninSetting !== 'allcomplexformats' && subtitleBurninSetting !== 'onlyimageformats') { profile.SubtitleProfiles.push({ Format: 'pgssub', diff --git a/src/strings/en-us.json b/src/strings/en-us.json index 642d082cc7..42e024c028 100644 --- a/src/strings/en-us.json +++ b/src/strings/en-us.json @@ -1383,6 +1383,8 @@ "Remixer": "Remixer", "RemoveFromCollection": "Remove from collection", "RemoveFromPlaylist": "Remove from playlist", + "RenderPgsSubtitle": "Experimental PGS subtitle rendering", + "RenderPgsSubtitleHelp": "Determine if the client should render PGS subtitles instead of using burned in subtitles. This can avoid server-side transcoding in exchange of client-side rendering performance.", "Repeat": "Repeat", "RepeatAll": "Repeat all", "RepeatEpisodes": "Repeat episodes",