@micromag/core 0.3.576 → 0.3.583

package/es/hooks.js

@@ -1414,6 +1414,42 @@ var useMediaState = function useMediaState() {
   };
 };
 
+function useMediaTimestampOffset(element) {
+  var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
+    _ref$attributeName = _ref.attributeName,
+    attributeName = _ref$attributeName === void 0 ? 'data-ts-offset' : _ref$attributeName;
+  var getTimestampOffset = function getTimestampOffset() {
+    return element !== null && element.hasAttribute(attributeName) ? parseFloat(element.getAttribute(attributeName)) : 0;
+  };
+  var _useState = useState(getTimestampOffset()),
+    _useState2 = _slicedToArray(_useState, 2),
+    timestampOffset = _useState2[0],
+    setTimestampOffset = _useState2[1];
+  var observerRef = useRef(null);
+  useEffect(function () {
+    if (element !== null) {
+      observerRef.current = new MutationObserver(function (mutations) {
+        mutations.forEach(function (_ref2) {
+          var mutationType = _ref2.type;
+          if (mutationType === 'attributes') {
+            setTimestampOffset(getTimestampOffset());
+          }
+        });
+      });
+      observerRef.current.observe(element, {
+        attributes: true,
+        attributeFilter: [attributeName]
+      });
+    }
+    return function () {
+      if (observerRef.current !== null) {
+        observerRef.current.disconnect();
+      }
+    };
+  }, [element]);
+  return timestampOffset;
+}
+
 function useMediaCurrentTime(element) {
   var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
     _ref$id = _ref.id,
@@ -1429,13 +1465,14 @@ function useMediaCurrentTime(element) {
     currentTime = _useState2[0],
     setCurrentTime = _useState2[1];
   var realCurrentTime = useRef(currentTime);
+  var tsOffset = useMediaTimestampOffset(element);
   var finalId = id || element;
   var lastIdRef = useRef(finalId);
   var idChanged = lastIdRef.current !== finalId;
   var disabledRef = useRef(disabled);
   var disabledChanged = disabledRef.current !== disabled;
   if (idChanged || disabledChanged) {
-    realCurrentTime.current = element !== null ? element.currentTime || 0 : 0;
+    realCurrentTime.current = element !== null ? Math.max((element.currentTime || 0) - tsOffset, 0) : 0;
     lastIdRef.current = finalId;
     disabledRef.current = disabled;
   }
@@ -1446,7 +1483,7 @@ function useMediaCurrentTime(element) {
       return function () {};
     }
     function updateTime() {
-      var time = element.currentTime || 0;
+      var time = Math.max((element.currentTime || 0) - tsOffset, 0);
       if (time !== realCurrentTime.current) {
         realCurrentTime.current = time;
         setCurrentTime(time);
@@ -1471,7 +1508,7 @@ function useMediaCurrentTime(element) {
     loop();
     return function () {
       if (element !== null) {
-        realCurrentTime.current = element.currentTime;
+        realCurrentTime.current = element.currentTime - tsOffset;
       }
       if (timeout !== null) {
         clearInterval(timeout);
@@ -1489,12 +1526,13 @@ function useMediaDuration(element) {
     _useState2 = _slicedToArray(_useState, 2),
     duration = _useState2[0],
     setDuration = _useState2[1];
+  var tsOffset = useMediaTimestampOffset(element);
   var realDuration = useRef(duration);
   var finalId = id || element;
   var lastIdRef = useRef(finalId);
   var idChanged = lastIdRef.current !== finalId;
   if (idChanged) {
-    realDuration.current = element !== null ? element.duration || 0 : 0;
+    realDuration.current = element !== null ? Math.max((element.duration || 0) - tsOffset, 0) : 0;
     lastIdRef.current = finalId;
   }
   useEffect(function () {
@@ -1504,7 +1542,7 @@ function useMediaDuration(element) {
       return function () {};
     }
     function updateDuration() {
-      var newDuration = element.duration || 0;
+      var newDuration = Math.max((element.duration || 0) - tsOffset, 0);
       if (newDuration !== realDuration.current) {
         realDuration.current = newDuration;
         setDuration(newDuration);
@@ -2341,4 +2379,4 @@ var useTrackMedia = function useTrackMedia() {
 var eventsManager = typeof window !== 'undefined' ? new EventsManager(window) : null;
 var useWindowEvent = createUseEvent(eventsManager);
 
-export { getObserver, useActivityDetector, useAnimationFrame, useDebounced as useDebounce, useDimensionObserver, useDocumentEvent, useDragProgress, useForm, useFormTransition, useFormattedDate, useFormattedTime, useFullscreen, useIntersectionObserver, useIsVisible, useLoadedFonts, useLongPress, useMediaApi, useMediaBuffering, useMediaCurrentTime, useMediaDuration, useMediaLoad, useMediaProgress, useMediaReady, useMediaState, useMediaThumbnail, useMediaWaveform, useMediasParser, useObserver, useParsedStory, useProgressSteps, useResizeObserver, useScreenSizeFromElement, useScreenSizeFromWindow, useSpringValue, useSwipe, useThemeParser, useTrackEvent, useTrackMedia, useTrackScreenEvent, useTrackScreenMedia, useTrackScreenView, useWindowEvent };
+export { getObserver, useActivityDetector, useAnimationFrame, useDebounced as useDebounce, useDimensionObserver, useDocumentEvent, useDragProgress, useForm, useFormTransition, useFormattedDate, useFormattedTime, useFullscreen, useIntersectionObserver, useIsVisible, useLoadedFonts, useLongPress, useMediaApi, useMediaBuffering, useMediaCurrentTime, useMediaDuration, useMediaLoad, useMediaProgress, useMediaReady, useMediaState, useMediaThumbnail, useMediaTimestampOffset, useMediaWaveform, useMediasParser, useObserver, useParsedStory, useProgressSteps, useResizeObserver, useScreenSizeFromElement, useScreenSizeFromWindow, useSpringValue, useSwipe, useThemeParser, useTrackEvent, useTrackMedia, useTrackScreenEvent, useTrackScreenMedia, useTrackScreenView, useWindowEvent };

package/es/utils.js

@@ -971,7 +971,7 @@ var getStyleFromMargin = function getStyleFromMargin(value) {
   } : null);
 };
 
-var possibleMimes = ['video/webm', 'video/mp4', 'video/ogg'];
+var possibleMimes = ['video/webm', 'video/mp4', 'video/ogg', 'application/vnd.apple.mpegurl'];
 var supportedMimes = null;
 function getVideoSupportedMimes() {
   var mimes = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : possibleMimes;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@micromag/core",
-    "version": "0.3.576",
+    "version": "0.3.583",
     "private": false,
     "description": "",
     "keywords": [
@@ -144,5 +144,5 @@
         "access": "public",
         "registry": "https://registry.npmjs.org/"
     },
-    "gitHead": "fa6ef8f8ed78d40e2a96e669c9cd794a50269c4b"
+    "gitHead": "d899cc28ac1f5b552114d8bfcd668a9bb8ab651c"
 }