@folklore/hooks 0.0.55 → 0.0.57

package/dist/cjs.js

@@ -68,55 +68,6 @@ function useCounter(desiredValue, _ref) {
   return currentValue;
 }
 
-function usePlayerCurrentTime(player) {
-  let {
-    id = null,
-    disabled = false,
-    updateInterval = 1000,
-    onUpdate: customOnUpdate = null,
-    getCurrentTime = p => p.currentTime
-  } = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-  const [currentTime, setCurrentTime] = react.useState(0);
-  const realCurrentTime = react.useRef(currentTime);
-  const lastIdRef = react.useRef(id);
-  const idChanged = lastIdRef.current !== id;
-  if (idChanged) {
-    realCurrentTime.current = 0;
-    lastIdRef.current = id;
-  }
-
-  // Check time update
-  react.useEffect(() => {
-    if (disabled || player === null) {
-      return () => {};
-    }
-    let canceled = false;
-    const updateTime = time => {
-      if (canceled) {
-        return;
-      }
-      realCurrentTime.current = time;
-      setCurrentTime(time);
-      if (customOnUpdate !== null) {
-        customOnUpdate(time);
-      }
-    };
-    const interval = setInterval(() => {
-      const time = getCurrentTime(player);
-      if (typeof time.then !== 'undefined') {
-        time.then(updateTime);
-      } else {
-        updateTime(time);
-      }
-    }, updateInterval);
-    return () => {
-      canceled = true;
-      clearInterval(interval);
-    };
-  }, [id, player, setCurrentTime, disabled, updateInterval, getCurrentTime]);
-  return realCurrentTime.current;
-}
-
 const NO_PLAYER_ERROR$3 = new Error('No player');
 function useDailymotionPlayer() {
   let id = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
@@ -134,7 +85,7 @@ function useDailymotionPlayer() {
     sharingEnable = false,
     uiLogo = false,
     uiStartScreenInfo = true,
-    timeUpdateInterval = 1000,
+    embedPlayerId = null,
     onTimeUpdate: customOnTimeUpdate = null,
     getVideoId = url => {
       if (url === null || url.match(/^https?:/) === null) {
@@ -187,7 +138,7 @@ function useDailymotionPlayer() {
     if (!apiLoaded && videoId !== null) {
       debug('Load API');
       services.loadDailymotion({
-        url: 'https://geo.dailymotion.com/libs/player.js',
+        url: embedPlayerId !== null ? `https://geo.dailymotion.com/libs/player/${embedPlayerId}.js` : 'https://geo.dailymotion.com/libs/player.js',
         callback: null
       }).then(api => {
         if (!canceled) {
@@ -200,7 +151,7 @@ function useDailymotionPlayer() {
     return () => {
       canceled = true;
     };
-  }, [videoId, apiLoaded, setApiLoaded]);
+  }, [videoId, apiLoaded, setApiLoaded, embedPlayerId]);
 
   // Create or update player
   react.useEffect(() => {
@@ -219,8 +170,9 @@ function useDailymotionPlayer() {
     const playerParams = {
       'autoplay-d': autoplay,
       // muted,
-      start,
+      startTime: start,
       controls,
+      aspectRatio: 'inherit',
       'queue-autoplay-next': queueAutoplayNext,
       'queue-enable': queueEnable,
       'sharing-enable': sharingEnable,
@@ -248,7 +200,7 @@ function useDailymotionPlayer() {
       debug('Create player [ID: %s]', videoId);
     }
     playerElementRef.current = element;
-  }, [apiLoaded, elementHasChanged, videoId, width, height, autoplay, muted, start, controls, queueAutoplayNext, queueEnable, sharingEnable, uiLogo, uiStartScreenInfo]);
+  }, [apiLoaded, elementHasChanged, videoId, width, height, autoplay, start, controls, queueAutoplayNext, queueEnable, sharingEnable, uiLogo, uiStartScreenInfo]);
   react.useEffect(() => {
     const {
       current: player = null
@@ -438,6 +390,11 @@ function useDailymotionPlayer() {
     } = playerRef;
     return player !== null ? player.seek(time) : Promise.reject(NO_PLAYER_ERROR$3);
   }, []);
+  react.useEffect(() => {
+    if (customOnTimeUpdate !== null) {
+      customOnTimeUpdate(currentTime);
+    }
+  }, [currentTime, customOnTimeUpdate]);
   return {
     ref: elementRef,
     player: playerRef.current,
@@ -939,6 +896,55 @@ const useItemsPaginated = function (loader) {
   };
 };
 
+function usePlayerCurrentTime(player) {
+  let {
+    id = null,
+    disabled = false,
+    updateInterval = 1000,
+    onUpdate: customOnUpdate = null,
+    getCurrentTime = p => p.currentTime
+  } = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  const [currentTime, setCurrentTime] = react.useState(0);
+  const realCurrentTime = react.useRef(currentTime);
+  const lastIdRef = react.useRef(id);
+  const idChanged = lastIdRef.current !== id;
+  if (idChanged) {
+    realCurrentTime.current = 0;
+    lastIdRef.current = id;
+  }
+
+  // Check time update
+  react.useEffect(() => {
+    if (disabled || player === null) {
+      return () => {};
+    }
+    let canceled = false;
+    const updateTime = time => {
+      if (canceled) {
+        return;
+      }
+      realCurrentTime.current = time;
+      setCurrentTime(time);
+      if (customOnUpdate !== null) {
+        customOnUpdate(time);
+      }
+    };
+    const interval = setInterval(() => {
+      const time = getCurrentTime(player);
+      if (typeof time.then !== 'undefined') {
+        time.then(updateTime);
+      } else {
+        updateTime(time);
+      }
+    }, updateInterval);
+    return () => {
+      canceled = true;
+      clearInterval(interval);
+    };
+  }, [id, player, setCurrentTime, disabled, updateInterval, getCurrentTime]);
+  return realCurrentTime.current;
+}
+
 const NO_PLAYER_ERROR$2 = new Error('No player');
 function useNativeVideoPlayer(url) {
   let {

package/dist/es.js

@@ -1,5 +1,5 @@
 import raf from 'raf';
-import { useState, useEffect, useRef, useMemo, useCallback } from 'react';
+import { useState, useEffect, useMemo, useRef, useCallback } from 'react';
 import { loadDailymotion, loadVimeo, loadYouTube } from '@folklore/services';
 import createDebug from 'debug';
 import EventsManager from '@folklore/events';
@@ -57,55 +57,6 @@ function useCounter(desiredValue, _ref) {
   return currentValue;
 }
 
-function usePlayerCurrentTime(player) {
-  let {
-    id = null,
-    disabled = false,
-    updateInterval = 1000,
-    onUpdate: customOnUpdate = null,
-    getCurrentTime = p => p.currentTime
-  } = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-  const [currentTime, setCurrentTime] = useState(0);
-  const realCurrentTime = useRef(currentTime);
-  const lastIdRef = useRef(id);
-  const idChanged = lastIdRef.current !== id;
-  if (idChanged) {
-    realCurrentTime.current = 0;
-    lastIdRef.current = id;
-  }
-
-  // Check time update
-  useEffect(() => {
-    if (disabled || player === null) {
-      return () => {};
-    }
-    let canceled = false;
-    const updateTime = time => {
-      if (canceled) {
-        return;
-      }
-      realCurrentTime.current = time;
-      setCurrentTime(time);
-      if (customOnUpdate !== null) {
-        customOnUpdate(time);
-      }
-    };
-    const interval = setInterval(() => {
-      const time = getCurrentTime(player);
-      if (typeof time.then !== 'undefined') {
-        time.then(updateTime);
-      } else {
-        updateTime(time);
-      }
-    }, updateInterval);
-    return () => {
-      canceled = true;
-      clearInterval(interval);
-    };
-  }, [id, player, setCurrentTime, disabled, updateInterval, getCurrentTime]);
-  return realCurrentTime.current;
-}
-
 const NO_PLAYER_ERROR$3 = new Error('No player');
 function useDailymotionPlayer() {
   let id = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
@@ -123,7 +74,7 @@ function useDailymotionPlayer() {
     sharingEnable = false,
     uiLogo = false,
     uiStartScreenInfo = true,
-    timeUpdateInterval = 1000,
+    embedPlayerId = null,
     onTimeUpdate: customOnTimeUpdate = null,
     getVideoId = url => {
       if (url === null || url.match(/^https?:/) === null) {
@@ -176,7 +127,7 @@ function useDailymotionPlayer() {
     if (!apiLoaded && videoId !== null) {
       debug('Load API');
       loadDailymotion({
-        url: 'https://geo.dailymotion.com/libs/player.js',
+        url: embedPlayerId !== null ? `https://geo.dailymotion.com/libs/player/${embedPlayerId}.js` : 'https://geo.dailymotion.com/libs/player.js',
         callback: null
       }).then(api => {
         if (!canceled) {
@@ -189,7 +140,7 @@ function useDailymotionPlayer() {
     return () => {
       canceled = true;
     };
-  }, [videoId, apiLoaded, setApiLoaded]);
+  }, [videoId, apiLoaded, setApiLoaded, embedPlayerId]);
 
   // Create or update player
   useEffect(() => {
@@ -208,8 +159,9 @@ function useDailymotionPlayer() {
     const playerParams = {
       'autoplay-d': autoplay,
       // muted,
-      start,
+      startTime: start,
       controls,
+      aspectRatio: 'inherit',
       'queue-autoplay-next': queueAutoplayNext,
       'queue-enable': queueEnable,
       'sharing-enable': sharingEnable,
@@ -237,7 +189,7 @@ function useDailymotionPlayer() {
       debug('Create player [ID: %s]', videoId);
     }
     playerElementRef.current = element;
-  }, [apiLoaded, elementHasChanged, videoId, width, height, autoplay, muted, start, controls, queueAutoplayNext, queueEnable, sharingEnable, uiLogo, uiStartScreenInfo]);
+  }, [apiLoaded, elementHasChanged, videoId, width, height, autoplay, start, controls, queueAutoplayNext, queueEnable, sharingEnable, uiLogo, uiStartScreenInfo]);
   useEffect(() => {
     const {
       current: player = null
@@ -427,6 +379,11 @@ function useDailymotionPlayer() {
     } = playerRef;
     return player !== null ? player.seek(time) : Promise.reject(NO_PLAYER_ERROR$3);
   }, []);
+  useEffect(() => {
+    if (customOnTimeUpdate !== null) {
+      customOnTimeUpdate(currentTime);
+    }
+  }, [currentTime, customOnTimeUpdate]);
   return {
     ref: elementRef,
     player: playerRef.current,
@@ -928,6 +885,55 @@ const useItemsPaginated = function (loader) {
   };
 };
 
+function usePlayerCurrentTime(player) {
+  let {
+    id = null,
+    disabled = false,
+    updateInterval = 1000,
+    onUpdate: customOnUpdate = null,
+    getCurrentTime = p => p.currentTime
+  } = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  const [currentTime, setCurrentTime] = useState(0);
+  const realCurrentTime = useRef(currentTime);
+  const lastIdRef = useRef(id);
+  const idChanged = lastIdRef.current !== id;
+  if (idChanged) {
+    realCurrentTime.current = 0;
+    lastIdRef.current = id;
+  }
+
+  // Check time update
+  useEffect(() => {
+    if (disabled || player === null) {
+      return () => {};
+    }
+    let canceled = false;
+    const updateTime = time => {
+      if (canceled) {
+        return;
+      }
+      realCurrentTime.current = time;
+      setCurrentTime(time);
+      if (customOnUpdate !== null) {
+        customOnUpdate(time);
+      }
+    };
+    const interval = setInterval(() => {
+      const time = getCurrentTime(player);
+      if (typeof time.then !== 'undefined') {
+        time.then(updateTime);
+      } else {
+        updateTime(time);
+      }
+    }, updateInterval);
+    return () => {
+      canceled = true;
+      clearInterval(interval);
+    };
+  }, [id, player, setCurrentTime, disabled, updateInterval, getCurrentTime]);
+  return realCurrentTime.current;
+}
+
 const NO_PLAYER_ERROR$2 = new Error('No player');
 function useNativeVideoPlayer(url) {
   let {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@folklore/hooks",
-    "version": "0.0.55",
+    "version": "0.0.57",
     "description": "React hooks",
     "keywords": [
         "javascript",
@@ -49,7 +49,7 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "27737f20865cc496b94c42c75f908f4dce5018fa",
+    "gitHead": "0afeed292591d823f72f5611a078f94c21321d2e",
     "dependencies": {
         "@folklore/events": "^0.0.5",
         "@folklore/services": "^0.1.40",