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

Merge pull request #4754 from mkanilsson/webos-subtitle-offset

Browse source
This commit is contained in:
Bill Thornton 2023-09-07 18:21:20 -04:00 • committed by GitHub
commit b114f1ae66
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 19 additions and 17 deletions
Download patch file Download diff file Expand all files Collapse all files

34
src/components/subtitlesync/subtitlesync.js
View file

@ -54,7 +54,7 @@ function init(instance) {
playbackManager.setSubtitleOffset(inputOffset, player); playbackManager.setSubtitleOffset(inputOffset, player);
// synchronize with slider value // synchronize with slider value
subtitleSyncSlider.updateOffset( subtitleSyncSlider.updateOffset(
getPercentageFromOffset(inputOffset)); getSliderValueFromOffset(inputOffset));
} else { } else {
this.textContent = (playbackManager.getPlayerSubtitleOffset(player) || 0) + 's'; this.textContent = (playbackManager.getPlayerSubtitleOffset(player) || 0) + 's';
} }
@ -79,17 +79,17 @@ function init(instance) {
} }
}; };
subtitleSyncSlider.updateOffset = function (percent) { subtitleSyncSlider.updateOffset = function (sliderValue) {
// default value is 0s = 50% // default value is 0s = 0ms
this.value = percent === undefined ? 50 : percent; this.value = sliderValue === undefined ? 0 : sliderValue;
}; };
subtitleSyncSlider.addEventListener('change', function () { subtitleSyncSlider.addEventListener('change', function () {
// set new offset // set new offset
playbackManager.setSubtitleOffset(getOffsetFromPercentage(this.value), player); playbackManager.setSubtitleOffset(getOffsetFromSliderValue(this.value), player);
// synchronize with textField value // synchronize with textField value
subtitleSyncTextField.updateOffset( subtitleSyncTextField.updateOffset(
getOffsetFromPercentage(this.value)); getOffsetFromSliderValue(this.value));
}); });
subtitleSyncSlider.getBubbleHtml = function (value) { subtitleSyncSlider.getBubbleHtml = function (value) {
@ -108,20 +108,22 @@ function init(instance) {
} }
function getOffsetFromPercentage(value) { function getOffsetFromPercentage(value) {
// convert percent to fraction // convert percentage to fraction
let offset = (value - 50) / 50; let offset = (value - 50) / 50;
// multiply by offset min/max range value (-x to +x) : // multiply by offset min/max range value (-x to +x) :
offset *= 30; offset *= 30;
return offset.toFixed(1); return offset.toFixed(1);
} }
function getPercentageFromOffset(value) { function getOffsetFromSliderValue(value) {
// divide by offset min/max range value (-x to +x) : // convert slider value to offset
let percentValue = value / 30; const offset = value / 10;
// convert fraction to percent return offset.toFixed(1);
percentValue *= 50; }
percentValue += 50;
return Math.min(100, Math.max(0, percentValue.toFixed(1))); function getSliderValueFromOffset(value) {
const sliderValue = value * 10;
return Math.min(300, Math.max(-300, sliderValue.toFixed(1)));
} }
class SubtitleSync { class SubtitleSync {
@ -155,8 +157,8 @@ class SubtitleSync {
if (playbackManager.isShowingSubtitleOffsetEnabled(player) && playbackManager.canHandleOffsetOnCurrentSubtitle(player)) { if (playbackManager.isShowingSubtitleOffsetEnabled(player) && playbackManager.canHandleOffsetOnCurrentSubtitle(player)) {
// if no subtitle offset is defined or element has focus (offset being defined) // if no subtitle offset is defined or element has focus (offset being defined)
if (!(playbackManager.getPlayerSubtitleOffset(player) || subtitleSyncTextField.hasFocus)) { if (!(playbackManager.getPlayerSubtitleOffset(player) || subtitleSyncTextField.hasFocus)) {
// set default offset to '0' = 50% // set default offset to '0' = 0ms
subtitleSyncSlider.value = '50'; subtitleSyncSlider.value = '0';
subtitleSyncTextField.textContent = '0s'; subtitleSyncTextField.textContent = '0s';
playbackManager.setSubtitleOffset(0, player); playbackManager.setSubtitleOffset(0, player);
} }

2
src/components/subtitlesync/subtitlesync.template.html
View file

@ -3,7 +3,7 @@
<button type="button" is="paper-icon-button-light" class="subtitleSync-closeButton"><span class="material-icons close" aria-hidden="true"></span></button> <button type="button" is="paper-icon-button-light" class="subtitleSync-closeButton"><span class="material-icons close" aria-hidden="true"></span></button>
<div class="subtitleSyncTextField" contenteditable="true" spellcheck="false">0s</div> <div class="subtitleSyncTextField" contenteditable="true" spellcheck="false">0s</div>
<div class="sliderContainer subtitleSyncSliderContainer"> <div class="sliderContainer subtitleSyncSliderContainer">
<input is="emby-slider" type="range" step=".1" min="0" max="100" value="50" class="subtitleSyncSlider" data-slider-keep-progress="true" /> <input is="emby-slider" type="range" step="1" min="-300" max="300" value="0" class="subtitleSyncSlider" data-slider-keep-progress="true" />
</div> </div>
</div> </div>
</div> </div>