-import 'videojs-hotkeys/videojs.hotkeys'
import 'videojs-dock'
import '@peertube/videojs-contextmenu'
import './upnext/end-card'
import './videojs-components/settings-panel-child'
import './videojs-components/theater-button'
import './playlist/playlist-plugin'
+import './mobile/peertube-mobile-plugin'
+import './mobile/peertube-mobile-buttons'
+import './hotkeys/peertube-hotkeys-plugin'
import videojs from 'video.js'
import { HlsJsEngineSettings } from '@peertube/p2p-media-loader-hlsjs'
import { PluginsManager } from '@root-helpers/plugins-manager'
VideoJSPluginOptions
} from './peertube-videojs-typings'
import { TranslationsManager } from './translations-manager'
-import { buildVideoOrPlaylistEmbed, getRtcConfig, isIOS, isSafari } from './utils'
+import { buildVideoOrPlaylistEmbed, getRtcConfig, isIOS, isMobile, isSafari } from './utils'
// Change 'Playback Rate' to 'Speed' (smaller for our settings menu)
(videojs.getComponent('PlaybackRateMenuButton') as any).prototype.controlText_ = 'Speed'
videoEmbedTitle: options.common.embedTitle
})
+ if (isMobile()) player.peertubeMobile()
+ if (options.common.enableHotkeys === true) player.peerTubeHotkeysPlugin()
+
player.bezels()
+
player.stats({
videoUUID: options.common.videoUUID,
videoIsLive: options.common.isLive,
plugins.playlist = commonOptions.playlist
}
- if (commonOptions.enableHotkeys === true) {
- PeertubePlayerManager.addHotkeysOptions(plugins)
- }
-
if (isHLS) {
const { hlsjs } = PeertubePlayerManager.addP2PMediaLoaderOptions(plugins, options, p2pMediaLoaderModule)
player.contextmenuUI({ content })
}
- private static addHotkeysOptions (plugins: VideoJSPluginOptions) {
- const isNaked = (event: KeyboardEvent, key: string) =>
- (!event.ctrlKey && !event.altKey && !event.metaKey && !event.shiftKey && event.key === key)
-
- Object.assign(plugins, {
- hotkeys: {
- skipInitialFocus: true,
- enableInactiveFocus: false,
- captureDocumentHotkeys: true,
- documentHotkeysFocusElementFilter: (e: HTMLElement) => {
- const tagName = e.tagName.toLowerCase()
- return e.id === 'content' || tagName === 'body' || tagName === 'video'
- },
-
- enableVolumeScroll: false,
- enableModifiersForNumbers: false,
-
- rewindKey: function (event: KeyboardEvent) {
- return isNaked(event, 'ArrowLeft')
- },
-
- forwardKey: function (event: KeyboardEvent) {
- return isNaked(event, 'ArrowRight')
- },
-
- fullscreenKey: function (event: KeyboardEvent) {
- // fullscreen with the f key or Ctrl+Enter
- return isNaked(event, 'f') || (!event.altKey && event.ctrlKey && event.key === 'Enter')
- },
-
- customKeys: {
- increasePlaybackRateKey: {
- key: function (event: KeyboardEvent) {
- return isNaked(event, '>')
- },
- handler: function (player: videojs.Player) {
- const newValue = Math.min(player.playbackRate() + 0.1, 5)
- player.playbackRate(parseFloat(newValue.toFixed(2)))
- }
- },
- decreasePlaybackRateKey: {
- key: function (event: KeyboardEvent) {
- return isNaked(event, '<')
- },
- handler: function (player: videojs.Player) {
- const newValue = Math.max(player.playbackRate() - 0.1, 0.10)
- player.playbackRate(parseFloat(newValue.toFixed(2)))
- }
- },
- frameByFrame: {
- key: function (event: KeyboardEvent) {
- return isNaked(event, '.')
- },
- handler: function (player: videojs.Player) {
- player.pause()
- // Calculate movement distance (assuming 30 fps)
- const dist = 1 / 30
- player.currentTime(player.currentTime() + dist)
- }
- }
- }
- }
- })
- }
-
private static getAutoPlayValue (autoplay: any) {
if (autoplay !== true) return autoplay