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

Use slider to round and limit offset

Browse source
This commit is contained in:
Dmitry Lyzo 2023-09-26 00:04:31 +03:00
parent 111958e2a5
commit 6063ba6db5
2 changed files with 15 additions and 38 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -46,15 +46,8 @@ function init(instance) {
if (inputOffset) {
inputOffset = inputOffset[0];
inputOffset = parseFloat(inputOffset);
inputOffset = Math.min(30, Math.max(-30, inputOffset));
// replace current text by considered offset
this.textContent = inputOffset + 's';
// set new offset
playbackManager.setSubtitleOffset(inputOffset, player);
// synchronize with slider value
subtitleSyncSlider.updateOffset(
getSliderValueFromOffset(inputOffset));
subtitleSyncSlider.updateOffset(inputOffset);
} else {
this.textContent = (playbackManager.getPlayerSubtitleOffset(player) || 0) + 's';
}
@ -79,23 +72,26 @@ function init(instance) {
}
};
function updateSubtitleOffset() {
const value = parseFloat(subtitleSyncSlider.value);
// set new offset
playbackManager.setSubtitleOffset(value, player);
// synchronize with textField value
subtitleSyncTextField.updateOffset(value);
}
subtitleSyncSlider.updateOffset = function (sliderValue) {
// default value is 0s = 0ms
this.value = sliderValue === undefined ? 0 : sliderValue;
updateSubtitleOffset();
};
subtitleSyncSlider.addEventListener('change', function () {
// set new offset
playbackManager.setSubtitleOffset(getOffsetFromSliderValue(this.value), player);
// synchronize with textField value
subtitleSyncTextField.updateOffset(
getOffsetFromSliderValue(this.value));
});
subtitleSyncSlider.addEventListener('change', () => updateSubtitleOffset());
subtitleSyncSlider.getBubbleHtml = function (value) {
const newOffset = getOffsetFromPercentage(value);
subtitleSyncSlider.getBubbleHtml = function (_, value) {
return '<h1 class="sliderBubbleText">'
+ (newOffset > 0 ? '+' : '') + parseFloat(newOffset) + 's'
+ (value > 0 ? '+' : '') + parseFloat(value) + 's'
+ '</h1>';
};
@ -107,25 +103,6 @@ function init(instance) {
instance.element = parent;
}
function getOffsetFromPercentage(value) {
// convert percentage to fraction
let offset = (value - 50) / 50;
// multiply by offset min/max range value (-x to +x) :
offset *= 30;
return offset.toFixed(1);
}
function getOffsetFromSliderValue(value) {
// convert slider value to offset
const offset = value / 10;
return offset.toFixed(1);
}
function getSliderValueFromOffset(value) {
const sliderValue = value * 10;
return Math.min(300, Math.max(-300, sliderValue.toFixed(1)));
}
class SubtitleSync {
constructor(currentPlayer) {
player = currentPlayer;