mirrors/jellyfin-web
1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00
Code Activity

create option for bold subtitles

Browse source
This commit is contained in:
Danny Michel 2022-05-11 14:08:01 -04:00 • committed by Dmitry Lyzo
parent 4d75c88e28
commit add1bbf285
5 changed files with 23 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

10
src/components/subtitlesettings/subtitleappearancehelper.js
View file

@ -28,6 +28,16 @@ function getTextStyles(settings, preview) {
break; break;
} }
switch (settings.textWeight || '') {
case 'bold':
list.push({ name: 'font-weight', value: 'bold' });
break;
case 'normal':
default:
list.push({ name: 'font-weight', value: 'normal' });
break;
}
switch (settings.dropShadow || '') { switch (settings.dropShadow || '') {
case 'raised': case 'raised':
list.push({ name: 'text-shadow', value: '-1px -1px white, 0px -1px white, -1px 0px white, 1px 1px black, 0px 1px black, 1px 0px black' }); list.push({ name: 'text-shadow', value: '-1px -1px white, 0px -1px white, -1px 0px white, 1px 1px black, 0px 1px black, 1px 0px black' });

3
src/components/subtitlesettings/subtitlesettings.js
View file

@ -28,6 +28,7 @@ function getSubtitleAppearanceObject(context) {
const appearanceSettings = {}; const appearanceSettings = {};
appearanceSettings.textSize = context.querySelector('#selectTextSize').value; appearanceSettings.textSize = context.querySelector('#selectTextSize').value;
appearanceSettings.textWeight = context.querySelector('#selectTextWeight').value;
appearanceSettings.dropShadow = context.querySelector('#selectDropShadow').value; appearanceSettings.dropShadow = context.querySelector('#selectDropShadow').value;
appearanceSettings.font = context.querySelector('#selectFont').value; appearanceSettings.font = context.querySelector('#selectFont').value;
appearanceSettings.textBackground = context.querySelector('#inputTextBackground').value; appearanceSettings.textBackground = context.querySelector('#inputTextBackground').value;
@ -53,6 +54,7 @@ function loadForm(context, user, userSettings, appearanceSettings, apiClient) {
context.querySelector('#selectSubtitlePlaybackMode').dispatchEvent(new CustomEvent('change', {})); context.querySelector('#selectSubtitlePlaybackMode').dispatchEvent(new CustomEvent('change', {}));
context.querySelector('#selectTextSize').value = appearanceSettings.textSize || ''; context.querySelector('#selectTextSize').value = appearanceSettings.textSize || '';
context.querySelector('#selectTextWeight').value = appearanceSettings.textWeight || 'normal';
context.querySelector('#selectDropShadow').value = appearanceSettings.dropShadow || ''; context.querySelector('#selectDropShadow').value = appearanceSettings.dropShadow || '';
context.querySelector('#inputTextBackground').value = appearanceSettings.textBackground || 'transparent'; context.querySelector('#inputTextBackground').value = appearanceSettings.textBackground || 'transparent';
context.querySelector('#inputTextColor').value = appearanceSettings.textColor || '#ffffff'; context.querySelector('#inputTextColor').value = appearanceSettings.textColor || '#ffffff';
@ -166,6 +168,7 @@ function embed(options, self) {
options.element.querySelector('#selectSubtitlePlaybackMode').addEventListener('change', onSubtitleModeChange); options.element.querySelector('#selectSubtitlePlaybackMode').addEventListener('change', onSubtitleModeChange);
options.element.querySelector('#selectTextSize').addEventListener('change', onAppearanceFieldChange); options.element.querySelector('#selectTextSize').addEventListener('change', onAppearanceFieldChange);
options.element.querySelector('#selectTextWeight').addEventListener('change', onAppearanceFieldChange);
options.element.querySelector('#selectDropShadow').addEventListener('change', onAppearanceFieldChange); options.element.querySelector('#selectDropShadow').addEventListener('change', onAppearanceFieldChange);
options.element.querySelector('#selectFont').addEventListener('change', onAppearanceFieldChange); options.element.querySelector('#selectFont').addEventListener('change', onAppearanceFieldChange);
options.element.querySelector('#inputTextColor').addEventListener('change', onAppearanceFieldChange); options.element.querySelector('#inputTextColor').addEventListener('change', onAppearanceFieldChange);

7
src/components/subtitlesettings/subtitlesettings.template.html
View file

@ -72,6 +72,13 @@
</select> </select>
</div> </div>
<div class="selectContainer">
<select is="emby-select" id="selectTextWeight" label="${LabelTextWeight}">
<option value="normal">${Normal}</option>
<option value="bold">${Bold}</option>
</select>
</div>
<div class="selectContainer"> <div class="selectContainer">
<select is="emby-select" id="selectFont" label="${LabelFont}"> <select is="emby-select" id="selectFont" label="${LabelFont}">
<option value="">${Default}</option> <option value="">${Default}</option>

1
src/strings/en-gb.json
View file

@ -767,6 +767,7 @@
"LabelTime": "Time:", "LabelTime": "Time:",
"LabelTheme": "Theme:", "LabelTheme": "Theme:",
"LabelTextSize": "Text size:", "LabelTextSize": "Text size:",
"LabelTextWeight": "Text weight:",
"LabelSportsCategories": "Sports categories:", "LabelSportsCategories": "Sports categories:",
"LabelSortTitle": "Sort title:", "LabelSortTitle": "Sort title:",
"LabelSortOrder": "Sort order:", "LabelSortOrder": "Sort order:",

2
src/strings/en-us.json
View file

@ -918,6 +918,8 @@
"LabelTextBackgroundColor": "Text background color:", "LabelTextBackgroundColor": "Text background color:",
"LabelTextColor": "Text color:", "LabelTextColor": "Text color:",
"LabelTextSize": "Text size:", "LabelTextSize": "Text size:",
"LabelTextWeight": "Text weight:",
"Bold": "Bold",
"LabelTheme": "Theme:", "LabelTheme": "Theme:",
"LabelTime": "Time:", "LabelTime": "Time:",
"LabelTimeLimitHours": "Time limit (hours):", "LabelTimeLimitHours": "Time limit (hours):",