@latest-thinking/lt-player 1.2.0 → 2.0.0-a

package/src/components/share/LTPlayerShareMobile.ts

@@ -1,154 +0,0 @@
-import {LTPlayerShareManager} from "./LTPlayerShareManager";
-
-export class LTPlayerShareMobile {
-
-    manager : LTPlayerShareManager
-    isPlaying : boolean
-
-    constructor(instance : LTPlayerShareManager) {
-        this.manager = instance;
-    }
-
-    activeModal() {
-        if (!this.manager.playerConfig.getShareData().canonicalUrl) {
-            if (!this.manager.playerConfig.getShareData().embedUrl) {
-                return
-            } else {
-                this.createModal();
-                this.setCopyContent(true);
-            }
-        } else {
-            this.createModal();
-            this.setCopyContent(false);
-        }
-
-        (window as any).a2a.init_all();
-
-        this.setCopyButtonsEvents()
-        this.setSwitchButton()
-
-        if (this.manager.instance.plyr.playing) {
-            this.isPlaying = true;
-            this.manager.instance.plyr.pause();
-        } else {
-            this.isPlaying = false;
-        }
-
-        setTimeout(() => {
-            const shareContainer = document.querySelector('.share-controller-wrapper');
-            const shareContainerHeader = document.querySelector('.share-controller-mobile-modal-header');
-            let instance = this;
-
-            if (shareContainer) {
-                let mobileEvent: HammerManager = this.manager.instance.eventInstance.mobileEvents.setMobileEvent(shareContainer);
-                if (mobileEvent) {
-                    mobileEvent.on('singletap', function LTPlayerMobileShareButtonsExit(event) {
-                        event.preventDefault();
-                        let target = event.target as HTMLElement;
-                        if (!target.classList.contains('player-lt__close-button') && !target.classList.contains('lt-player-mobile-share')) {
-                            instance.inactiveModal();
-                        }
-                    })
-                }
-            }
-
-            if (shareContainerHeader) {
-                let mobileEvent: HammerManager = this.manager.instance.eventInstance.mobileEvents.setMobileEvent(shareContainer);
-                if (mobileEvent) {
-                    mobileEvent.on('pan', function LTPlayerMobileShareButtonsExitPan(event) {
-                        event.preventDefault();
-                        let target = event.target as HTMLElement;
-                        if (!target.classList.contains('player-lt__close-button') ) {
-                            instance.inactiveModal();
-                        }
-                    })
-                }
-            }
-        }, 100)
-    }
-    setSwitchButton() {
-        const switchButton = document.querySelector('.share-controller-wrapper').querySelector('.button_embed');
-        const urlInput = document.querySelector('.share-controller-wrapper').querySelector('.share-controller-url');
-        const instance = this.manager.instance;
-
-        if (!instance.playerConfig.getShareData().embedUrl || !instance.playerConfig.getShareData().canonicalUrl) {
-            switchButton.classList.add('d-none');
-            return;
-        }
-
-        switchButton.addEventListener('click', () => {
-            if (urlInput.classList.contains('canonicalUrl')) {
-                urlInput.classList.remove('canonicalUrl');
-                urlInput.classList.add('embedUrl');
-                this.setCopyContent(true);
-            } else {
-                urlInput.classList.add('canonicalUrl');
-                urlInput.classList.remove('embedUrl');
-                this.setCopyContent(false);
-            }
-        })
-    }
-
-    setCopyButtonsEvents() {
-        const selectors = document.querySelectorAll('.share-controller-link');
-        const urlInput = document.querySelector('.share-controller-wrapper').querySelector('.share-controller-url');
-
-        if (selectors.length > 0) {
-            selectors.forEach((button: HTMLElement) => {
-                button.addEventListener('click', function LTPlayerShareCopy() {
-                    navigator.clipboard.writeText((urlInput as HTMLElement).dataset.copy);
-                })
-
-            })
-        }
-    }
-
-    setCopyContent(embed : boolean) {
-        const urlInput = document.querySelector('.share-controller-wrapper').querySelector('.share-controller-url');
-
-        if (!urlInput) {
-            return;
-        }
-
-        if (!embed) {
-            urlInput.classList.add('canonicalUrl');
-            urlInput.innerHTML = `${this.manager.instance.playerConfig.getShareData().canonicalUrl}`;
-            (urlInput as HTMLElement).dataset.copy = this.manager.instance.playerConfig.getShareData().canonicalUrl;
-            urlInput.addEventListener('click', () => {
-                window.open(this.manager.instance.playerConfig.getShareData().canonicalUrl)
-            })
-            return
-        }
-        urlInput.classList.add('embedUrl');
-        const iframe = `<iframe width="560" height="315" src="${this.manager.instance.playerConfig.getShareData().embedUrl}" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>`;
-        (urlInput as HTMLElement).innerText = iframe;
-        (urlInput as HTMLElement).dataset.copy = iframe;
-    }
-
-    createModal() {
-
-        let modalTemplate = this.manager.instance.templateService.getShare(this.manager.playerConfig.getShareData());
-
-        const modal = document.createElement('div');
-        modal.classList.add('lt-player-mobile-share-modal')
-        modal.innerHTML = modalTemplate;
-
-        const body = document.querySelector('body');
-
-        if (body) {
-            body.appendChild(modal);
-        }
-    }
-
-    inactiveModal() {
-        const modal = document.querySelector('.lt-player-mobile-share-modal');
-
-        if (modal) {
-            modal.remove();
-        }
-
-        if (this.isPlaying) {
-            this.manager.instance.plyr.play();
-        }
-    }
-}

package/src/components/video/LTPlayerVideo.ts

@@ -1,49 +0,0 @@
-import {LTPlayer} from "../LTPlayerType";
-import {LTPlayerConfig} from "../config/LTPlayerConfig";
-import Plyr from "plyr";
-
-export class LTPlayerVideo {
-    instanceType : LTPlayer.LandscapeType | LTPlayer.PortraitType
-    playerConfig : LTPlayerConfig
-    plyr : Plyr
-    objectFit: string
-    init(instance: LTPlayer.LandscapeType | LTPlayer.PortraitType) {
-        this.instanceType = instance;
-        this.playerConfig = instance.playerConfig;
-        this.plyr = instance.plyr;
-        this.objectFit =instance.playerConfig.getObjectFit();
-        this.appendObjectFit();
-    }
-
-    appendObjectFit() {
-        if (!this.objectFit) {
-            return;
-        }
-
-        if (!this.plyr.isHTML5) {
-            return;
-        }
-
-        const videoTag = this.plyr.elements.wrapper.querySelector('video');
-
-        if (this.objectFit === 'cover') {
-            videoTag.style.objectFit = this.objectFit;
-        }
-    }
-
-    removeObjectFit() {
-        if (!this.objectFit) {
-            return;
-        }
-
-        if (!this.plyr.isHTML5) {
-            return;
-        }
-
-        const videoTag = this.plyr.elements.wrapper.querySelector('video');
-
-        if (this.objectFit === 'cover') {
-            videoTag.style.objectFit = null;
-        }
-    }
-}

package/src/global/controllers/LTPlayerController.ts

@@ -1,58 +0,0 @@
-import {LTPlayerConfig} from "../../components/config/LTPlayerConfig";
-import {LTPlayerControls} from "../../components/controls/LTPlayerControls";
-import Plyr from "plyr";
-import {TemplateService} from "../../services/TemplateService";
-import {IconsService} from "../../services/IconsService";
-import {ResizeService} from "../../services/ResizeService";
-import {LTPlayerEvents} from "../../components/events/LTPlayer";
-import {LTPLayerAddInfo} from "../../components/addInfo/LTPlayerAddInfoManager";
-import {LTPlayerMini} from "../../components/controls/LTPlayerMini";
-import {LTPlayerDevMethode} from "../../components/LTPlayerDevMethode";
-import {LTPlayerEventsManager} from "../../components/LTPlayerEventsManager";
-import {LTPlayerPosterManager} from "../../components/poster/LTPlayerPosterManager";
-import {LTPlayerShareManager} from "../../components/share/LTPlayerShareManager";
-import {LTPlayerHls} from "../../components/LTPlayerHls";
-import {LTPlayerVideo} from "../../components/video/LTPlayerVideo";
-import {LTPlayerCaptionsManager} from "../../components/captions/LTPlayerCaptions";
-import {LTPlayerStatusFeedback} from "../../components/LTPlayerStatusFeedback";
-
-/**
- * Default Player type Service
- */
-export class LTPlayerController {
-    playerId: number
-    windowService: ResizeService
-    playerConfig: LTPlayerConfig
-    playerControl: LTPlayerControls
-    plyr: Plyr
-    templateService: TemplateService
-    iconService: IconsService
-    desktopEvents: LTPlayerEvents.Desktop;
-    mobileEvents: LTPlayerEvents.Mobile;
-    additionalInfoService: LTPLayerAddInfo.Controller | null
-    miniPlayer: LTPlayerMini
-    devMethodePlayer: LTPlayerDevMethode.Player
-    devMethodePreload: LTPlayerDevMethode.Preload
-    eventInstance: LTPlayerEventsManager
-    posterManager : LTPlayerPosterManager
-    share : LTPlayerShareManager
-    hls : LTPlayerHls
-    videoService : LTPlayerVideo
-    captionsService : LTPlayerCaptionsManager
-    statusFeedbackService: LTPlayerStatusFeedback
-
-    /**
-     * Base player type service
-     */
-    constructor() {
-        this.windowService = new ResizeService();
-        this.iconService = new IconsService();
-        this.templateService = new TemplateService();
-        this.playerControl = new LTPlayerControls(this.templateService);
-        this.posterManager = new LTPlayerPosterManager();
-        this.share = new LTPlayerShareManager();
-        this.videoService = new LTPlayerVideo();
-        this.captionsService = new LTPlayerCaptionsManager(this);
-        this.statusFeedbackService = new LTPlayerStatusFeedback(this);
-    }
-}

package/src/global/interfaces/EventsInterfaces.ts

@@ -1,11 +0,0 @@
-export interface EventsInterfaces {
-    plyrOnReady(): void
-
-    plyrEmbedOnReady(): void
-
-    plyrEndVideo(): void
-
-    plyrFullScreen(): void
-
-    plyrTimeUpdate(): void
-}

package/src/global/interfaces/SettingsControlsInterfaces.ts

@@ -1,3 +0,0 @@
-export interface SettingsControlsInterfaces {
-    init(): void
-}

package/src/global/interfaces/TypeInterface.ts

@@ -1,9 +0,0 @@
-import {playerConfigType} from "../types/ModuleTypes";
-import {LTPLayerAddInfo} from "../../components/addInfo/LTPlayerAddInfoManager";
-
-/**
- * Set default methods for Player type service
- */
-export interface TypeInterface {
-    setup(configData: playerConfigType, additionalInfo: LTPLayerAddInfo.Controller | null): boolean;
-}

package/src/global/types/ModuleTypes.d.ts

@@ -1,35 +0,0 @@
-import {LTPlayer} from "../../components/LTPlayerType";
-import Plyr from "plyr";
-import {LTPlayerShareEvents} from "../../components/share/LTPlayerShareEvents";
-
-type playerConfigType = {[index: string]: any}
-
-type urlDataType = {[index: string] : string}
-
-type additionalInformation = {[index: string] : any}
-
-type defaultType = {[index: string] : any}
-
-type PlayerType = LTPlayer.PortraitType | LTPlayer.LandscapeType;
-
-
-type plyr = Plyr & {
-    id: number;
-    captions : defaultType;
-}
-
-type playerManger = Element & {
-    playerManager: LTPlayer.PortraitType | LTPlayer.LandscapeType
-}
-
-type urlVideoType = {
-    type : string
-    origin : string
-    embedId : string
-    embedHash : string
-}
-
-type shareType = {
-    mobile : LTPlayerShareEvents.mobile,
-    desktop  : LTPlayerShareEvents.desktop
-}

package/src/global/types/ModuleViews.d.ts

@@ -1,13 +0,0 @@
-//-----------------------
-// Templates Modules
-//-----------------------
-
-declare module "html!*" {
-    const value: string
-    export default value
-}
-
-declare module '*.handlebars' {
-    const content: string;
-    export default content;
-}

package/src/global/types/ModuleWindow.d.ts

@@ -1,12 +0,0 @@
-//----------------------
-// Window Modules
-//----------------------
-import {LTPlayerManager} from "../../components/LTPlayerManager";
-
-export {};
-
-declare global {
-    interface Window {
-        Player: LTPlayerManager;
-    }
-}

package/src/global/types/Modules.d.ts

@@ -1,44 +0,0 @@
-import {LTPlayerManager} from "../../components/LTPlayerManager";
-
-
-/**
-* Tells the IntelliSense to allow import of the following file extensions in TypeScript.
-* Current Webpack config for these files doesn't embed their content, but provides the file path inside the Webpack bundle.
-*/
-
-//-----------------------
-// Fonts Module
-//-----------------------
-
-declare module '*.otf' {
-    const value: any;
-    export = value;
-}
-declare module '*.eot' {
-    const value: any;
-    export = value;
-}
-
-declare module '*.ttf' {
-    const value: any;
-    export = value;
-}
-declare module '*.woff' {
-    const value: any;
-    export = value;
-}
-declare module '*.svg' {
-    const value: any;
-    export = value;
-}
-
-
-//----------------------
-// Images Modules
-//----------------------
-declare module '*.jpg';
-declare module '*.jpeg';
-declare module '*.png';
-declare module '*.svg';
-
-

package/src/index.ts

@@ -1,10 +0,0 @@
-import {LTPlayerManager} from "./components/LTPlayerManager";
-
-const supportsContainerQueries = "container" in document.documentElement.style;
-if (!supportsContainerQueries) {
-    require('container-query-polyfill');
-}
-
-if (window.Player === undefined) {
-    window.Player = new LTPlayerManager();
-}

package/src/json-schema/player-config.json

@@ -1,16 +0,0 @@
-{
-  "type": "object",
-  "required": [
-    "version",
-    "body"
-  ],
-  "properties": {
-    "version": {
-      "type": ["integer", "string"],
-      "nullable" : false
-    },
-    "body": {
-      "type": "object"
-    }
-  }
-}

package/src/services/Helper.ts

@@ -1,147 +0,0 @@
-import {defaultType} from "../global/types/ModuleTypes";
-
-export class Helper {
-
-    static getDevice() {
-        let device = 'desktop'; //initiate as false
-        if(/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|ipad|iris|kindle|Android|Silk|lge |maemo|midp|mmp|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino/i.test(navigator.userAgent)
-            || /1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(navigator.userAgent.substr(0,4))) {
-            device = 'mobile';
-        }
-        return device;
-    }
-
-    static setDebugEvent(data: string | object, type?: string) {
-        if (type === undefined) {
-            type = 'info'
-        }
-
-        if (process.env.DEBUG === "true") {
-            switch (type) {
-                case 'info':
-                    console.info(data);
-                break
-                case 'error':
-                    console.error(data);
-                break
-                case 'table':
-                    console.table(data)
-                break
-            }
-
-
-        }
-    }
-
-    static processConfigData(videoUrl: string | defaultType) {
-
-        const regex = /^(http:\/\/|https:\/\/)(player\.vimeo\.com|vimeo\.com|youtu\.be|www\.youtube\.com)\/([\w\/]+)(\?.*)?$/;
-
-        let groupMatch;
-        let type = 'video';
-        let origin = 'video';
-
-        if ((groupMatch = regex.exec(<string>videoUrl)) !== null) {
-            groupMatch.forEach((match: string) => {
-                if (match !== undefined) {
-                    if (match.includes('vimeo')) {
-                        type = 'embedded';
-                        origin = 'vimeo';
-                    }
-                    if (match.includes('youtube')) {
-                        type = 'embedded';
-                        origin = 'youtube';
-                    }
-                }
-            });
-        }
-
-        return {
-            type: type,
-            origin: origin
-        };
-    }
-
-    static getEmbeddedID = (url: string | defaultType) => {
-        const urlGroups = url.split('?')[0].split('/');
-        if (urlGroups.length > 4) {
-            return url.split('?')[0].split('/').slice(-2)[0];
-        }
-        return url.split('?')[0].split('/').slice(-1)[0];
-
-    }
-
-    static getEmbeddedHash = (url: string | defaultType) => {
-        const urlGroups = url.split('?')[0].split('/');
-        if (urlGroups.length > 4) {
-            return url.split('?')[0].split('/').slice(-1)[0];
-        }
-        return null;
-    }
-
-    static isValidHttpUrl(string: string | defaultType) {
-        let url;
-
-        if (typeof string === 'object') {
-            return false;
-        }
-
-        try {
-            url = new URL(string);
-        } catch (_) {
-            return false;
-        }
-        return url.protocol === "http:" || url.protocol === "https:";
-    }
-
-    static checkIsHls(url : string): boolean {
-        const extensions = [
-            'm3u8'
-        ]
-
-        let response = false;
-
-        extensions.forEach(item => {
-            if (url.includes(item)) {
-                response = true;
-            }
-        })
-
-        return response;
-    }
-
-    static getVideoOrientation(width: number, height: number) {
-        if (width > height) {
-            return 'landscape';
-        } else {
-            return 'portrait'
-        }
-    }
-
-    static getPlayerStringType(type: string|number)
-    {
-        let response = null;
-
-        switch (type) {
-            case "1":
-                response = 'portrait'
-                break
-            case "2":
-                response = 'landscape'
-                break
-            case 1:
-                response = 'portrait'
-                break
-            case 2:
-                response = 'landscape'
-                break
-            case 'portrait':
-                response = 'portrait'
-                break
-            case 'landscape':
-                response = 'landscape'
-        }
-
-        return response;
-    }
-}