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 #1494 from dmitrylyzo/friendly-subtitlesync

Browse source 
Friendly SubtitleSync
This commit is contained in:
dkanada 2020-06-29 22:45:02 +09:00 • committed by GitHub
commit c390a454a1
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 64 additions and 17 deletions
Download patch file Download diff file Expand all files Collapse all files

12
src/components/subtitlesync/subtitlesync.css
View file

@ -1,12 +1,18 @@
.subtitleSync {
position: absolute;
width: 100%;
}
.subtitleSyncContainer {
width: 40%;
margin-left: 30%;
margin-right: 30%;
min-width: 18em;
margin-left: auto;
margin-right: auto;
height: 4.2em;
background: rgba(28, 28, 28, 0.8);
border-radius: 0.3em;
color: #fff;
position: absolute;
position: relative;
}
.subtitleSync-closeButton {

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

@ -87,14 +87,6 @@ define(['playbackManager', 'layoutManager', 'text!./subtitlesync.template.html',
getOffsetFromPercentage(this.value));
});
subtitleSyncSlider.addEventListener('touchmove', function () {
// set new offset
playbackManager.setSubtitleOffset(getOffsetFromPercentage(this.value), player);
// synchronize with textField value
subtitleSyncTextField.updateOffset(
getOffsetFromPercentage(this.value));
});
subtitleSyncSlider.getBubbleHtml = function (value) {
var newOffset = getOffsetFromPercentage(value);
return '<h1 class="sliderBubbleText">' +

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

@ -1,7 +1,9 @@
<div class="subtitleSyncContainer">
<button type="button" is="paper-icon-button-light" class="subtitleSync-closeButton"><span class="material-icons close"></span></button>
<div class="subtitleSyncTextField" contenteditable="true" spellcheck="false">0s</div>
<div class="sliderContainer subtitleSyncSliderContainer">
<input is="emby-slider" type="range" step="1" min="0" max="100" value="50" class="subtitleSyncSlider" />
<div class="subtitleSync">
<div class="subtitleSyncContainer">
<button type="button" is="paper-icon-button-light" class="subtitleSync-closeButton"><span class="material-icons close"></span></button>
<div class="subtitleSyncTextField" contenteditable="true" spellcheck="false">0s</div>
<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" />
</div>
</div>
</div>

49
src/controllers/playback/videoosd.js
View file

@ -333,13 +333,21 @@ define(['playbackManager', 'dom', 'inputManager', 'datetime', 'itemHelper', 'med
osdPoster.innerHTML = '';
}
let osdLockCount = 0;
function showOsd() {
slideDownToShow(headerElement);
showMainOsdControls();
startOsdHideTimer();
if (!osdLockCount) {
startOsdHideTimer();
}
}
function hideOsd() {
if (osdLockCount) {
return;
}
slideUpToHide(headerElement);
hideMainOsdControls();
}
@ -352,6 +360,19 @@ define(['playbackManager', 'dom', 'inputManager', 'datetime', 'itemHelper', 'med
}
}
function lockOsd() {
osdLockCount++;
stopOsdHideTimer();
}
function unlockOsd() {
osdLockCount--;
// Restart hide timer if OSD is currently visible
if (currentVisibleMenu && !osdLockCount) {
startOsdHideTimer();
}
}
function startOsdHideTimer() {
stopOsdHideTimer();
osdHideTimeout = setTimeout(hideOsd, 3e3);
@ -1196,10 +1217,20 @@ define(['playbackManager', 'dom', 'inputManager', 'datetime', 'itemHelper', 'med
function onWindowMouseDown(e) {
clickedElement = e.srcElement;
lockOsd();
}
function onWindowMouseUp() {
unlockOsd();
}
function onWindowTouchStart(e) {
clickedElement = e.srcElement;
lockOsd();
}
function onWindowTouchEnd() {
unlockOsd();
}
function getImgUrl(item, chapter, index, maxWidth, apiClient) {
@ -1336,9 +1367,17 @@ define(['playbackManager', 'dom', 'inputManager', 'datetime', 'itemHelper', 'med
dom.addEventListener(window, window.PointerEvent ? 'pointerdown' : 'mousedown', onWindowMouseDown, {
passive: true
});
dom.addEventListener(window, window.PointerEvent ? 'pointerup' : 'mouseup', onWindowMouseUp, {
passive: true
});
dom.addEventListener(window, 'touchstart', onWindowTouchStart, {
passive: true
});
['touchend', 'touchcancel'].forEach((event) => {
dom.addEventListener(window, event, onWindowTouchEnd, {
passive: true
});
});
} catch (e) {
require(['appRouter'], function(appRouter) {
appRouter.goHome();
@ -1356,9 +1395,17 @@ define(['playbackManager', 'dom', 'inputManager', 'datetime', 'itemHelper', 'med
dom.removeEventListener(window, window.PointerEvent ? 'pointerdown' : 'mousedown', onWindowMouseDown, {
passive: true
});
dom.removeEventListener(window, window.PointerEvent ? 'pointerup' : 'mouseup', onWindowMouseUp, {
passive: true
});
dom.removeEventListener(window, 'touchstart', onWindowTouchStart, {
passive: true
});
['touchend', 'touchcancel'].forEach((event) => {
dom.removeEventListener(window, event, onWindowTouchEnd, {
passive: true
});
});
stopOsdHideTimer();
headerElement.classList.remove('osdHeader');
headerElement.classList.remove('osdHeader-hidden');