Chengzhebei/public/myData/f-video.js

/* f-video.js */
let F_Video
;(function () {
  F_Video = function (url, option) {
    const u = window.navigator.userAgent.toLowerCase()
    const isAndroid = u.indexOf('android') > -1
    let player = new Object()

    let newCanvas = document.createElement('canvas')
    let params = {
      canvas: newCanvas,
      loop: option.loop || false,
      autoplay: option.autoplay || false,
      onEnded: () => {
        option.onEnded && option.onEnded()
        player.currentTime = 0
      }
    }

    newCanvas.style.width = '100%'
    newCanvas.style.height = '100%'
    newCanvas.style.objectFit = option.objectFit || 'cover'

    player = new JSMpeg.Player(url.replace('.mp4', '.ts'), {
      ...option,
      ...params
    })
    player.domElement = newCanvas

    // if (isAndroid) {
    //   let newCanvas = document.createElement("canvas");
    //   let params = {
    //     canvas: newCanvas,
    //     loop: option.loop || false,
    //     autoplay: option.autoplay || false,
    //     onEnded: () => {
    //       option.onEnded && option.onEnded();
    //       player.currentTime = 0;
    //     },
    //   };

    //   newCanvas.style.width = "100%";
    //   newCanvas.style.height = "100%";
    //   newCanvas.style.objectFit = option.objectFit || "cover";

    //   player = new JSMpeg.Player(url.replace(".mp4", ".ts"), {
    //     ...option,
    //     ...params,
    //   });
    //   player.domElement = newCanvas;
    // } else {
    //   let newVideo = document.createElement("video");
    //   newVideo.setAttribute("x5-video-player-type", "h5");
    //   newVideo.setAttribute("x-webkit-airplay", "true");
    //   newVideo.setAttribute("airplay", "allow");
    //   newVideo.setAttribute("playsinline", "");
    //   newVideo.setAttribute("webkit-playsinline", "");
    //   newVideo.setAttribute("src", url);
    //   option.loop && newVideo.setAttribute("loop", "loop");
    //   !option.autoplay && newVideo.setAttribute("preload", "auto");
    //   option.autoplay &&
    //     window.WeixinJSBridge &&
    //     window.WeixinJSBridge.invoke("getNetworkType", {}, (e) => {
    //       player.play();
    //     });

    //   newVideo.style.width = "100%";
    //   newVideo.style.height = "100%";
    //   newVideo.style.objectFit = option.objectFit || "cover";

    //   player = newVideo;
    //   player.domElement = newVideo;

    //   option.onPlay && player.addEventListener("play", option.onPlay);
    //   option.onPause && player.addEventListener("pause", option.onPause);
    //   option.onEnded && player.addEventListener("ended", option.onEnded);
    // }
    return player
  }
})()