Change keyboard shortcuts to match youtube

Use the same keyboard shortcuts than Youtube.
Add shortcut tooltips in titles.
Make sure tab is focused before handling gampad events.
This commit is contained in:
Jean-Samuel Aubry-Guzzi 2019-04-25 12:35:02 -04:00 committed by DrPandemic
parent df3d3bc7d3
commit 658aedf96a
No known key found for this signature in database
GPG Key ID: B6A2F8AEC8AD2825
2 changed files with 47 additions and 22 deletions

View File

@ -530,7 +530,7 @@ define(["playbackManager", "dom", "inputmanager", "datetime", "itemHelper", "med
view.querySelector(".btnFullscreen").setAttribute("title", globalize.translate("ExitFullscreen"));
view.querySelector(".btnFullscreen i").innerHTML = "";
} else {
view.querySelector(".btnFullscreen").setAttribute("title", globalize.translate("Fullscreen"));
view.querySelector(".btnFullscreen").setAttribute("title", globalize.translate("Fullscreen") + " (f)");
view.querySelector(".btnFullscreen i").innerHTML = "";
}
}
@ -713,7 +713,14 @@ define(["playbackManager", "dom", "inputmanager", "datetime", "itemHelper", "med
}
function updatePlayPauseState(isPaused) {
view.querySelector(".btnPause i").innerHTML = isPaused ? "" : "";
var button = view.querySelector(".btnPause i");
if (isPaused) {
button.innerHTML = "";
button.setAttribute("title", globalize.translate("ButtonPlay") + " (k)");
} else {
button.innerHTML = "";
button.setAttribute("title", globalize.translate("ButtonPause") + " (k)");
}
}
function updatePlayerStateInternal(event, player, state) {
@ -836,10 +843,10 @@ define(["playbackManager", "dom", "inputmanager", "datetime", "itemHelper", "med
}
if (isMuted) {
view.querySelector(".buttonMute").setAttribute("title", globalize.translate("Unmute"));
view.querySelector(".buttonMute").setAttribute("title", globalize.translate("Unmute") + " (m)");
view.querySelector(".buttonMute i").innerHTML = "";
} else {
view.querySelector(".buttonMute").setAttribute("title", globalize.translate("Mute"));
view.querySelector(".buttonMute").setAttribute("title", globalize.translate("Mute") + " (m)");
view.querySelector(".buttonMute i").innerHTML = "";
}
@ -1013,43 +1020,61 @@ define(["playbackManager", "dom", "inputmanager", "datetime", "itemHelper", "med
}
function onWindowKeyDown(e) {
if (!currentVisibleMenu && (32 === e.keyCode || 13 === e.keyCode)) {
if (!currentVisibleMenu && 32 === e.keyCode) {
playbackManager.playPause(currentPlayer);
return void showOsd();
}
switch (e.key) {
case "f":
if (!e.ctrlKey) {
playbackManager.toggleFullscreen(currentPlayer);
}
case "k":
playbackManager.playPause(currentPlayer);
showOsd();
break;
case "l":
case "ArrowRight":
case "Right":
playbackManager.fastForward(currentPlayer);
showOsd();
break;
case "j":
case "ArrowLeft":
case "Left":
playbackManager.rewind(currentPlayer);
showOsd();
break;
case "f":
if (!e.ctrlKey && !e.metaKey) {
playbackManager.toggleFullscreen(currentPlayer);
showOsd();
}
break;
case "m":
playbackManager.toggleMute(currentPlayer);
showOsd();
break;
case "ArrowLeft":
case "Left":
case "NavigationLeft":
case "GamepadDPadLeft":
case "GamepadLeftThumbstickLeft":
if (e.shiftKey) {
// Ignores gamepad events that are always triggered, even when not focused.
if (document.hasFocus()) {
playbackManager.rewind(currentPlayer);
showOsd();
}
break;
case "ArrowRight":
case "Right":
case "NavigationRight":
case "GamepadDPadRight":
case "GamepadLeftThumbstickRight":
if (e.shiftKey) {
// Ignores gamepad events that are always triggered, even when not focused.
if (document.hasFocus()) {
playbackManager.fastForward(currentPlayer);
showOsd();
}
}
}

View File

@ -37,7 +37,7 @@
<i class="xlargePaperIconButton md-icon">&#xE045;</i>
</button>
<button is="paper-icon-button-light" class="btnRewind" title="${Rewind}">
<button is="paper-icon-button-light" class="btnRewind" title="${Rewind} (j)">
<i class="xlargePaperIconButton md-icon">&#xE020;</i>
</button>
@ -45,7 +45,7 @@
<i class="xlargePaperIconButton md-icon">&#xE034;</i>
</button>
<button is="paper-icon-button-light" class="btnFastForward" title="${FastForward}">
<button is="paper-icon-button-light" class="btnFastForward" title="${FastForward} (l)">
<i class="xlargePaperIconButton md-icon">&#xE01F;</i>
</button>
@ -62,7 +62,7 @@
<button is="paper-icon-button-light" class="btnVideoOsdSettings hide autoSize" title="${Settings}">
<i class="largePaperIconButton md-icon">&#xE8B8;</i>
</button>
<button is="paper-icon-button-light" class="btnFullscreen hide autoSize" title="${Fullscreen}">
<button is="paper-icon-button-light" class="btnFullscreen hide autoSize" title="${Fullscreen} (f)">
<i class="xlargePaperIconButton md-icon">&#xE5D0;</i>
</button>
<button is="paper-icon-button-light" class="btnPip hide autoSize" title="${PictureInPicture}">
@ -72,7 +72,7 @@
<div class="osdTimeText"><span class="osdPositionText"></span><span class="osdDurationText"></span><span class="endsAtText"></span></div>
<div class="volumeButtons hide-mouse-idle-tv">
<button is="paper-icon-button-light" class="buttonMute autoSize" title="${Mute}">
<button is="paper-icon-button-light" class="buttonMute autoSize" title="${Mute} (m)">
<i class="xlargePaperIconButton md-icon">&#xE050;</i>
</button>
<div class="sliderContainer osdVolumeSliderContainer">
@ -82,4 +82,4 @@
</div>
</div>
</div>
</div>
</div>