Added key bindings for loop
This commit is contained in:
parent
9c599884a8
commit
1fd742464d
4
dist/plyr.js
vendored
4
dist/plyr.js
vendored
File diff suppressed because one or more lines are too long
22
readme.md
22
readme.md
@ -672,7 +672,12 @@ player.source({
|
||||
srclang:'en',
|
||||
src: '/path/to/captions.vtt',
|
||||
default: true
|
||||
}]
|
||||
}],
|
||||
loopKeyEvents: {
|
||||
toggleLoop: 76,
|
||||
loopin: 73,
|
||||
loopout: 79
|
||||
}
|
||||
});
|
||||
```
|
||||
|
||||
@ -988,6 +993,21 @@ By default, a player will bind the following keyboard shortcuts when it has focu
|
||||
<td>✔</td>
|
||||
<td>Toggle captions</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>l</code></td>
|
||||
<td></td>
|
||||
<td>Toggle Loop All/No Loop</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>i</code></td>
|
||||
<td></td>
|
||||
<td>Set the start marker of the loop</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>o</code></td>
|
||||
<td></td>
|
||||
<td>Set the end marker of the loop</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
|
@ -40,6 +40,11 @@
|
||||
loop: false,
|
||||
loopin: 0,
|
||||
loopout: null,
|
||||
loopKeyEvents: {
|
||||
toggleLoop: 76,
|
||||
loopin: 73,
|
||||
loopout: 79
|
||||
},
|
||||
seekTime: 10,
|
||||
volume: 10,
|
||||
volumeMin: 0,
|
||||
@ -2463,7 +2468,7 @@
|
||||
|
||||
// Toggle loop
|
||||
function toggleLoop(toggle) {
|
||||
if (['loopin', 'loopout', 'loopall'].indexOf(toggle) === -1) {
|
||||
if (['loopin', 'loopout', 'loopall', 'toggle'].indexOf(toggle) === -1) {
|
||||
toggle = 'loopclear';
|
||||
}
|
||||
|
||||
@ -2486,6 +2491,15 @@
|
||||
config.loopin = 0;
|
||||
config.loopout = plyr.media.duration - 2;
|
||||
break;
|
||||
case 'toggle':
|
||||
if (config.loop) {
|
||||
config.loopin = 0;
|
||||
config.loopout = null;
|
||||
} else {
|
||||
config.loopin = 0;
|
||||
config.loopout = plyr.media.duration - 2;
|
||||
}
|
||||
break;
|
||||
default:
|
||||
config.loopin = 0;
|
||||
config.loopout = null;
|
||||
@ -3528,8 +3542,9 @@
|
||||
// Which keycodes should we prevent default
|
||||
var preventDefault = [48, 49, 50, 51, 52, 53, 54, 56, 57, 32, 75, 38, 40, 77, 39, 37, 70, 67];
|
||||
var checkFocus = [38, 40];
|
||||
var loopKeyEventsValues = Object.values(config.loopKeyEvents);
|
||||
|
||||
if (inArray(checkFocus, code)) {
|
||||
if (inArray(checkFocus, code) || inArray(loopKeyEventsValues, code)) {
|
||||
var focused = getFocusElement();
|
||||
|
||||
if (is.htmlElement(focused) && getFocusElement().type === "radio") {
|
||||
@ -3608,6 +3623,29 @@
|
||||
break;
|
||||
}
|
||||
|
||||
//Loop events
|
||||
var loopKeyBindings = config.loopKeyEvents;
|
||||
var hasBindedKey = loopKeyEventsValues.filter(function(el) {
|
||||
return preventDefault.indexOf(el) > -1;
|
||||
}).length >= 1;
|
||||
|
||||
if (hasBindedKey) {
|
||||
loopKeyBindings = defaults.loopKeyEvents;
|
||||
}
|
||||
console.log(loopKeyBindings,'~~~loopKeyBindings')
|
||||
|
||||
switch (code) {
|
||||
case loopKeyBindings.toggleLoop:
|
||||
toggleLoop('toggle');
|
||||
break;
|
||||
case loopKeyBindings.loopin:
|
||||
toggleLoop('loopin');
|
||||
break;
|
||||
case loopKeyBindings.loopout:
|
||||
toggleLoop('loopout');
|
||||
break;
|
||||
}
|
||||
|
||||
// Escape is handle natively when in full screen
|
||||
// So we only need to worry about non native
|
||||
if (!support.fullscreen && plyr.isFullscreen && code === 27) {
|
||||
|
Loading…
x
Reference in New Issue
Block a user