@capgo/capacitor-video-player 7.0.0

package/dist/esm/web-utils/videoplayer.js

@@ -0,0 +1,323 @@
+import Hls from 'hls.js';
+import { videoTypes, possibleQueryParameterExtensions } from './video-types';
+export class VideoPlayer {
+    constructor(mode, url, playerId, rate, exitOnEnd, loopOnEnd, container, zIndex, width, height) {
+        this.pipMode = false;
+        this._videoType = null;
+        this._videoContainer = null;
+        this._firstReadyToPlay = true;
+        this._isEnded = false;
+        this._videoRate = 1.0;
+        this._videoExitOnEnd = true;
+        this._videoLoopOnEnd = false;
+        this._url = url;
+        this._container = container;
+        this._mode = mode;
+        this._width = width ? width : 320;
+        this._height = height ? height : 180;
+        this._mode = mode;
+        this._videoRate = rate;
+        this._zIndex = zIndex ? zIndex : 1;
+        this._playerId = playerId;
+        this._videoExitOnEnd = exitOnEnd;
+        this._videoLoopOnEnd = loopOnEnd;
+    }
+    async initialize() {
+        // get the video type
+        const urlVideoType = this._getVideoType();
+        if (urlVideoType) {
+            // style the container
+            if (this._mode === 'fullscreen') {
+                this._container.style.position = 'absolute';
+                this._container.style.width = '100vw';
+                this._container.style.height = '100vh';
+            }
+            if (this._mode === 'embedded') {
+                this._container.style.position = 'relative';
+                this._container.style.width = this._width.toString() + 'px';
+                this._container.style.height = this._height.toString() + 'px';
+            }
+            this._container.style.left = '0';
+            this._container.style.top = '0';
+            this._container.style.display = 'flex';
+            this._container.style.alignItems = 'center';
+            this._container.style.justifyContent = 'center';
+            this._container.style.backgroundColor = '#000000';
+            this._container.style.zIndex = this._zIndex.toString();
+            const width = this._mode === 'fullscreen' ? window.innerWidth /*this._container.offsetWidth*/ : this._width;
+            const height = this._mode === 'fullscreen' ? window.innerHeight /*this._container.offsetHeight*/ : this._height;
+            const xmlns = 'http://www.w3.org/2000/svg';
+            const svg = document.createElementNS(xmlns, 'svg');
+            svg.setAttributeNS(null, 'width', width.toString());
+            svg.setAttributeNS(null, 'height', height.toString());
+            const viewbox = '0 0 ' + width.toString() + ' ' + height.toString();
+            svg.setAttributeNS(null, 'viewBox', viewbox);
+            svg.style.zIndex = (this._zIndex + 1).toString();
+            const rect = document.createElementNS(xmlns, 'rect');
+            rect.setAttributeNS(null, 'x', '0');
+            rect.setAttributeNS(null, 'y', '0');
+            rect.setAttributeNS(null, 'width', width.toString());
+            rect.setAttributeNS(null, 'height', height.toString());
+            rect.setAttributeNS(null, 'fill', '#000000');
+            svg.appendChild(rect);
+            this._container.appendChild(svg);
+            const heightVideo = (width * this._height) / this._width;
+            this._videoContainer = document.createElement('div');
+            this._videoContainer.style.position = 'absolute';
+            this._videoContainer.style.left = '0';
+            this._videoContainer.style.width = width.toString() + 'px';
+            this._videoContainer.style.height = heightVideo.toString() + 'px';
+            this._videoContainer.style.zIndex = (this._zIndex + 2).toString();
+            this._container.appendChild(this._videoContainer);
+            /*   Create Video Element */
+            const isCreated = await this.createVideoElement(width, heightVideo);
+            if (!isCreated) {
+                this._createEvent('Exit', this._playerId, 'Video Error: failed to create the Video Element');
+            }
+        }
+        else {
+            this._createEvent('Exit', this._playerId, 'Url Error: type not supported');
+        }
+        return;
+    }
+    async createVideoElement(width, height) {
+        this.videoEl = document.createElement('video');
+        this.videoEl.controls = true;
+        this.videoEl.style.zIndex = (this._zIndex + 3).toString();
+        this.videoEl.style.width = `${width.toString()}px`;
+        this.videoEl.style.height = `${height.toString()}px`;
+        this.videoEl.playbackRate = this._videoRate;
+        this._videoContainer.appendChild(this.videoEl);
+        // set the player
+        const isSet = await this._setPlayer();
+        if (isSet) {
+            this.videoEl.onended = async () => {
+                this._isEnded = true;
+                this.isPlaying = false;
+                if (this.videoEl) {
+                    this.videoEl.currentTime = 0;
+                }
+                if (this._videoExitOnEnd) {
+                    if (this._mode === 'fullscreen') {
+                        this._closeFullscreen();
+                    }
+                    this._createEvent('Ended', this._playerId);
+                }
+                else {
+                    if (this._videoLoopOnEnd && this.videoEl != null) {
+                        await this.videoEl.play();
+                    }
+                }
+            };
+            this.videoEl.oncanplay = async () => {
+                if (this._firstReadyToPlay) {
+                    this._createEvent('Ready', this._playerId);
+                    if (this.videoEl != null) {
+                        this.videoEl.muted = false;
+                        if (this._mode === 'fullscreen')
+                            await this.videoEl.play();
+                        this._firstReadyToPlay = false;
+                    }
+                }
+            };
+            this.videoEl.onplay = () => {
+                this.isPlaying = true;
+                if (this._firstReadyToPlay)
+                    this._firstReadyToPlay = false;
+                this._createEvent('Play', this._playerId);
+            };
+            this.videoEl.onplaying = () => {
+                this._createEvent('Playing', this._playerId);
+            };
+            this.videoEl.onpause = () => {
+                this.isPlaying = false;
+                this._createEvent('Pause', this._playerId);
+            };
+            if (this._mode === 'fullscreen') {
+                // create the video player exit button
+                const exitEl = document.createElement('button');
+                exitEl.textContent = 'X';
+                exitEl.style.position = 'absolute';
+                exitEl.style.left = '1%';
+                exitEl.style.top = '5%';
+                exitEl.style.width = '5vmin';
+                exitEl.style.padding = '0.5%';
+                exitEl.style.fontSize = '1.2rem';
+                exitEl.style.background = 'rgba(51,51,51,.4)';
+                exitEl.style.color = '#fff';
+                exitEl.style.visibility = 'hidden';
+                exitEl.style.zIndex = (this._zIndex + 4).toString();
+                exitEl.style.border = '1px solid rgba(51,51,51,.4)';
+                exitEl.style.borderRadius = '20px';
+                this._videoContainer.onclick = async () => {
+                    this._initial = await this._doHide(exitEl, 3000);
+                };
+                this._videoContainer.ontouchstart = async () => {
+                    this._initial = await this._doHide(exitEl, 3000);
+                };
+                this._videoContainer.onmousemove = async () => {
+                    this._initial = await this._doHide(exitEl, 3000);
+                };
+                exitEl.onclick = () => {
+                    this._createEvent('Exit', this._playerId);
+                };
+                exitEl.ontouchstart = () => {
+                    this._createEvent('Exit', this._playerId);
+                };
+                this._videoContainer.appendChild(exitEl);
+                this._initial = await this._doHide(exitEl, 3000);
+                this._goFullscreen();
+            }
+        }
+        return isSet;
+    }
+    async _goFullscreen() {
+        if (this._container.mozRequestFullScreen) {
+            /* Firefox */
+            this._container.mozRequestFullScreen();
+        }
+        else if (this._container.webkitRequestFullscreen) {
+            /* Chrome, Safari & Opera */
+            this._container.webkitRequestFullscreen();
+        }
+        else if (this._container.msRequestFullscreen) {
+            /* IE/Edge */
+            this._container.msRequestFullscreen();
+        }
+        else if (this._container.requestFullscreen) {
+            this._container.requestFullscreen();
+        }
+        return;
+    }
+    async _setPlayer() {
+        return new Promise((resolve) => {
+            if (this.videoEl != null) {
+                if (Hls.isSupported() && this._videoType === 'application/x-mpegURL') {
+                    const hls = new Hls();
+                    hls.loadSource(this._url);
+                    hls.attachMedia(this.videoEl);
+                    hls.once(Hls.Events.FRAG_PARSED, () => {
+                        if (this.videoEl != null) {
+                            this.videoEl.muted = true;
+                            this.videoEl.crossOrigin = 'anonymous';
+                            resolve(true);
+                        }
+                        else {
+                            resolve(false);
+                        }
+                    });
+                }
+                else if (this._videoType === 'video/mp4') {
+                    // CMAF (fMP4) && MP4
+                    this.videoEl.src = this._url;
+                    if (this._url.substring(0, 5) != 'https' && this._url.substring(0, 4) === 'http')
+                        this.videoEl.crossOrigin = 'anonymous';
+                    if (this._url.substring(0, 5) === 'https' || this._url.substring(0, 4) === 'http')
+                        this.videoEl.muted = true;
+                    resolve(true);
+                }
+                else {
+                    // Not Supported
+                    resolve(false);
+                }
+                this.videoEl.addEventListener('enterpictureinpicture', (event) => {
+                    this.pipWindow = event.pictureInPictureWindow;
+                    this.pipMode = true;
+                    this._closeFullscreen();
+                });
+                this.videoEl.addEventListener('leavepictureinpicture', () => {
+                    this.pipMode = false;
+                    if (!this._isEnded) {
+                        this._goFullscreen();
+                        if (this.videoEl != null)
+                            this.videoEl.play();
+                    }
+                });
+            }
+            else {
+                resolve(false);
+            }
+        });
+    }
+    _getVideoType() {
+        const sUrl = this._url ? this._url : '';
+        if (sUrl != null && sUrl.length > 0) {
+            Object.entries(videoTypes).forEach(([extension, mimeType]) => {
+                // we search for dot + extension (e.g. `.mp4`) for URLs that have the extension in the filename
+                // e.g. https://vimeo.com/?file=my-video.mp4
+                const hasDotExtension = sUrl.match(new RegExp(`.(${extension})`, 'i'));
+                if (hasDotExtension) {
+                    return (this._videoType = mimeType);
+                }
+                // we search for the extension (e.g. `m3u8`) for URLs that might have the extension as a query parameter
+                // e.g. https://youtube.com/?v=7894289374&type=m3u8
+                const hasExtensionInUrl = sUrl.match(new RegExp(`(${extension})`, 'i'));
+                if (hasExtensionInUrl) {
+                    return (this._videoType = mimeType);
+                }
+            });
+            // we check for not supported extensions for URLs that have the extension in the filename
+            // e.g. https://vimeo.com/?file=not-supported-extension-video.mkv
+            const hasNotSupportedDotExtension = sUrl.match(/\.(.*)/i);
+            if (hasNotSupportedDotExtension) {
+                return (this._videoType = null);
+            }
+            // we check for not supported extensions for URLs that might have the extension as a query parameter
+            // e.g. https://youtube.com/?v=3982748927&filetype=mkv
+            const hasNotSupportedExtensionInUrl = sUrl.match(new RegExp(`(${possibleQueryParameterExtensions.join('|')})=+(.*)&?(?=&|$))`, 'i'));
+            if (hasNotSupportedExtensionInUrl) {
+                return (this._videoType = null);
+            }
+            // No extension found, then we assume it's 'mp4' (Match case for '')
+            return 'video/mp4';
+        }
+        // URL was not defined, we return null
+        return null;
+    }
+    async _doHide(exitEl, duration) {
+        clearTimeout(this._initial);
+        exitEl.style.visibility = 'visible';
+        const initial = setTimeout(() => {
+            exitEl.style.visibility = 'hidden';
+        }, duration);
+        return initial;
+    }
+    _createEvent(ev, playerId, msg) {
+        const message = msg ? msg : null;
+        let event;
+        if (message != null) {
+            event = new CustomEvent(`videoPlayer${ev}`, {
+                detail: { fromPlayerId: playerId, message: message },
+            });
+        }
+        else {
+            const currentTime = this.videoEl ? this.videoEl.currentTime : 0;
+            event = new CustomEvent(`videoPlayer${ev}`, {
+                detail: { fromPlayerId: playerId, currentTime: currentTime },
+            });
+        }
+        document.dispatchEvent(event);
+    }
+    _closeFullscreen() {
+        const mydoc = document;
+        const isInFullScreen = (mydoc.fullscreenElement && mydoc.fullscreenElement !== null) ||
+            (mydoc.webkitFullscreenElement && mydoc.webkitFullscreenElement !== null) ||
+            (mydoc.mozFullScreenElement && mydoc.mozFullScreenElement !== null) ||
+            (mydoc.msFullscreenElement && mydoc.msFullscreenElement !== null);
+        if (isInFullScreen) {
+            if (mydoc.mozCancelFullScreen) {
+                mydoc.mozCancelFullScreen();
+            }
+            else if (mydoc.webkitExitFullscreen) {
+                mydoc.webkitExitFullscreen();
+            }
+            else if (mydoc.msExitFullscreen) {
+                mydoc.msExitFullscreen();
+            }
+            else if (mydoc.exitFullscreen) {
+                mydoc.exitFullscreen();
+            }
+        }
+    }
+}
+//# sourceMappingURL=videoplayer.js.map

package/dist/esm/web-utils/videoplayer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"videoplayer.js","sourceRoot":"","sources":["../../../src/web-utils/videoplayer.ts"],"names":[],"mappings":"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","sourcesContent":["import Hls from 'hls.js';\n\nimport type { videoMimeType } from './video-types';\nimport { videoTypes, possibleQueryParameterExtensions } from './video-types';\n\nexport class VideoPlayer {\n  public videoEl: HTMLVideoElement | undefined;\n  public pipMode = false;\n  public pipWindow: Window | undefined;\n  public isPlaying: boolean | undefined;\n\n  private _url: string;\n  private _playerId: string;\n  private _container: any;\n  private _mode: string;\n  private _width: number;\n  private _height: number;\n  private _zIndex: number;\n  private _initial: any;\n  private _videoType: videoMimeType | null = null;\n  private _videoContainer: any = null;\n  private _firstReadyToPlay = true;\n  private _isEnded = false;\n  private _videoRate = 1.0;\n  private _videoExitOnEnd = true;\n  private _videoLoopOnEnd = false;\n\n  constructor(\n    mode: string,\n    url: string,\n    playerId: string,\n    rate: number,\n    exitOnEnd: boolean,\n    loopOnEnd: boolean,\n    container: any,\n    zIndex: number,\n    width?: number,\n    height?: number,\n  ) {\n    this._url = url;\n    this._container = container;\n    this._mode = mode;\n    this._width = width ? width : 320;\n    this._height = height ? height : 180;\n    this._mode = mode;\n    this._videoRate = rate;\n    this._zIndex = zIndex ? zIndex : 1;\n    this._playerId = playerId;\n    this._videoExitOnEnd = exitOnEnd;\n    this._videoLoopOnEnd = loopOnEnd;\n  }\n\n  public async initialize(): Promise<void> {\n    // get the video type\n    const urlVideoType: videoMimeType | null = this._getVideoType();\n    if (urlVideoType) {\n      // style the container\n      if (this._mode === 'fullscreen') {\n        this._container.style.position = 'absolute';\n        this._container.style.width = '100vw';\n        this._container.style.height = '100vh';\n      }\n      if (this._mode === 'embedded') {\n        this._container.style.position = 'relative';\n        this._container.style.width = this._width.toString() + 'px';\n        this._container.style.height = this._height.toString() + 'px';\n      }\n      this._container.style.left = '0';\n      this._container.style.top = '0';\n      this._container.style.display = 'flex';\n      this._container.style.alignItems = 'center';\n      this._container.style.justifyContent = 'center';\n      this._container.style.backgroundColor = '#000000';\n      this._container.style.zIndex = this._zIndex.toString();\n      const width: number =\n        this._mode === 'fullscreen' ? window.innerWidth /*this._container.offsetWidth*/ : this._width;\n      const height: number =\n        this._mode === 'fullscreen' ? window.innerHeight /*this._container.offsetHeight*/ : this._height;\n      const xmlns = 'http://www.w3.org/2000/svg';\n\n      const svg = document.createElementNS(xmlns, 'svg');\n      svg.setAttributeNS(null, 'width', width.toString());\n      svg.setAttributeNS(null, 'height', height.toString());\n      const viewbox = '0 0 ' + width.toString() + ' ' + height.toString();\n      svg.setAttributeNS(null, 'viewBox', viewbox);\n      svg.style.zIndex = (this._zIndex + 1).toString();\n      const rect = document.createElementNS(xmlns, 'rect');\n      rect.setAttributeNS(null, 'x', '0');\n      rect.setAttributeNS(null, 'y', '0');\n      rect.setAttributeNS(null, 'width', width.toString());\n      rect.setAttributeNS(null, 'height', height.toString());\n      rect.setAttributeNS(null, 'fill', '#000000');\n      svg.appendChild(rect);\n      this._container.appendChild(svg);\n\n      const heightVideo: number = (width * this._height) / this._width;\n      this._videoContainer = document.createElement('div');\n      this._videoContainer.style.position = 'absolute';\n      this._videoContainer.style.left = '0';\n      this._videoContainer.style.width = width.toString() + 'px';\n      this._videoContainer.style.height = heightVideo.toString() + 'px';\n      this._videoContainer.style.zIndex = (this._zIndex + 2).toString();\n      this._container.appendChild(this._videoContainer);\n      /*   Create Video Element */\n      const isCreated = await this.createVideoElement(width, heightVideo);\n      if (!isCreated) {\n        this._createEvent('Exit', this._playerId, 'Video Error: failed to create the Video Element');\n      }\n    } else {\n      this._createEvent('Exit', this._playerId, 'Url Error: type not supported');\n    }\n    return;\n  }\n\n  private async createVideoElement(width: number, height: number): Promise<boolean> {\n    this.videoEl = document.createElement('video');\n    this.videoEl.controls = true;\n    this.videoEl.style.zIndex = (this._zIndex + 3).toString();\n    this.videoEl.style.width = `${width.toString()}px`;\n    this.videoEl.style.height = `${height.toString()}px`;\n    this.videoEl.playbackRate = this._videoRate;\n    this._videoContainer.appendChild(this.videoEl);\n    // set the player\n    const isSet: boolean = await this._setPlayer();\n    if (isSet) {\n      this.videoEl.onended = async () => {\n        this._isEnded = true;\n        this.isPlaying = false;\n        if (this.videoEl) {\n          this.videoEl.currentTime = 0;\n        }\n        if (this._videoExitOnEnd) {\n          if (this._mode === 'fullscreen') {\n            this._closeFullscreen();\n          }\n          this._createEvent('Ended', this._playerId);\n        } else {\n          if (this._videoLoopOnEnd && this.videoEl != null) {\n            await this.videoEl.play();\n          }\n        }\n      };\n      this.videoEl.oncanplay = async () => {\n        if (this._firstReadyToPlay) {\n          this._createEvent('Ready', this._playerId);\n          if (this.videoEl != null) {\n            this.videoEl.muted = false;\n            if (this._mode === 'fullscreen') await this.videoEl.play();\n            this._firstReadyToPlay = false;\n          }\n        }\n      };\n      this.videoEl.onplay = () => {\n        this.isPlaying = true;\n        if (this._firstReadyToPlay) this._firstReadyToPlay = false;\n        this._createEvent('Play', this._playerId);\n      };\n      this.videoEl.onplaying = () => {\n        this._createEvent('Playing', this._playerId);\n      };\n      this.videoEl.onpause = () => {\n        this.isPlaying = false;\n        this._createEvent('Pause', this._playerId);\n      };\n      if (this._mode === 'fullscreen') {\n        // create the video player exit button\n        const exitEl: HTMLButtonElement = document.createElement('button');\n        exitEl.textContent = 'X';\n        exitEl.style.position = 'absolute';\n        exitEl.style.left = '1%';\n        exitEl.style.top = '5%';\n        exitEl.style.width = '5vmin';\n        exitEl.style.padding = '0.5%';\n        exitEl.style.fontSize = '1.2rem';\n        exitEl.style.background = 'rgba(51,51,51,.4)';\n        exitEl.style.color = '#fff';\n        exitEl.style.visibility = 'hidden';\n        exitEl.style.zIndex = (this._zIndex + 4).toString();\n        exitEl.style.border = '1px solid rgba(51,51,51,.4)';\n        exitEl.style.borderRadius = '20px';\n        this._videoContainer.onclick = async () => {\n          this._initial = await this._doHide(exitEl, 3000);\n        };\n        this._videoContainer.ontouchstart = async () => {\n          this._initial = await this._doHide(exitEl, 3000);\n        };\n\n        this._videoContainer.onmousemove = async () => {\n          this._initial = await this._doHide(exitEl, 3000);\n        };\n\n        exitEl.onclick = () => {\n          this._createEvent('Exit', this._playerId);\n        };\n        exitEl.ontouchstart = () => {\n          this._createEvent('Exit', this._playerId);\n        };\n\n        this._videoContainer.appendChild(exitEl);\n        this._initial = await this._doHide(exitEl, 3000);\n\n        this._goFullscreen();\n      }\n    }\n    return isSet;\n  }\n\n  private async _goFullscreen(): Promise<void> {\n    if (this._container.mozRequestFullScreen) {\n      /* Firefox */\n      this._container.mozRequestFullScreen();\n    } else if (this._container.webkitRequestFullscreen) {\n      /* Chrome, Safari & Opera */\n      this._container.webkitRequestFullscreen();\n    } else if (this._container.msRequestFullscreen) {\n      /* IE/Edge */\n      this._container.msRequestFullscreen();\n    } else if (this._container.requestFullscreen) {\n      this._container.requestFullscreen();\n    }\n    return;\n  }\n\n  private async _setPlayer(): Promise<boolean> {\n    return new Promise((resolve) => {\n      if (this.videoEl != null) {\n        if (Hls.isSupported() && this._videoType === 'application/x-mpegURL') {\n          const hls = new Hls();\n          hls.loadSource(this._url);\n          hls.attachMedia(this.videoEl);\n          hls.once(Hls.Events.FRAG_PARSED, () => {\n            if (this.videoEl != null) {\n              this.videoEl.muted = true;\n              this.videoEl.crossOrigin = 'anonymous';\n              resolve(true);\n            } else {\n              resolve(false);\n            }\n          });\n        } else if (this._videoType === 'video/mp4') {\n          // CMAF (fMP4) && MP4\n          this.videoEl.src = this._url;\n          if (this._url.substring(0, 5) != 'https' && this._url.substring(0, 4) === 'http')\n            this.videoEl.crossOrigin = 'anonymous';\n          if (this._url.substring(0, 5) === 'https' || this._url.substring(0, 4) === 'http') this.videoEl.muted = true;\n          resolve(true);\n        } else {\n          // Not Supported\n          resolve(false);\n        }\n        this.videoEl.addEventListener('enterpictureinpicture', (event: any) => {\n          this.pipWindow = event.pictureInPictureWindow;\n          this.pipMode = true;\n          this._closeFullscreen();\n        });\n\n        this.videoEl.addEventListener('leavepictureinpicture', () => {\n          this.pipMode = false;\n          if (!this._isEnded) {\n            this._goFullscreen();\n            if (this.videoEl != null) this.videoEl.play();\n          }\n        });\n      } else {\n        resolve(false);\n      }\n    });\n  }\n\n  private _getVideoType(): videoMimeType | null {\n    const sUrl: string = this._url ? this._url : '';\n    if (sUrl != null && sUrl.length > 0) {\n      Object.entries(videoTypes).forEach(([extension, mimeType]) => {\n        // we search for dot + extension (e.g. `.mp4`) for URLs that have the extension in the filename\n        // e.g. https://vimeo.com/?file=my-video.mp4\n        const hasDotExtension = sUrl.match(new RegExp(`.(${extension})`, 'i'));\n        if (hasDotExtension) {\n          return (this._videoType = mimeType);\n        }\n        // we search for the extension (e.g. `m3u8`) for URLs that might have the extension as a query parameter\n        // e.g. https://youtube.com/?v=7894289374&type=m3u8\n        const hasExtensionInUrl = sUrl.match(new RegExp(`(${extension})`, 'i'));\n        if (hasExtensionInUrl) {\n          return (this._videoType = mimeType);\n        }\n      });\n      // we check for not supported extensions for URLs that have the extension in the filename\n      // e.g. https://vimeo.com/?file=not-supported-extension-video.mkv\n      const hasNotSupportedDotExtension = sUrl.match(/\\.(.*)/i);\n      if (hasNotSupportedDotExtension) {\n        return (this._videoType = null);\n      }\n      // we check for not supported extensions for URLs that might have the extension as a query parameter\n      // e.g. https://youtube.com/?v=3982748927&filetype=mkv\n      const hasNotSupportedExtensionInUrl = sUrl.match(\n        new RegExp(`(${possibleQueryParameterExtensions.join('|')})=+(.*)&?(?=&|$))`, 'i'),\n      );\n      if (hasNotSupportedExtensionInUrl) {\n        return (this._videoType = null);\n      }\n      // No extension found, then we assume it's 'mp4' (Match case for '')\n      return 'video/mp4';\n    }\n    // URL was not defined, we return null\n    return null;\n  }\n\n  private async _doHide(exitEl: HTMLButtonElement, duration: number) {\n    clearTimeout(this._initial);\n    exitEl.style.visibility = 'visible';\n    const initial = setTimeout(() => {\n      exitEl.style.visibility = 'hidden';\n    }, duration);\n    return initial;\n  }\n  private _createEvent(ev: string, playerId: string, msg?: string) {\n    const message = msg ? msg : null;\n    let event: CustomEvent;\n    if (message != null) {\n      event = new CustomEvent(`videoPlayer${ev}`, {\n        detail: { fromPlayerId: playerId, message: message },\n      });\n    } else {\n      const currentTime: number = this.videoEl ? this.videoEl.currentTime : 0;\n      event = new CustomEvent(`videoPlayer${ev}`, {\n        detail: { fromPlayerId: playerId, currentTime: currentTime },\n      });\n    }\n    document.dispatchEvent(event);\n  }\n  private _closeFullscreen() {\n    const mydoc: any = document;\n    const isInFullScreen: boolean =\n      (mydoc.fullscreenElement && mydoc.fullscreenElement !== null) ||\n      (mydoc.webkitFullscreenElement && mydoc.webkitFullscreenElement !== null) ||\n      (mydoc.mozFullScreenElement && mydoc.mozFullScreenElement !== null) ||\n      (mydoc.msFullscreenElement && mydoc.msFullscreenElement !== null);\n    if (isInFullScreen) {\n      if (mydoc.mozCancelFullScreen) {\n        mydoc.mozCancelFullScreen();\n      } else if (mydoc.webkitExitFullscreen) {\n        mydoc.webkitExitFullscreen();\n      } else if (mydoc.msExitFullscreen) {\n        mydoc.msExitFullscreen();\n      } else if (mydoc.exitFullscreen) {\n        mydoc.exitFullscreen();\n      }\n    }\n  }\n}\n"]}

package/dist/esm/web.d.ts

@@ -0,0 +1,121 @@
+import { WebPlugin } from '@capacitor/core';
+import type { VideoPlayerPlugin, capEchoOptions, capVideoPlayerOptions, capVideoPlayerIdOptions, capVideoVolumeOptions, capVideoTimeOptions, capVideoMutedOptions, capVideoRateOptions, capVideoPlayerResult } from './definitions';
+export interface IPlayerSize {
+    height: number;
+    width: number;
+}
+export declare class VideoPlayerWeb extends WebPlugin implements VideoPlayerPlugin {
+    private _players;
+    private videoContainer;
+    private mode;
+    constructor();
+    echo(options: capEchoOptions): Promise<capVideoPlayerResult>;
+    /**
+     *  Player initialization
+     *
+     * @param options
+     */
+    initPlayer(options: capVideoPlayerOptions): Promise<capVideoPlayerResult>;
+    /**
+     * Return if a given playerId is playing
+     *
+     * @param options
+     */
+    isPlaying(options: capVideoPlayerIdOptions): Promise<capVideoPlayerResult>;
+    /**
+     * Play the current video from a given playerId
+     *
+     * @param options
+     */
+    play(options: capVideoPlayerIdOptions): Promise<capVideoPlayerResult>;
+    /**
+     * Pause the current video from a given playerId
+     *
+     * @param options
+     */
+    pause(options: capVideoPlayerIdOptions): Promise<capVideoPlayerResult>;
+    /**
+     * Get the duration of the current video from a given playerId
+     *
+     * @param options
+     */
+    getDuration(options: capVideoPlayerIdOptions): Promise<capVideoPlayerResult>;
+    /**
+     * Set the rate of the current video from a given playerId
+     *
+     * @param options
+     */
+    setRate(options: capVideoRateOptions): Promise<capVideoPlayerResult>;
+    /**
+     * Get the volume of the current video from a given playerId
+     *
+     * @param options
+     */
+    getRate(options: capVideoPlayerIdOptions): Promise<capVideoPlayerResult>;
+    /**
+     * Set the volume of the current video from a given playerId
+     *
+     * @param options
+     */
+    setVolume(options: capVideoVolumeOptions): Promise<capVideoPlayerResult>;
+    /**
+     * Get the volume of the current video from a given playerId
+     *
+     * @param options
+     */
+    getVolume(options: capVideoPlayerIdOptions): Promise<capVideoPlayerResult>;
+    /**
+     * Set the muted property of the current video from a given playerId
+     *
+     * @param options
+     */
+    setMuted(options: capVideoMutedOptions): Promise<capVideoPlayerResult>;
+    /**
+     * Get the muted property of the current video from a given playerId
+     *
+     * @param options
+     */
+    getMuted(options: capVideoPlayerIdOptions): Promise<capVideoPlayerResult>;
+    /**
+     * Set the current time of the current video from a given playerId
+     *
+     * @param options
+     */
+    setCurrentTime(options: capVideoTimeOptions): Promise<capVideoPlayerResult>;
+    /**
+     * Get the current time of the current video from a given playerId
+     *
+     * @param options
+     */
+    getCurrentTime(options: capVideoPlayerIdOptions): Promise<capVideoPlayerResult>;
+    /**
+     * Get the current time of the current video from a given playerId
+     *
+     */
+    stopAllPlayers(): Promise<capVideoPlayerResult>;
+    /**
+     * Show controller
+     *
+     */
+    showController(): Promise<capVideoPlayerResult>;
+    /**
+     * isControllerIsFullyVisible
+     *
+     */
+    isControllerIsFullyVisible(): Promise<capVideoPlayerResult>;
+    /**
+     * Exit the current player
+     *
+     */
+    exitPlayer(): Promise<capVideoPlayerResult>;
+    private checkSize;
+    private _initializeVideoPlayer;
+    private _getContainerElement;
+    private handlePlayerPlay;
+    private handlePlayerPause;
+    private handlePlayerEnded;
+    private handlePlayerExit;
+    private handlePlayerReady;
+    private addListeners;
+    private removeListeners;
+}