1 IriSP.Widgets.Shortcuts = function(player, config) { |
1 import shortcutsStyles from "./Shortcuts.module.css"; |
2 IriSP.Widgets.Widget.call(this, player, config); |
|
3 }; |
|
4 |
2 |
5 /** |
3 const Shortcuts = function (ns) { |
6 * Keyboard shortcuts widget |
4 return class extends ns.Widgets.Widget { |
7 * This widgets add global shortcuts for common actions. |
5 constructor(player, config) { |
8 * The default shortcuts are: |
6 super(player, config); |
9 * - Control-space for play/pause |
7 } |
10 * - Control-left for rewind (+shift to go faster) |
|
11 * - Control-right for forward (+shift to go faster) |
|
12 */ |
|
13 IriSP.Widgets.Shortcuts.prototype = new IriSP.Widgets.Widget(); |
|
14 |
8 |
15 IriSP.Widgets.Shortcuts.prototype.defaults = { |
9 /** |
16 // Time increment, in ms, for backward/forward navigation |
10 * Keyboard shortcuts widget |
17 time_increment: 2000 |
11 * This widgets add global shortcuts for common actions. |
18 } |
12 * The default shortcuts are: |
|
13 * - Control-space for play/pause |
|
14 * - Control-left for rewind (+shift to go faster) |
|
15 * - Control-right for forward (+shift to go faster) |
|
16 */ |
|
17 static defaults = { |
|
18 // Time increment, in ms, for backward/forward navigation |
|
19 time_increment: 2000, |
|
20 }; |
19 |
21 |
20 IriSP.Widgets.Shortcuts.prototype.draw = function() { |
22 draw() { |
21 var _this = this; |
23 var _this = this; |
22 |
24 |
23 /* Standard shortcuts */ |
25 /* Standard shortcuts */ |
24 Mousetrap.bindGlobal("ctrl+space", function (e) { |
26 Mousetrap.bindGlobal("ctrl+space", function (e) { |
25 e.preventDefault(); |
27 e.preventDefault(); |
26 if (! _this.media.getPaused()) { |
28 if (!_this.media.getPaused()) { |
27 _this.media.pause(); |
29 _this.media.pause(); |
28 } else { |
30 } else { |
29 _this.media.play(); |
31 _this.media.play(); |
30 } |
32 } |
31 return false; |
33 return false; |
32 }); |
34 }); |
33 Mousetrap.bindGlobal("ctrl+left", function (e) { |
35 Mousetrap.bindGlobal("ctrl+left", function (e) { |
34 // Backward |
36 // Backward |
35 e.preventDefault(); |
37 e.preventDefault(); |
36 _this.media.setCurrentTime(Math.max(0, _this.media.getCurrentTime() - _this.time_increment)); |
38 _this.media.setCurrentTime( |
|
39 Math.max(0, _this.media.getCurrentTime() - _this.time_increment) |
|
40 ); |
37 return false; |
41 return false; |
38 }); |
42 }); |
39 Mousetrap.bindGlobal("ctrl+shift+left", function (e) { |
43 Mousetrap.bindGlobal("ctrl+shift+left", function (e) { |
40 // Backward |
44 // Backward |
41 e.preventDefault(); |
45 e.preventDefault(); |
42 _this.media.setCurrentTime(Math.max(0, _this.media.getCurrentTime() - 5 * _this.time_increment)); |
46 _this.media.setCurrentTime( |
|
47 Math.max(0, _this.media.getCurrentTime() - 5 * _this.time_increment) |
|
48 ); |
43 return false; |
49 return false; |
44 }); |
50 }); |
45 Mousetrap.bindGlobal("ctrl+right", function (e) { |
51 Mousetrap.bindGlobal("ctrl+right", function (e) { |
46 // Forward |
52 // Forward |
47 e.preventDefault(); |
53 e.preventDefault(); |
48 _this.media.setCurrentTime(Math.min(_this.media.duration, _this.media.getCurrentTime() + _this.time_increment)); |
54 _this.media.setCurrentTime( |
|
55 Math.min( |
|
56 _this.media.duration, |
|
57 _this.media.getCurrentTime() + _this.time_increment |
|
58 ) |
|
59 ); |
49 return false; |
60 return false; |
50 }); |
61 }); |
51 Mousetrap.bindGlobal("ctrl+shift+right", function (e) { |
62 Mousetrap.bindGlobal("ctrl+shift+right", function (e) { |
52 // Forward |
63 // Forward |
53 e.preventDefault(); |
64 e.preventDefault(); |
54 _this.media.setCurrentTime(Math.min(_this.media.duration, _this.media.getCurrentTime() + 5 * _this.time_increment)); |
65 _this.media.setCurrentTime( |
|
66 Math.min( |
|
67 _this.media.duration, |
|
68 _this.media.getCurrentTime() + 5 * _this.time_increment |
|
69 ) |
|
70 ); |
55 return false; |
71 return false; |
56 }); |
72 }); |
57 Mousetrap.bindGlobal("ctrl+a", function (e) { |
73 Mousetrap.bindGlobal("ctrl+a", function (e) { |
58 // Annotate |
74 // Annotate |
59 e.preventDefault(); |
75 e.preventDefault(); |
60 _this.player.trigger("CreateAnnotation.toggle"); |
76 _this.player.trigger("CreateAnnotation.toggle"); |
61 return false; |
77 return false; |
62 }); |
78 }); |
|
79 } |
|
80 }; |
|
81 }; |
63 |
82 |
64 }; |
83 export { Shortcuts, shortcutsStyles }; |