@latest-thinking/lt-player 1.0.9-b → 1.0.9-d

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@latest-thinking/lt-player",
-  "version": "1.0.9-b",
+  "version": "1.0.9-d",
   "description": "LT player.",
   "main": "dist/js/lt-player-main.js",
   "module": "dist/js/lt-player-main.js",

package/src/assets/sass/abstracts/_variables.scss

@@ -16,6 +16,7 @@
 
 $lt-font-family-base: "MuseoSans", sans-serif !important;
 
+$lt-player-font-size-xxs: 10px;
 $lt-player-font-size-xs: 12px;
 $lt-player-font-size-sm: 14px;
 $lt-player-font-size-base: 16px;

package/src/assets/sass/sections/controllers/_botom.scss

@@ -68,11 +68,7 @@
           }
 
           span {
-            font-size: 10px;
-          }
-
-          [class="playback-speed--1.25X"] {
-            font-size: 8px;
+            font-size: $lt-player-font-size-xxs;
           }
         }
       }
@@ -344,11 +340,7 @@
           height: 40px;
 
           span {
-            font-size: 14px;
-          }
-
-          [class="playback-speed--1.25X"] {
-            font-size: 9px;
+            font-size: $lt-player-font-size-sm;
           }
         }
       }

package/src/components/LTPlayerManager.ts

@@ -24,9 +24,9 @@ export class LTPlayerManager {
 
         let domElements: NodeListOf<HTMLElement>;
 
-        domElements = document.querySelectorAll(`.${process.env.DEFAULT_DOM_HTML_ELEMENTS}`);
+        domElements = document.querySelectorAll(`.${process.env.DEFAULT_DOM_HTML_ELEMENTS}, #${process.env.DEFAULT_DOM_HTML_ELEMENTS}`);
 
-        if (domElements.length === 0) {
+        if (domElements.length !== 0) {
             domElements = document.querySelectorAll('[data-lt-player-config]');
         }
 
@@ -51,8 +51,9 @@ export class LTPlayerManager {
     /**
      * Init player by identifier
      * @param identifier
+     * @param playerConfig
      */
-    initByClassOrID(identifier: string) {
+    initByClassOrID(identifier: string, playerConfig?: playerConfigType) {
 
         if (typeof identifier !== 'string') {
             console.error('Identifier has another type of');
@@ -69,7 +70,7 @@ export class LTPlayerManager {
             return;
         }
         return new Promise(resolve => {
-            this.initBySelector(defaultSelector).then( result => {
+            this.initBySelector(defaultSelector, playerConfig).then(result => {
                 resolve(result);
             })
         })
@@ -79,13 +80,24 @@ export class LTPlayerManager {
     /**
      * Init player by HTMLElement selector
      * @param selector
+     * @param playerConfig
      */
-    initBySelector(selector: HTMLElement) {
-        let playerConfig = selector.dataset.ltPlayerConfig;
+    initBySelector(selector: HTMLElement, playerConfig?: playerConfigType) {
 
-        if (playerConfig !== undefined) {
+        let config: playerConfigType | string = selector.dataset.ltPlayerConfig;
 
-            const configData = JSON.parse(playerConfig);
+        if (!config) {
+            config = playerConfig;
+        }
+
+        if (config !== undefined) {
+            let configData: playerConfigType;
+
+            if (typeof config === "string") {
+                configData = JSON.parse(config);
+            } else {
+                configData = config;
+            }
 
             Object.assign(configData.body, {playerContainer: selector})
 
@@ -96,13 +108,17 @@ export class LTPlayerManager {
             })
         }
 
-        console.error(`Lt Player: No "data-lt-player-config" attribute is set on element!`);
-        console.log(selector)
-        console.error('Use one of below examples')
-        console.table({
-            Example_1: '<div class="lt-player" data-lt-player-config="{config}"> </div>',
+        return new Promise((resolve, reject) => {
+            console.error(`Lt Player: No "data-lt-player-config" attribute is set on element!`);
+            console.log(selector)
+            console.error('Use one of below examples')
+            console.table({
+                Example_1: '<div class="lt-player" data-lt-player-config="{config}"> </div>',
+            })
+            reject()
         })
-        return;
+
+
     }
 
     /**
@@ -110,25 +126,27 @@ export class LTPlayerManager {
      * @param playerConfig
      * @protected
      */
-    public initPlayer(playerConfig?: playerConfigType) {
+    public initPlayer(playerConfig?: playerConfigType): Promise<any> | null {
 
         const setup = new LTPlayerSetup();
 
-        return new Promise((resolve, reject) => {
-            let setupPLayer = setup.init(playerConfig);
-
-            if (setupPLayer) {
-                setupPLayer.then( result => {
-                    this.players.push(result);
-                    resolve(result);
-                })
-            } else {
-               reject('Player is not setup')
-            }
-
-        })
-
+            return new Promise((resolve, reject) => {
+                if (!setup.checkIfPlayerExists(playerConfig)) {
+                    reject('Duplicate player');
+                    return;
+                }
+                let setupPLayer = setup.init(playerConfig);
+
+                if (setupPLayer) {
+                    setupPLayer.then( result => {
+                        this.players.push(result);
+                        resolve(result);
+                    })
+                } else {
+                    reject('Player is not setup')
+                }
 
+            })
     }
 
     /**

package/src/components/LTPlayerSetup.ts

@@ -7,8 +7,14 @@ import {LTPLayerAddInfo} from "./addInfo/LTPlayerAddInfoManager";
 import Plyr from "plyr";
 
 export class LTPlayerSetup {
+
     additionalInfoService: LTPLayerAddInfo.Controller;
 
+    checkIfPlayerExists(playerConfig?: playerConfigType): boolean
+    {
+        return playerConfig.body.playerContainer instanceof HTMLElement;
+    }
+
     init(playerConfig?: playerConfigType): Promise<any> {
 
         Helper.setDebugEvent('Start init player', 'info');

package/src/components/controls/settings/LTPlayerDesktopSettingsControllers.ts

@@ -119,8 +119,10 @@ export class LTPlayerDesktopSettingsControllers implements SettingsControlsInter
                 }
 
                 plyr.speed = playSpeed;
-                speedSpan.innerHTML = playSpeed + "X";
+                const displaySpeed = Math.floor(playSpeed * 10) / 10;
+                speedSpan.innerHTML = displaySpeed + "X";
                 speedSpan.className = '';
+                console.log(playSpeed.toPrecision(2));
                 speedSpan.classList.add('playback-speed--' + playSpeed + 'X');
 
                 instance.playerControl.mobileEvents.showControls(instance);

package/src/components/controls/settings/LTPlayerMobileSettingsControllers.ts

@@ -191,7 +191,8 @@ export class LTPlayerMobileSettingsControllers implements SettingsControlsInterf
                     }
 
                     plyr.speed = playSpeed;
-                    speedSpan.innerHTML = playSpeed + "X";
+                    const displaySpeed = Math.floor(playSpeed * 10) / 10;
+                    speedSpan.innerHTML = displaySpeed + "X";
                     speedSpan.className = '';
                     speedSpan.classList.add('playback-speed--' + playSpeed + 'X');