react-video-annotation-tool/dist/VideoPlayer/Player.js

A React-based video player with built-in annotation features, enabling interactive video tagging and markup for seamless media annotation workflows

function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
import React, { forwardRef, useEffect, useRef } from 'react';
var Player = /*#__PURE__*/forwardRef(function VideoElem(props, ref) {
  var videoControls = props.videoControls;
  var playerRef = useRef();
  useEffect(function () {
    if (!playerRef) return;
    ref.current = playerRef.current;
    var videoElement = playerRef.current;
    console.log(props.url);
    videoElement.src = props === null || props === void 0 ? void 0 : props.url;
    videoElement.crossOrigin = 'anonymous';
    videoElement.loop = true;
    videoElement.autoPlay = true;
    videoElement.addEventListener('loadeddata', function () {});
    return function () {
      videoElement.removeEventListener('loadeddata', function () {});
    };
  }, [props === null || props === void 0 ? void 0 : props.parentref, props.url, ref]);
  return /*#__PURE__*/React.createElement("video", _extends({
    style: {
      minHeight: 300,
      objectFit: "cover",
      minWidth: 500,
      position: "absolute",
      top: 0,
      left: 0,
      width: props.dimensions.width,
      height: props.dimensions.height
    },
    ref: playerRef
  }, videoControls, {
    preload: "auto",
    controls: false
  }));
});
export default Player;