j1-template 2024.3.15 → 2024.3.16

Sign up to get free protection for your applications and to get access to all the features.
Files changed (128) hide show
  1. checksums.yaml +4 -4
  2. data/assets/data/amplitude.html +7 -7
  3. data/assets/data/panel.html +4 -3
  4. data/assets/theme/j1/adapter/js/amplitude.js +100 -81
  5. data/assets/theme/j1/adapter/js/masonry.js +2 -2
  6. data/assets/theme/j1/adapter/js/videojs.js +212 -0
  7. data/assets/theme/j1/core/css/themes/unolight/bootstrap.css +7 -4
  8. data/assets/theme/j1/core/css/themes/unolight/bootstrap.css.map +1 -1
  9. data/assets/theme/j1/core/css/themes/unolight/bootstrap.min.css +1 -1
  10. data/assets/theme/j1/core/css/themes/unolight/bootstrap.min.css.map +1 -1
  11. data/assets/theme/j1/core/js/template.js +4 -0
  12. data/assets/theme/j1/core/js/template.min.js +2 -2
  13. data/assets/theme/j1/core/js/template.min.js.map +1 -1
  14. data/assets/theme/j1/modules/amplitudejs/css/theme/uno/dark/amplitude.css +81 -1
  15. data/assets/theme/j1/modules/amplitudejs/css/theme/uno/dark/amplitude.min.css +1 -1
  16. data/assets/theme/j1/modules/amplitudejs/css/theme/uno/dark/player/compact.css +3 -2
  17. data/assets/theme/j1/modules/amplitudejs/css/theme/uno/dark/player/compact.min.css +1 -1
  18. data/assets/theme/j1/modules/amplitudejs/css/theme/uno/dark/player/large.css +19 -4
  19. data/assets/theme/j1/modules/amplitudejs/css/theme/uno/dark/player/large.min.css +1 -1
  20. data/assets/theme/j1/modules/amplitudejs/icons/player/dark/artist.svg +78 -0
  21. data/assets/theme/j1/modules/amplitudejs/icons/player/dark/mute.svg +52 -20
  22. data/assets/theme/j1/modules/amplitudejs/icons/player/dark/next.svg +20 -39
  23. data/assets/theme/j1/modules/amplitudejs/icons/player/dark/now-playing.svg +24 -38
  24. data/assets/theme/j1/modules/amplitudejs/icons/player/dark/playlist-hide.svg +85 -0
  25. data/assets/theme/j1/modules/amplitudejs/icons/player/dark/playlist-music.svg +85 -0
  26. data/assets/theme/j1/modules/amplitudejs/icons/player/dark/playlist-show.svg +85 -0
  27. data/assets/theme/j1/modules/amplitudejs/icons/player/dark/playlist.svg +85 -0
  28. data/assets/theme/j1/modules/amplitudejs/icons/player/dark/previous.svg +18 -37
  29. data/assets/theme/j1/modules/amplitudejs/icons/player/dark/skip-backward.svg +33 -30
  30. data/assets/theme/j1/modules/amplitudejs/icons/player/dark/skip-forward.svg +33 -29
  31. data/assets/theme/j1/modules/amplitudejs/icons/player/dark/small/next.svg +55 -14
  32. data/assets/theme/j1/modules/amplitudejs/icons/player/dark/small/previous.svg +56 -14
  33. data/assets/theme/j1/modules/amplitudejs/icons/player/dark/volume.svg +38 -21
  34. data/assets/theme/j1/modules/amplitudejs/js/amplitude.map +20 -20
  35. data/assets/theme/j1/modules/amplitudejs/js/tech/youtube_example.js +211 -0
  36. data/assets/theme/j1/modules/lightGallery/js/plugins/lg-video.js +206 -122
  37. data/assets/theme/j1/modules/videojs/assets/icons/custom-icons/next.svg +82 -0
  38. data/assets/theme/j1/modules/videojs/css/font/README.md +151 -0
  39. data/assets/theme/j1/modules/videojs/css/font/VideoJS.svg +150 -0
  40. data/assets/theme/j1/modules/videojs/css/font/video-js-cdn.css +2012 -0
  41. data/assets/theme/j1/modules/videojs/css/plugins/controls/skipbuttons.0.css +32 -0
  42. data/assets/theme/j1/modules/videojs/css/plugins/controls/skipbuttons.1.css +31 -0
  43. data/assets/theme/j1/modules/videojs/css/plugins/controls/skipbuttons.css +31 -0
  44. data/assets/theme/j1/modules/videojs/css/plugins/controls/skipbuttons.min.css +21 -0
  45. data/assets/theme/j1/modules/videojs/css/themes/uno.css +14 -3
  46. data/assets/theme/j1/modules/videojs/css/themes/uno.min.css +1 -1
  47. data/assets/theme/j1/modules/videojs/css/videojs.css +1 -0
  48. data/assets/theme/j1/modules/videojs/js/plugins/controls/autocaption/LICENSE +13 -0
  49. data/assets/theme/j1/modules/videojs/js/plugins/controls/autocaption/README.md +75 -0
  50. data/assets/theme/j1/modules/videojs/js/plugins/controls/autocaption/autocaption.js +149 -0
  51. data/assets/theme/j1/modules/videojs/js/plugins/controls/autocaption/autocaption.min.js +21 -0
  52. data/assets/theme/j1/modules/videojs/js/plugins/controls/hotkeys/README.md +76 -30
  53. data/assets/theme/j1/modules/videojs/js/plugins/controls/hotkeys/hotkeys.js +64 -53
  54. data/assets/theme/j1/modules/videojs/js/plugins/controls/hotkeys/hotkeys.min.js +1 -1
  55. data/assets/theme/j1/modules/videojs/js/plugins/controls/skipbuttons/README.md +133 -0
  56. data/assets/theme/j1/modules/videojs/js/plugins/controls/skipbuttons/skipbuttons.js +137 -0
  57. data/assets/theme/j1/modules/videojs/js/plugins/controls/skipbuttons/skipbuttons.min.js +21 -0
  58. data/assets/theme/j1/modules/videojs/js/plugins/controls/zoom/zoom.js +15 -12
  59. data/assets/theme/j1/modules/videojs/js/plugins/players/yt/youtube.js +43 -16
  60. data/lib/j1/patches/rubygems/eventmachine-1.2.7-x64-mingw32/lib/3.3/fastfilereaderext.so +0 -0
  61. data/lib/j1/patches/rubygems/eventmachine-1.2.7-x64-mingw32/lib/3.3/rubyeventmachine.so +0 -0
  62. data/lib/j1/patches/rubygems/eventmachine-1.2.7-x64-mingw32/lib/3.4/fastfilereaderext.so +0 -0
  63. data/lib/j1/patches/rubygems/eventmachine-1.2.7-x64-mingw32/lib/3.4/rubyeventmachine.so +0 -0
  64. data/lib/j1/version.rb +1 -1
  65. data/lib/j1_app/j1_auth_manager/config.rb +0 -4
  66. data/lib/starter_web/Gemfile +45 -22
  67. data/lib/starter_web/README.md +5 -5
  68. data/lib/starter_web/_config.yml +4 -6
  69. data/lib/starter_web/_data/modules/amplitude.yml +9 -399
  70. data/lib/starter_web/_data/modules/defaults/gallery.yml +42 -0
  71. data/lib/starter_web/_data/modules/defaults/videojs.yml +107 -0
  72. data/lib/starter_web/_data/modules/gallery.yml +30 -14
  73. data/lib/starter_web/_data/modules/masonry.yml +15 -0
  74. data/lib/starter_web/_data/modules/videojs.yml +57 -0
  75. data/lib/starter_web/_data/resources.yml +9 -27
  76. data/lib/starter_web/_data/templates/feed.xml +1 -1
  77. data/lib/starter_web/_includes/tables/jekyll_variables.asciidoc +1 -0
  78. data/lib/starter_web/_plugins/asciidoctor/dailymotion-block.rb +4 -1
  79. data/lib/starter_web/_plugins/asciidoctor/videojs-block.rb +145 -24
  80. data/lib/starter_web/_plugins/asciidoctor/vimeo-block.rb +4 -1
  81. data/lib/starter_web/_plugins/asciidoctor/wistia-block.rb +313 -0
  82. data/lib/starter_web/_plugins/asciidoctor/youtube-block.rb +192 -17
  83. data/lib/starter_web/_plugins/index/lunr.rb +1 -1
  84. data/lib/starter_web/package.json +1 -1
  85. data/lib/starter_web/pages/public/amplitude_yt_tester.adoc +20 -7
  86. data/lib/starter_web/pages/public/manuals/integrations/amplitudejs/amplitudejs-api.adoc +1 -1
  87. data/lib/starter_web/pages/public/manuals/integrations/videojs/youtube-api.adoc +1638 -0
  88. data/lib/starter_web/pages/public/tools/previewer/preview_bootstrap_theme.adoc +5 -6
  89. data/lib/starter_web/pages/public/tools/previewer/preview_videojs.adoc +203 -0
  90. data/lib/starter_web/pages/{tour → public/tour}/play_audio.adoc +3 -10
  91. data/lib/starter_web/pages/{tour → public/tour}/play_video.adoc +49 -40
  92. metadata +61 -41
  93. data/assets/theme/j1/modules/amplitudejs/icons/player/dark/_pause.svg +0 -19
  94. data/assets/theme/j1/modules/amplitudejs/icons/player/dark/_play.svg +0 -18
  95. data/assets/theme/j1/modules/amplitudejs/icons/player/dark/show-playlist.svg +0 -15
  96. data/assets/theme/j1/modules/jqueryScrollbar/LICENSE +0 -20
  97. data/assets/theme/j1/modules/jqueryScrollbar/README.md +0 -28
  98. data/assets/theme/j1/modules/jqueryScrollbar/css/scrollbar.css +0 -939
  99. data/assets/theme/j1/modules/jqueryScrollbar/css/scrollbar.min.css +0 -20
  100. data/assets/theme/j1/modules/jqueryScrollbar/js/scrollbar.js +0 -851
  101. data/assets/theme/j1/modules/jqueryScrollbar/js/scrollbar.min.js +0 -36
  102. data/assets/theme/j1/modules/jqueryScrollbar/sass/scrollbar.scss +0 -806
  103. data/assets/theme/j1/modules/lightGallery/js/plugins/lg-video.0.js +0 -794
  104. /data/lib/starter_web/pages/{tour → public/tour}/_includes/attributes.asciidoc +0 -0
  105. /data/lib/starter_web/pages/{tour → public/tour}/_includes/documents/100_gistblock.asciidoc +0 -0
  106. /data/lib/starter_web/pages/{tour → public/tour}/_includes/documents/410_bottom_info.asciidoc +0 -0
  107. /data/lib/starter_web/pages/{tour → public/tour}/_includes/documents/410_bottom_left_warning.asciidoc +0 -0
  108. /data/lib/starter_web/pages/{tour → public/tour}/_includes/documents/410_bottom_right_danger.asciidoc +0 -0
  109. /data/lib/starter_web/pages/{tour → public/tour}/_includes/documents/410_central_success.asciidoc +0 -0
  110. /data/lib/starter_web/pages/{tour → public/tour}/_includes/documents/410_full_height_left_info.asciidoc +0 -0
  111. /data/lib/starter_web/pages/{tour → public/tour}/_includes/documents/410_full_height_right_success.asciidoc +0 -0
  112. /data/lib/starter_web/pages/{tour → public/tour}/_includes/documents/410_table_bs_modal_examples.asciidoc +0 -0
  113. /data/lib/starter_web/pages/{tour → public/tour}/_includes/documents/410_top_info.asciidoc +0 -0
  114. /data/lib/starter_web/pages/{tour → public/tour}/_includes/documents/410_top_left_info.asciidoc +0 -0
  115. /data/lib/starter_web/pages/{tour → public/tour}/_includes/documents/410_top_right_success.asciidoc +0 -0
  116. /data/lib/starter_web/pages/{tour → public/tour}/_includes/documents/419_advanced_modals_demo.asciidoc +0 -0
  117. /data/lib/starter_web/pages/{tour → public/tour}/_includes/documents/tables/bs_modal_examples.asciidoc +0 -0
  118. /data/lib/starter_web/pages/{tour → public/tour}/_includes/documents/themes_bootstrap.asciidoc +0 -0
  119. /data/lib/starter_web/pages/{tour → public/tour}/_includes/documents/themes_rouge.asciidoc +0 -0
  120. /data/lib/starter_web/pages/{tour → public/tour}/asciidoc_extensions.adoc +0 -0
  121. /data/lib/starter_web/pages/{tour → public/tour}/bootstrap_themes.adoc +0 -0
  122. /data/lib/starter_web/pages/{tour → public/tour}/highlghter_rouge.adoc +0 -0
  123. /data/lib/starter_web/pages/{tour → public/tour}/icon_fonts.adoc +0 -0
  124. /data/lib/starter_web/pages/{tour → public/tour}/modal_extentions.adoc +0 -0
  125. /data/lib/starter_web/pages/{tour → public/tour}/present_images.adoc +0 -0
  126. /data/lib/starter_web/pages/{tour → public/tour}/quicksearch.adoc +0 -0
  127. /data/lib/starter_web/pages/{tour → public/tour}/responsive_tables.adoc +0 -0
  128. /data/lib/starter_web/pages/{tour → public/tour}/typography.adoc +0 -0
@@ -0,0 +1,32 @@
1
+ /*
2
+ # -----------------------------------------------------------------------------
3
+ # ~/assets/theme/j1/modules/videojs/css/plugins/controls/skipbuttons.css
4
+ # Provides CSS Styles for the VideoJS (V8) plugin skipbuttons
5
+ # See: https://github.com/mister-ben/videojs-seek-buttons/edit/master/README.md
6
+ #
7
+ # Product/Info:
8
+ # https://github.com/mister-ben/videojs-seek-buttons
9
+ # http://jekyll.one
10
+ #
11
+ # Copyright (C) 2023 mister-ben
12
+ # Copyright (C) 2023, 2024 Juergen Adams
13
+ #
14
+ # skipbuttons is licensed under the Apache License 2.0.
15
+ # See: https://github.com/mister-ben/videojs-seek-buttons/blob/master/LICENSE
16
+ # J1 Theme is licensed under MIT License.
17
+ # See: https://github.com/jekyll-one-org/j1-template/blob/main/LICENSE
18
+ # -----------------------------------------------------------------------------
19
+ */
20
+
21
+ .video-js .vjs-seek-button {
22
+ cursor: pointer
23
+ }
24
+
25
+ .video-js .vjs-seek-button.skip-backward .vjs-icon-placeholder::before {
26
+ transform: rotate(-45deg)
27
+ }
28
+
29
+ .video-js .vjs-seek-button.skip-forward .vjs-icon-placeholder::before {
30
+ transform: scale(-1, 1) rotate(-45deg)
31
+ }
32
+
@@ -0,0 +1,31 @@
1
+ /*
2
+ # -----------------------------------------------------------------------------
3
+ # ~/assets/theme/j1/modules/videojs/css/plugins/controls/skipbuttons.css
4
+ # Provides CSS Styles for the VideoJS (V8) plugin skipbuttons
5
+ # See: https://github.com/mister-ben/videojs-seek-buttons/edit/master/README.md
6
+ #
7
+ # Product/Info:
8
+ # https://github.com/mister-ben/videojs-seek-buttons
9
+ # http://jekyll.one
10
+ #
11
+ # Copyright (C) 2023 mister-ben
12
+ # Copyright (C) 2023, 2024 Juergen Adams
13
+ #
14
+ # skipbuttons is licensed under the Apache License 2.0.
15
+ # See: https://github.com/mister-ben/videojs-seek-buttons/blob/master/LICENSE
16
+ # J1 Theme is licensed under MIT License.
17
+ # See: https://github.com/jekyll-one-org/j1-template/blob/main/LICENSE
18
+ # -----------------------------------------------------------------------------
19
+ */
20
+
21
+ .video-js .vjs-next-item-button {
22
+ cursor: pointer
23
+ }
24
+
25
+ .video-js .vjs-next-item-button.skip-backward .vjs-icon-placeholder::before {
26
+ transform: rotate(-45deg)
27
+ }
28
+
29
+ .video-js .vjs-next-item-button.skip-forward .vjs-icon-placeholder::before {
30
+ transform: scale(-1, 1) rotate(-45deg)
31
+ }
@@ -0,0 +1,31 @@
1
+ /*
2
+ # -----------------------------------------------------------------------------
3
+ # ~/assets/theme/j1/modules/videojs/css/plugins/controls/skipbuttons.css
4
+ # Provides CSS Styles for the VideoJS (V8) plugin skipbuttons
5
+ # See: https://github.com/mister-ben/videojs-seek-buttons/edit/master/README.md
6
+ #
7
+ # Product/Info:
8
+ # https://github.com/mister-ben/videojs-seek-buttons
9
+ # http://jekyll.one
10
+ #
11
+ # Copyright (C) 2023 mister-ben
12
+ # Copyright (C) 2023, 2024 Juergen Adams
13
+ #
14
+ # skipbuttons is licensed under the Apache License 2.0.
15
+ # See: https://github.com/mister-ben/videojs-seek-buttons/blob/master/LICENSE
16
+ # J1 Theme is licensed under MIT License.
17
+ # See: https://github.com/jekyll-one-org/j1-template/blob/main/LICENSE
18
+ # -----------------------------------------------------------------------------
19
+ */
20
+
21
+ .video-js .vjs-seek-button {
22
+ cursor: pointer
23
+ }
24
+
25
+ .video-js .vjs-seek-button.skip-backward .vjs-icon-placeholder::before {
26
+ transform: rotate(-45deg)
27
+ }
28
+
29
+ .video-js .vjs-seek-button.skip-forward .vjs-icon-placeholder::before {
30
+ transform: scale(-1, 1) rotate(-45deg)
31
+ }
@@ -0,0 +1,21 @@
1
+ /*
2
+ # -----------------------------------------------------------------------------
3
+ # ~/assets/theme/j1/modules/videojs/css/plugins/controls/skipbuttons.min.css
4
+ # Provides CSS Styles for the VideoJS (V8) plugin skipbuttons
5
+ # See: https://github.com/mister-ben/videojs-seek-buttons/edit/master/README.md
6
+ #
7
+ # Product/Info:
8
+ # https://github.com/mister-ben/videojs-seek-buttons
9
+ # http://jekyll.one
10
+ #
11
+ # Copyright (C) 2023 mister-ben
12
+ # Copyright (C) 2023, 2024 Juergen Adams
13
+ #
14
+ # skipbuttons is licensed under the Apache License 2.0.
15
+ # See: https://github.com/mister-ben/videojs-seek-buttons/blob/master/LICENSE
16
+ # J1 Theme is licensed under MIT License.
17
+ # See: https://github.com/jekyll-one-org/j1-template/blob/main/LICENSE
18
+ # -----------------------------------------------------------------------------
19
+ */
20
+
21
+ .video-js .vjs-seek-button{cursor:pointer}.video-js .vjs-seek-button.skip-back .vjs-icon-placeholder::before{transform:rotate(-45deg)}.video-js .vjs-seek-button.skip-forward .vjs-icon-placeholder::before{transform:scale(-1,1) rotate(-45deg)}
@@ -46,18 +46,29 @@
46
46
  ------------------------------------------------------------------------------- */
47
47
  picture > img {
48
48
  max-width: 100%;
49
- height: auto;
49
+ /* jadams, 2024-11-11: ToDo (fix) */
50
+ /* workaround, height: make image -1 pixel smaller */
51
+ /* height: calc(100% + 1px); */
52
+ }
53
+
54
+ .vjs-poster {
55
+ height: 100%;
56
+ /* jadams, 2024-11-11: ToDo (fix) */
57
+ /* workaround, height: make poster -5 pixel smaller */
58
+ /* height: calc(100% + 1px); */
50
59
  }
51
60
 
52
61
  /* controlbar|controls
53
62
  ------------------------------------------------------------------------------- */
54
63
  .vjs-theme-uno .vjs-control-bar {
55
- height: 50px;
64
+ /* jadams, 2024-11-15: set control-bar heigth|position */
65
+ height: 55px;
66
+ top: calc(100% - 54px);
56
67
  background-color: var(--vjs-theme-uno--gray-900);
57
68
  z-index: 100;
58
69
  }
59
70
 
60
- /* auto hide VJS controlbar on video is paused */
71
+ /* auto hide VJS controlbar when video is paused */
61
72
  .vjs-has-started.vjs-user-inactive.vjs-paused .vjs-control-bar {
62
73
  visibility: visible;
63
74
  opacity: 0;
@@ -16,4 +16,4 @@
16
16
  # -----------------------------------------------------------------------------
17
17
  */
18
18
 
19
- .vjs-theme-uno{--vjs-theme-uno--blue-300:#64b5f6;--vjs-theme-uno--blue-600:#1e88e5;--vjs-theme-uno--blue-800:#1565c0;--vjs-theme-uno--gray-200:var(--vjs-theme-uno--gray-200);--vjs-theme-uno--gray-900:#212121;--vjs-theme-uno--primary:#2196f3;--vjs-theme-uno--secondary:#fff}.video-js .vjs-text-track-display div{font-size:1.75rem}.video-js .vjs-text-track-display>div>div>div{background:transparent !important;display:inline-block !important;line-height:33px !important;padding:5px !important;text-shadow:1px 1px 2px #000}picture>img{max-width:100%;height:auto}.vjs-theme-uno .vjs-control-bar{height:50px;background-color:var(--vjs-theme-uno--gray-900);z-index:100}.vjs-has-started.vjs-user-inactive.vjs-paused .vjs-control-bar{visibility:visible;opacity:0;transition:visibility 1s,opacity 1s}.vjs-playback-rate{margin-top:10px !important}.vjs-theme-uno .vjs-current-time{display:none}.vjs-theme-uno .vjs-time-divider{display:none}.vjs-theme-uno .vjs-duration{display:block}.vjs-theme-uno .vjs-remaining-time{display:block}.vjs-icon-play:before{content:"\f101"}.vjs-theme-uno .vjs-big-play-button{top:30%;left:40%;width:240px;height:240px;font-size:0;z-index:1;background:url(/assets/theme/j1/modules/videojs/assets/icons/big-play-button.svg) no-repeat}.vjs-theme-uno .vjs-big-play-button:hover{top:30%;left:40%;width:240px;height:240px;font-size:0;z-index:1;background:url(/assets/theme/j1/modules/videojs/assets/icons/big-play-button-hover.svg) no-repeat}.vjs-theme-uno.vjs-big-play-button:focus,.vjs-theme-uno:hover .vjs-big-play-button{background-color:transparent}.vjs-theme-uno .vjs-button>.vjs-icon-placeholder:before,.vjs-theme-uno .vjs-time-control{line-height:54px}.vjs-theme-uno .vjs-play-control{font-size:1.5em;position:relative}.vjs-theme-uno .vjs-volume-panel{order:4}.vjs-theme-uno .vjs-volume-bar{margin-top:2.5em}.vjs-themeuno .vjs-volume-panel:hover .vjs-volume-control.vjs-volume-horizontal{height:100%}.vjs-theme-uno .vjs-progress-control .vjs-progress-holder,.vjs-theme-uno .vjs-progress-control:hover .vjs-progress-holder{font-size:1.5em}.vjs-theme-uno .vjs-play-control .vjs-icon-placeholder:before{height:1.3em;width:1.3em;margin-top:.2em;border-radius:1em;border:3px solid var(--vjs-theme-uno--secondary);top:2px;left:9px;line-height:1.1}.vjs-theme-uno .vjs-play-control:hover .vjs-icon-placeholder:before{border:3px solid var(--vjs-theme-uno--secondary)}.vjs-theme-uno .vjs-play-progress,.vjs-theme-uno .vjs-play-progress:before{background-color:var(--vjs-theme-uno--primary)}.vjs-theme-uno .vjs-play-progress:before{height:.8em;width:.8em;content:"";border:4px solid var(--vjs-theme-uno--secondary);border-radius:.8em;top:-.25em}.vjs-theme-uno .vjs-progress-control{font-size:14px}.vjs-theme-uno .vjs-fullscreen-control{order:6}.vjs-theme-uno.nyan .vjs-play-progress{background:linear-gradient(180deg,#fe0000 0,#fe9a01 16.666666667%,#fe9a01 0,#ff0 33.332666667%,#ff0 0,#32ff00 49.999326667%,#32ff00 0,#0099fe 66.6659926%,#0099fe 0,#63f 83.33266%,#63f 0)}.vjs-theme-uno.nyan .vjs-play-progress:before{height:1.3em;width:1.3em;background:url("data:image/svg+xml;charset=utf-8,%3Csvgxmlns='http://www.w3.org/2000/svg'viewBox='00100125'fill='%23fff'%3E%3Cpathd='M62.15337.323h2.813v3.246h-2.813zM64.85840.569h2.813v3.246h-2.813zM67.67243.814h11.9v3.246h-11.9zM79.57224.449h2.813v19.365h-2.813zM82.38637.323h3.244v3.246h-3.244zM85.6334.132h5.627v3.246H85.63zM91.25737.323h2.92v12.95h-2.92zM94.17750.274h2.922V66.21h-2.922zM91.2966.372h2.887v3.245H91.29zM88.40169.617h2.889v3.246h-2.889zM27.31272.863h61.003v3.245H27.312zM73.62276.108h2.889v3.246h-2.889zM82.56376.108h2.888v3.246h-2.888zM76.51179.354h6.053v3.245h-6.053zM61.94179.354h8.895v3.245h-8.895zM67.94776.108h2.889v3.246h-2.889zM59.32176.108h2.888v3.246h-2.888zM27.31217.917h49.387v3.246H27.312zM76.69921.162h2.873v3.287h-2.873zM56.37234.132h5.781v3.191h-5.781zM53.44837.323h2.924v12.951h-2.924zM50.48850.274h2.96v16.049h-2.96zM53.44866.323h2.924v3.257h-2.924zM56.37269.58h2.949v3.283h-2.949zM65.06963.213h2.878v6.367h-2.878zM67.94766.397h17.504v3.22H67.947z'/%3E%3Cpathd='M82.56363.213h2.888v3.185h-2.888zM73.80163.213h2.898v3.185h-2.898zM76.69956.774h2.873v3.145h-2.873zM82.56356.774h2.888v3.145h-2.888zM85.45153.444h2.864v3.33h-2.864z'/%3E%3Cpathd='M85.45156.774h2.864v3.145h-2.864zM65.06953.444h2.878v3.33h-2.878zM65.06956.774h2.878v3.145h-2.878zM62.20956.774h2.86v3.145h-2.86zM21.50924.327h2.813v45.169h-2.813zM24.32321.162h2.99v3.165h-2.99zM18.56269.496h8.75v3.367h-8.75zM15.65672.863h2.906v9.591h-2.906zM18.56279.301h8.75v3.153h-8.75zM24.32376.108h5.743V79.3h-5.743zM33.13676.108h2.824v6.346h-2.824zM35.9679.281h5.813v3.173H35.96zM41.77476.108h2.864v3.173h-2.864zM3.94840.569h11.708v3.229H3.948zM3.94843.814h2.921v6.459H3.948zM6.86947.06h2.934v6.384H6.869zM9.80350.274h2.909v6.5H9.803z'/%3E%3Cpathd='M12.71153.444h2.945v6.475h-2.945zM15.65656.774h5.853v3.145h-5.853z'/%3E%3Cpathd='M18.58359.919h2.926v3.294h-2.926zM18.58347.044h2.926v6.4h-2.926zM12.71143.814h5.872v3.229h-5.872zM15.64747.044h2.936v3.2h-2.936z'/%3E%3Cpathfill='none'd='M47.43950.274h3.049v3.17h-3.049z'/%3E%3Cpathd='M73.80130.94v-3.138h-2.965v-3.354l-37.7-.122v3.151h-3.07v3.462l-2.753-.108-.11832.381h2.871v3.185h3.07v-3.185h2.824v3.185h-2.824v3.099l20.312.084v-3.257h-2.96V50.274h2.96V37.323h2.924v-3.191h5.781v3.191h2.813l-.1083.246h2.813v3.246h9.027V30.94h-2.897zM33.13656.682h-3.07v-3.158h3.07v3.158zm2.824-22.55h-2.824v-3.084h2.824v3.084zm2.90712.928h2.907v3.184h-2.907V47.06zm5.77116.153h-2.864v-3.294h2.864v3.294zm2.801-19.399h-2.801v-3.246h2.801v3.246zm6.009-12.766h-2.96v-3.354h2.96v3.354zm8.7050h-2.832v-3.354h2.832v3.354zm8.6836.275h-2.889v-3.191h2.889v3.191z'/%3E%3C/svg%3E") no-repeat;border:0;top:-.35em}@media screen and (max-width:39.9375em){.vjs-theme-uno .vjs-big-play-button{top:35%;left:45%;width:120px;height:120px;z-index:1;background:url(/assets/theme/j1/modules/videojs/assets/icons/small/big-play-button.svg) no-repeat}.vjs-theme-uno .vjs-big-play-button:hover{top:35%;left:45%;width:120px;height:120px;z-index:1;background:url(/assets/theme/j1/modules/videojs/assets/icons/small/big-play-button-hover.svg) no-repeat}}
19
+ .vjs-theme-uno{--vjs-theme-uno--blue-300:#64b5f6;--vjs-theme-uno--blue-600:#1e88e5;--vjs-theme-uno--blue-800:#1565c0;--vjs-theme-uno--gray-200:var(--vjs-theme-uno--gray-200);--vjs-theme-uno--gray-900:#212121;--vjs-theme-uno--primary:#2196f3;--vjs-theme-uno--secondary:#fff}.video-js .vjs-text-track-display div{font-size:1.75rem}.video-js .vjs-text-track-display>div>div>div{background:transparent !important;display:inline-block !important;line-height:33px !important;padding:5px !important;text-shadow:1px 1px 2px #000}.vjs-poster{height:100%}picture>img{max-width:100%;height:auto}.vjs-theme-uno .vjs-control-bar{height:50px;background-color:var(--vjs-theme-uno--gray-900);z-index:100}.vjs-has-started.vjs-user-inactive.vjs-paused .vjs-control-bar{visibility:visible;opacity:0;transition:visibility 1s,opacity 1s}.vjs-playback-rate{margin-top:10px !important}.vjs-theme-uno .vjs-current-time{display:none}.vjs-theme-uno .vjs-time-divider{display:none}.vjs-theme-uno .vjs-duration{display:block}.vjs-theme-uno .vjs-remaining-time{display:block}.vjs-icon-play:before{content:"\f101"}.vjs-theme-uno .vjs-big-play-button{top:30%;left:40%;width:240px;height:240px;font-size:0;z-index:1;background:url(/assets/theme/j1/modules/videojs/assets/icons/big-play-button.svg) no-repeat}.vjs-theme-uno .vjs-big-play-button:hover{top:30%;left:40%;width:240px;height:240px;font-size:0;z-index:1;background:url(/assets/theme/j1/modules/videojs/assets/icons/big-play-button-hover.svg) no-repeat}.vjs-theme-uno.vjs-big-play-button:focus,.vjs-theme-uno:hover .vjs-big-play-button{background-color:transparent}.vjs-theme-uno .vjs-button>.vjs-icon-placeholder:before,.vjs-theme-uno .vjs-time-control{line-height:54px}.vjs-theme-uno .vjs-play-control{font-size:1.5em;position:relative}.vjs-theme-uno .vjs-volume-panel{order:4}.vjs-theme-uno .vjs-volume-bar{margin-top:2.5em}.vjs-themeuno .vjs-volume-panel:hover .vjs-volume-control.vjs-volume-horizontal{height:100%}.vjs-theme-uno .vjs-progress-control .vjs-progress-holder,.vjs-theme-uno .vjs-progress-control:hover .vjs-progress-holder{font-size:1.5em}.vjs-theme-uno .vjs-play-control .vjs-icon-placeholder:before{height:1.3em;width:1.3em;margin-top:.2em;border-radius:1em;border:3px solid var(--vjs-theme-uno--secondary);top:2px;left:9px;line-height:1.1}.vjs-theme-uno .vjs-play-control:hover .vjs-icon-placeholder:before{border:3px solid var(--vjs-theme-uno--secondary)}.vjs-theme-uno .vjs-play-progress,.vjs-theme-uno .vjs-play-progress:before{background-color:var(--vjs-theme-uno--primary)}.vjs-theme-uno .vjs-play-progress:before{height:.8em;width:.8em;content:"";border:4px solid var(--vjs-theme-uno--secondary);border-radius:.8em;top:-.25em}.vjs-theme-uno .vjs-progress-control{font-size:14px}.vjs-theme-uno .vjs-fullscreen-control{order:6}.vjs-theme-uno.nyan .vjs-play-progress{background:linear-gradient(180deg,#fe0000 0,#fe9a01 16.666666667%,#fe9a01 0,#ff0 33.332666667%,#ff0 0,#32ff00 49.999326667%,#32ff00 0,#0099fe 66.6659926%,#0099fe 0,#63f 83.33266%,#63f 0)}.vjs-theme-uno.nyan .vjs-play-progress:before{height:1.3em;width:1.3em;background:url("data:image/svg+xml;charset=utf-8,%3Csvgxmlns='http://www.w3.org/2000/svg'viewBox='00100125'fill='%23fff'%3E%3Cpathd='M62.15337.323h2.813v3.246h-2.813zM64.85840.569h2.813v3.246h-2.813zM67.67243.814h11.9v3.246h-11.9zM79.57224.449h2.813v19.365h-2.813zM82.38637.323h3.244v3.246h-3.244zM85.6334.132h5.627v3.246H85.63zM91.25737.323h2.92v12.95h-2.92zM94.17750.274h2.922V66.21h-2.922zM91.2966.372h2.887v3.245H91.29zM88.40169.617h2.889v3.246h-2.889zM27.31272.863h61.003v3.245H27.312zM73.62276.108h2.889v3.246h-2.889zM82.56376.108h2.888v3.246h-2.888zM76.51179.354h6.053v3.245h-6.053zM61.94179.354h8.895v3.245h-8.895zM67.94776.108h2.889v3.246h-2.889zM59.32176.108h2.888v3.246h-2.888zM27.31217.917h49.387v3.246H27.312zM76.69921.162h2.873v3.287h-2.873zM56.37234.132h5.781v3.191h-5.781zM53.44837.323h2.924v12.951h-2.924zM50.48850.274h2.96v16.049h-2.96zM53.44866.323h2.924v3.257h-2.924zM56.37269.58h2.949v3.283h-2.949zM65.06963.213h2.878v6.367h-2.878zM67.94766.397h17.504v3.22H67.947z'/%3E%3Cpathd='M82.56363.213h2.888v3.185h-2.888zM73.80163.213h2.898v3.185h-2.898zM76.69956.774h2.873v3.145h-2.873zM82.56356.774h2.888v3.145h-2.888zM85.45153.444h2.864v3.33h-2.864z'/%3E%3Cpathd='M85.45156.774h2.864v3.145h-2.864zM65.06953.444h2.878v3.33h-2.878zM65.06956.774h2.878v3.145h-2.878zM62.20956.774h2.86v3.145h-2.86zM21.50924.327h2.813v45.169h-2.813zM24.32321.162h2.99v3.165h-2.99zM18.56269.496h8.75v3.367h-8.75zM15.65672.863h2.906v9.591h-2.906zM18.56279.301h8.75v3.153h-8.75zM24.32376.108h5.743V79.3h-5.743zM33.13676.108h2.824v6.346h-2.824zM35.9679.281h5.813v3.173H35.96zM41.77476.108h2.864v3.173h-2.864zM3.94840.569h11.708v3.229H3.948zM3.94843.814h2.921v6.459H3.948zM6.86947.06h2.934v6.384H6.869zM9.80350.274h2.909v6.5H9.803z'/%3E%3Cpathd='M12.71153.444h2.945v6.475h-2.945zM15.65656.774h5.853v3.145h-5.853z'/%3E%3Cpathd='M18.58359.919h2.926v3.294h-2.926zM18.58347.044h2.926v6.4h-2.926zM12.71143.814h5.872v3.229h-5.872zM15.64747.044h2.936v3.2h-2.936z'/%3E%3Cpathfill='none'd='M47.43950.274h3.049v3.17h-3.049z'/%3E%3Cpathd='M73.80130.94v-3.138h-2.965v-3.354l-37.7-.122v3.151h-3.07v3.462l-2.753-.108-.11832.381h2.871v3.185h3.07v-3.185h2.824v3.185h-2.824v3.099l20.312.084v-3.257h-2.96V50.274h2.96V37.323h2.924v-3.191h5.781v3.191h2.813l-.1083.246h2.813v3.246h9.027V30.94h-2.897zM33.13656.682h-3.07v-3.158h3.07v3.158zm2.824-22.55h-2.824v-3.084h2.824v3.084zm2.90712.928h2.907v3.184h-2.907V47.06zm5.77116.153h-2.864v-3.294h2.864v3.294zm2.801-19.399h-2.801v-3.246h2.801v3.246zm6.009-12.766h-2.96v-3.354h2.96v3.354zm8.7050h-2.832v-3.354h2.832v3.354zm8.6836.275h-2.889v-3.191h2.889v3.191z'/%3E%3C/svg%3E") no-repeat;border:0;top:-.35em}@media screen and (max-width:39.9375em){.vjs-theme-uno .vjs-big-play-button{top:35%;left:45%;width:120px;height:120px;z-index:1;background:url(/assets/theme/j1/modules/videojs/assets/icons/small/big-play-button.svg) no-repeat}.vjs-theme-uno .vjs-big-play-button:hover{top:35%;left:45%;width:120px;height:120px;z-index:1;background:url(/assets/theme/j1/modules/videojs/assets/icons/small/big-play-button-hover.svg) no-repeat}}
@@ -746,6 +746,7 @@ body.vjs-full-window {
746
746
  display: none;
747
747
  width: 100%;
748
748
  position: absolute;
749
+ top: 0;
749
750
  bottom: 0;
750
751
  left: 0;
751
752
  right: 0;
@@ -0,0 +1,13 @@
1
+ Copyright mister-ben <git@misterben.me>
2
+
3
+ Licensed under the Apache License, Version 2.0 (the "License");
4
+ you may not use this file except in compliance with the License.
5
+ You may obtain a copy of the License at
6
+
7
+ http://www.apache.org/licenses/LICENSE-2.0
8
+
9
+ Unless required by applicable law or agreed to in writing, software
10
+ distributed under the License is distributed on an "AS IS" BASIS,
11
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12
+ See the License for the specific language governing permissions and
13
+ limitations under the License.
@@ -0,0 +1,75 @@
1
+ # videojs-auto-caption
2
+
3
+ Automatically enables the caption or subtitle track best matching the player language. The plugin name is a bit stupid, as it's nothing to do with automatically _generating_ captions.
4
+
5
+ Language codes are considered case-insensitively. If one or more track with a `kind` of `captions` or `subtitles` with an exactly matching language code, the first will be selected.
6
+
7
+ If there is no exact match, the first `captions` or `subtitles` track where the first part of the language code matches is selected, so `en-US` would match `en` or `en-gb`.
8
+
9
+ If there is not a match based on language, the first `captions` or `subtitles` track with `default` = `true` will be selected.
10
+
11
+ The player language itself is either explicitly set as an option or is derived from the closest element with a `lang` attribute. See [Video.js docs](https://docs.videojs.com/tutorial-languages.html#determining-player-language).
12
+
13
+ ## Table of Contents
14
+
15
+ <!-- START doctoc -->
16
+ <!-- END doctoc -->
17
+ ## Installation
18
+
19
+ ```sh
20
+ npm install --save videojs-auto-caption
21
+ ```
22
+
23
+ ## Usage
24
+
25
+ To include videojs-auto-caption on your website or web application, use any of the following methods.
26
+
27
+ ### `<script>` Tag
28
+
29
+ This is the simplest case. Get the script in whatever way you prefer and include the plugin _after_ you include [video.js][videojs], so that the `videojs` global is available.
30
+
31
+ ```html
32
+ <script src="//path/to/video.min.js"></script>
33
+ <script src="//path/to/videojs-auto-caption.min.js"></script>
34
+ <script>
35
+ var player = videojs('my-video');
36
+
37
+ player.autoCaption();
38
+ </script>
39
+ ```
40
+
41
+ ### Browserify/CommonJS
42
+
43
+ When using with Browserify, install videojs-auto-caption via npm and `require` the plugin as you would any other module.
44
+
45
+ ```js
46
+ var videojs = require('video.js');
47
+
48
+ // The actual plugin function is exported by this module, but it is also
49
+ // attached to the `Player.prototype`; so, there is no need to assign it
50
+ // to a variable.
51
+ require('videojs-auto-caption');
52
+
53
+ var player = videojs('my-video');
54
+
55
+ player.autoCaption();
56
+ ```
57
+
58
+ ### RequireJS/AMD
59
+
60
+ When using with RequireJS (or another AMD library), get the script in whatever way you prefer and `require` the plugin as you normally would:
61
+
62
+ ```js
63
+ require(['video.js', 'videojs-auto-caption'], function(videojs) {
64
+ var player = videojs('my-video');
65
+
66
+ player.autoCaption();
67
+ });
68
+ ```
69
+
70
+ ## License
71
+
72
+ Apache-2.0. Copyright (c) mister-ben &lt;git@misterben.me&gt;
73
+
74
+
75
+ [videojs]: http://videojs.com/
@@ -0,0 +1,149 @@
1
+ /*
2
+ # -----------------------------------------------------------------------------
3
+ # ~/assets/theme/j1/modules/videojs/js/plugins/controls/autocaption/autocaption.js
4
+ # Provides the autocaption plugin for Video.js V8 and newer
5
+ # See: https://github.com/mister-ben/videojs-auto-caption/edit/master/README.md
6
+ #
7
+ # Product/Info:
8
+ # https://github.com/mister-ben/videojs-auto-caption
9
+ # http://jekyll.one
10
+ #
11
+ # Copyright (C) 2023 mister-ben
12
+ # Copyright (C) 2023, 2024 Juergen Adams
13
+ #
14
+ # videojs-auto-caption is licensed under the Apache License 2.0.
15
+ # See: https://github.com/mister-ben/videojs-auto-caption/blob/master/LICENSE
16
+ # J1 Theme is licensed under MIT License.
17
+ # See: https://github.com/jekyll-one-org/j1-template/blob/main/LICENSE
18
+ # -----------------------------------------------------------------------------
19
+ */
20
+
21
+ (function (global, factory) {
22
+ typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('video.js')) :
23
+ typeof define === 'function' && define.amd ? define(['video.js'], factory) :
24
+ (global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.videojsskipButtons = factory(global.videojs));
25
+ })(this, (function (videojs) {
26
+ 'use strict';
27
+
28
+ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
29
+
30
+ var videojs__default = /*#__PURE__*/_interopDefaultLegacy(videojs);
31
+
32
+ // if (typeof window !== 'undefined') {
33
+ // window['videojs_autocaption'] = { version: "4.0.2" };
34
+ // }
35
+
36
+ var version = "4.0.2";
37
+
38
+ // Default options for the button.
39
+ const Button = videojs__default["default"].getComponent('Button');
40
+
41
+ // Default options for the plugin.
42
+ const defaults = {
43
+ enabled: false,
44
+ };
45
+
46
+ // Enables the best matching caption
47
+ const update = function() {
48
+
49
+ const lang = this.language();
50
+ const tracks = this.textTracks();
51
+ const matches = {
52
+ exact: [],
53
+ twoletter: [],
54
+ fallback: [],
55
+ default: []
56
+ };
57
+
58
+ const candidateTracks = Array.prototype.filter.call(tracks, t => {
59
+ return t.kind === 'subtitles' || t.kind === 'captions';
60
+ });
61
+
62
+ candidateTracks.forEach(t => {
63
+ // Player normalises language to lower case
64
+ const trackLang = t.language.toLowerCase();
65
+
66
+ // `en-US` ~= `en` ~= `en-GB`
67
+ if (trackLang.split('-')[0] === lang.split('-')[0]) {
68
+ matches.twoletter.push(t);
69
+
70
+ // `en-US` === `en-US`
71
+ if (trackLang === lang) {
72
+ matches.exact.push(t);
73
+ }
74
+ }
75
+
76
+ // Honour the default if a language didn't match
77
+ if (t.default) {
78
+ matches.default.push(t);
79
+ }
80
+ }); // END forEach
81
+
82
+ // Join arrays to order preference
83
+ //
84
+ const selectedTracks = matches.exact
85
+ .concat(matches.twoletter)
86
+ .concat(matches.defaultMatches);
87
+
88
+ if (selectedTracks.length > 0) {
89
+ const selectedTrack = selectedTracks[0];
90
+
91
+ for (let i = 0; i < tracks.length; i++) {
92
+ if (tracks[i] === selectedTrack) {
93
+ tracks[i].mode = 'showing';
94
+ } else {
95
+ tracks[i].mode = 'disabled';
96
+ }
97
+ } // END for
98
+ } // END if 'selectedTracks'
99
+
100
+ }; // END function 'update'
101
+
102
+ /*
103
+ * Function to invoke when the player is ready.
104
+ *
105
+ * This is a great place for your plugin to initialize itself. When this
106
+ * function is called, the player will have its DOM and child components
107
+ * in place.
108
+ *
109
+ * @function onPlayerReady
110
+ * @param {Player} player
111
+ * A Video.js player object.
112
+ *
113
+ * @param {Object} [options={}]
114
+ * A plain object containing options for the plugin.
115
+ */
116
+ const onPlayerReady = (player, options) => {
117
+ player.addClass('vjs-auto-caption');
118
+ if (player.usingPlugin('perSourceBehaviors')) {
119
+ player.on('sourcechanged', function() {
120
+ player.onePerSrc('canplay', update);
121
+ });
122
+ } else {
123
+ player.one('canplay', update);
124
+ }
125
+ };
126
+
127
+ /*
128
+ * In the plugin function, the value of `this` is a video.js `Player`
129
+ * instance. You cannot rely on the player being in a "ready" state here,
130
+ * depending on how the plugin is invoked. This may or may not be important
131
+ * to you; if not, remove the wait for "ready"!
132
+ *
133
+ * @function autoCaption
134
+ * @param {Object} [options={}]
135
+ * An object of options left to the plugin author to define.
136
+ */
137
+ const autoCaption = function(options) {
138
+ this.ready(() => {
139
+ onPlayerReady(this, videojs.mergeOptions(defaults, options));
140
+ });
141
+ };
142
+
143
+ // register plugin
144
+ //
145
+ videojs__default["default"].registerPlugin('autoCaption', autoCaption);
146
+
147
+ return autoCaption;
148
+
149
+ }));
@@ -0,0 +1,21 @@
1
+ /*
2
+ # -----------------------------------------------------------------------------
3
+ # ~/assets/theme/j1/modules/videojs/js/plugins/controls/autocaption/autocaption.min.js
4
+ # Provides the autocaption plugin for Video.js V8 and newer
5
+ # See: https://github.com/mister-ben/videojs-auto-caption/edit/master/README.md
6
+ #
7
+ # Product/Info:
8
+ # https://github.com/mister-ben/videojs-auto-caption
9
+ # http://jekyll.one
10
+ #
11
+ # Copyright (C) 2023 mister-ben
12
+ # Copyright (C) 2023, 2024 Juergen Adams
13
+ #
14
+ # videojs-auto-caption is licensed under the Apache License 2.0.
15
+ # See: https://github.com/mister-ben/videojs-auto-caption/blob/master/LICENSE
16
+ # J1 Theme is licensed under MIT License.
17
+ # See: https://github.com/jekyll-one-org/j1-template/blob/main/LICENSE
18
+ # -----------------------------------------------------------------------------
19
+ */
20
+
21
+ !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("video.js")):"function"==typeof define&&define.amd?define(["video.js"],t):(e="undefined"!=typeof globalThis?globalThis:e||self).videojsskipButtons=t(e.videojs)}(this,function(e){"use strict";var t=function(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}(e);t.default.getComponent("Button");const o={enabled:!1},n=function(){const e=this.language(),t=this.textTracks(),o={exact:[],twoletter:[],fallback:[],default:[]};Array.prototype.filter.call(t,e=>"subtitles"===e.kind||"captions"===e.kind).forEach(t=>{const n=t.language.toLowerCase();n.split("-")[0]===e.split("-")[0]&&(o.twoletter.push(t),n===e&&o.exact.push(t)),t.default&&o.default.push(t)});const n=o.exact.concat(o.twoletter).concat(o.defaultMatches);if(n.length>0){const e=n[0];for(let o=0;o<t.length;o++)t[o]===e?t[o].mode="showing":t[o].mode="disabled"}},a=function(t){this.ready(()=>{((e,t)=>{e.addClass("vjs-auto-caption"),e.usingPlugin("perSourceBehaviors")?e.on("sourcechanged",function(){e.onePerSrc("canplay",n)}):e.one("canplay",n)})(this,e.mergeOptions(o,t))})};return t.default.registerPlugin("autoCaption",a),a});
@@ -17,24 +17,33 @@ videojs-hotkeys
17
17
 
18
18
  ## Introduction
19
19
 
20
- A plugin for Video.js that enables keyboard hotkeys when the player has focus.
20
+ The plugin **hotkeys* for Video.js enables keyboard hotkeys when the player
21
+ has focus.
22
+
21
23
  * Space bar toggles play/pause.
22
24
  * Right and Left Arrow keys seek the video forwards and back.
23
25
  * Up and Down Arrow keys increase and decrease the volume.
24
26
  * M key toggles mute/unmute.
25
- * F key toggles fullscreen off and on. (Does not work in Internet Explorer, it seems to be a limitation where scripts
26
- cannot request fullscreen without a mouse click)
27
+ * F key toggles fullscreen off and on. Does not work in Internet Explorer,
28
+ it seems to be a limitation where scripts cannot request fullscreen without
29
+ a mouse click:
27
30
  * Double-clicking with the mouse toggles fullscreen off and on.
28
- * Number keys from 0-9 skip to a percentage of the video. 0 is 0% and 9 is 90%.
31
+ * Number keys from 0-9 skip to a percentage of the video. 0 is 0%
32
+ and 9 is 90%.
29
33
 
30
- **Note: clicking any of the control buttons such as Play/Pause, Fullscreen, or Mute, will remove focus on the player
31
- which appears to "break" the hotkeys. This is for accessibility reasons so that people who do not use or know about
32
- the hotkeys can still properly use the `Tab` key to highlight the control buttons and press `space` to toggle them.**
34
+ **Note: clicking any of the control buttons such as Play/Pause, Fullscreen,
35
+ or Mute, will remove focus on the player which appears to "break" the hotkeys.
36
+ This is for accessibility reasons so that people who do not use or know about
37
+ the hotkeys can still properly use the `Tab` key to highlight the control
38
+ buttons and press `space` to toggle them.**
33
39
 
34
- **To restore focus, just click on the video, or an empty part of the control bar at the bottom of the video player.**
40
+ **To restore focus, just click on the video, or an empty part of the
41
+ control bar at the bottom of the video player.**
35
42
 
36
43
  **To override this behaviour, set the flag `alwaysCaptureHotkeys` to `true`.
37
- This will "fix" hotkeys. For accessibility, the `Tab` key may be used in combination with the `Enter`/`Return` key to navigate and activate control buttons.**
44
+ This will "fix" hotkeys. For accessibility, the `Tab` key may be used in
45
+ combination with the `Enter`/`Return` key to navigate and activate control
46
+ buttons.**
38
47
 
39
48
  ![Empty control bar space](http://i.imgur.com/18WMTUw.png)
40
49
 
@@ -71,7 +80,9 @@ import "videojs-hotkeys";
71
80
 
72
81
  ### Enable the plugin
73
82
  Add hotkeys to your Videojs ready function.
74
- Check the [Options](#options) section below for the available options and their meaning.
83
+ Check the [Options](#options) section below for the available options
84
+ and their meaning.
85
+
75
86
  ```js
76
87
  videojs('vidId', {
77
88
  plugins: {
@@ -84,6 +95,7 @@ videojs('vidId', {
84
95
  });
85
96
  ```
86
97
  or
98
+
87
99
  ```js
88
100
  videojs('vidId').ready(function() {
89
101
  this.hotkeys({
@@ -96,34 +108,68 @@ videojs('vidId').ready(function() {
96
108
 
97
109
  ## Options
98
110
 
99
- - `volumeStep` (decimal): The percentage to increase/decrease the volume level when using the Up and Down Arrow keys (default: `0.1`)
100
- - `seekStep` (integer or function): The number of seconds to seek forward and backwards when using the Right and Left Arrow keys, or a function that generates an integer given the `KeyboardEvent` (default: `5`)
101
- - `enableMute` (boolean): Enables the volume mute to be toggle by pressing the **M** key (default: `true`)
102
- - `enableVolumeScroll` (boolean): Enables increasing/decreasing the volume by scrolling the mouse wheel (default: `true`)
103
- - `enableHoverScroll` (boolean): Only changes volume when the mouse is hovering over the volume control elements. This works in connection with `enableVolumeScroll` (default: `false`)
104
- - `enableFullscreen` (boolean): Enables toggling the video fullscreen by pressing the **F** key (default: `true`)
105
- - `enableNumbers` (boolean): Enables seeking the video by pressing the number keys (default `true`)
106
- - `enableModifiersForNumbers` (boolean): Enables the use of Ctrl/Alt/Cmd + Number keys for skipping around in the video, instead of switching browser tabs. This is enabled by default due to backwards compatibility [PR #35](https://github.com/ctd1500/videojs-hotkeys/pull/35) (default: `true`)
107
- - `alwaysCaptureHotkeys` (boolean): Forces the capture of hotkeys, even when control elements are focused.
108
- The **Enter**/**Return** key may be used instead to activate the control elements. (default: `false`) (**Note:** This feature may break accessibility, and cause unexpected behavior)
109
- - `enableInactiveFocus` (boolean): This reassigns focus to the player when the control bar fades out after a user has clicked a button on the control bar (default: `true`)
110
- - `skipInitialFocus` (boolean): This stops focusing the player on initial Play under unique autoplay situations. More information in [Issue #44](https://github.com/ctd1500/videojs-hotkeys/issues/44) (default: `false`)
111
- - `captureDocumentHotkeys` (boolean): Capture document keydown events to also use hotkeys even if the player does not have focus. If you enable this option, **you must** configure `documentHotkeysFocusElementFilter` (default: `false`)
112
- - `documentHotkeysFocusElementFilter` (function): Filter function to capture document hotkeys (if `captureDocumentHotkeys` is enabled) depending on the current focused element. For example, if you want to capture hotkeys when the player is not focused and avoid conflicts when the user is focusing a particular link: `documentHotkeysFocusElementFilter: e => e.tagName.toLowerCase() === 'body'` (default: `() => false`)
113
- - `enableJogStyle` (boolean): Enables seeking the video in a broadcast-style jog by pressing the Up and Down Arrow keys.
111
+ - `volumeStep` (decimal): The percentage to increase/decrease the volume
112
+ level when using the Up and Down Arrow keys (default: `0.1`)
113
+ - `seekStep` (integer or function): The number of seconds to seek forward
114
+ and backwards when using the Right and Left Arrow keys, or a function
115
+ that generates an integer given the `KeyboardEvent` (default: `5`)
116
+ - `enableMute` (boolean): Enables the volume mute to be toggle by pressing
117
+ the **M** key (default: `true`)
118
+ - `enableVolumeScroll` (boolean): Enables increasing/decreasing the volume
119
+ by scrolling the mouse wheel (default: `true`)
120
+ - `enableHoverScroll` (boolean): Only changes volume when the mouse is
121
+ hovering over the volume control elements. This works in connection with
122
+ `enableVolumeScroll` (default: `false`)
123
+ - `enableFullscreen` (boolean): Enables toggling the video fullscreen by
124
+ pressing the **F** key (default: `true`)
125
+ - `enableNumbers` (boolean): Enables seeking the video by pressing the number
126
+ keys (default `true`)
127
+ - `enableModifiersForNumbers` (boolean): Enables the use of
128
+ Ctrl/Alt/Cmd + Number keys for skipping around in the video, instead of
129
+ switching browser tabs. This is enabled by default due to backwards
130
+ compatibility [PR #35](https://github.com/ctd1500/videojs-hotkeys/pull/35) (default: `true`)
131
+ - `alwaysCaptureHotkeys` (boolean): Forces the capture of hotkeys, even when
132
+ control elements are focused.
133
+
134
+ The **Enter**/**Return** key may be used instead to activate the control
135
+ elements. (default: `false`) (**Note:** This feature may break accessibility,
136
+ and cause unexpected behavior)
137
+
138
+ - `enableInactiveFocus` (boolean): This reassigns focus to the player when
139
+ the control bar fades out after a user has clicked a button on the
140
+ control bar (default: `true`)
141
+ - `skipInitialFocus` (boolean): This stops focusing the player on initial
142
+ Play under unique autoplay situations. More information in
143
+ [Issue #44](https://github.com/ctd1500/videojs-hotkeys/issues/44) (default: `false`)
144
+ - `captureDocumentHotkeys` (boolean): Capture document keydown events to also
145
+ use hotkeys even if the player does not have focus. If you enable this option,
146
+ **you must** configure `documentHotkeysFocusElementFilter` (default: `false`)
147
+ - `documentHotkeysFocusElementFilter` (function): Filter function to capture
148
+ document hotkeys (if `captureDocumentHotkeys` is enabled) depending on the
149
+ current focused element. For example, if you want to capture hotkeys when
150
+ the player is not focused and avoid conflicts when the user is focusing a
151
+ particular link: `documentHotkeysFocusElementFilter: e => e.tagName.toLowerCase() === 'body'` (default: `() => false`)
152
+ - `enableJogStyle` (boolean): Enables seeking the video in a broadcast-style
153
+ jog by pressing the Up and Down Arrow keys.
154
+
114
155
  `seekStep` will also need to be changed to get a proper broadcast-style jog.
115
- This feature and the changes for seekStep are explained a bit more in [PR #12](https://github.com/ctd1500/videojs-hotkeys/pull/12) (default `false`)
116
- (**Note:** This isn't a feature for everyone, and enabling JogStyle will disable the volume hotkeys)
156
+ This feature and the changes for seekStep are explained a bit more in
157
+ [PR #12](https://github.com/ctd1500/videojs-hotkeys/pull/12) (default `false`)
158
+ (**Note:** This isn't a feature for everyone, and enabling JogStyle will
159
+ disable the volume hotkeys)
117
160
 
118
- **There are more options specifically for customizing hotkeys described below.**
161
+ **There are more options** specifically for customizing hotkeys described
162
+ below.
119
163
 
120
164
  ## Custom Hotkeys and Overrides
121
165
 
122
- There are 2 methods available here. Simply overriding existing hotkeys, and creating new custom hotkeys.
166
+ There are 2 methods available here. Simply overriding existing hotkeys, and
167
+ creating new custom hotkeys.
123
168
 
124
169
  ### Override existing hotkeys
125
170
 
126
- Override functions are available for changing which, or adding additional, keys that are used as hotkeys to trigger an action.
171
+ Override functions are available for changing which, or adding additional,
172
+ keys that are used as hotkeys to trigger an action.
127
173
 
128
174
  Any override functions that you build **must** return a boolean.
129
175
  `true` if the matching key(s) were pressed, or `false` if they were not.