[html/javascript/videojs] videojs 기본 기능 셋팅(개인 설정용)

#html

 <video id="myPlayer"  class="video-js vjs-default-skin"  webkit-playsinline muted hidden></video>

 

#javascript

var player = videojs("myPlayer", {
  sources: [{ src: "/resources/01.mp4", type: "video/mp4" }],
  poster: "/resources/poster.png",
  controls: false,
  playsinline: false,
  fluid: true, // fit
  preload: "metadata",
});

//events 
player.on("loadedmetadata", () => {
  console.log("loadedmetadata");
});

player.on("loadeddata", () => {
  console.log("loadeddata");
});
player.on("canplay", () => {
  console.log("canplay");
});
player.on("canplaythrough", () => {
  console.log("canplaythrough");
});
player.on("play", () => {
  console.log("play");
});

player.on("seeked", () => {
  console.log("seeked");
});
player.on("seeking", () => {
  console.log("seeking");
});

player.on("ended", () => {
  if (current == 0) {
    player.play();
  }
});

//play
const playVideo = (index, src, isAuto) => {
  current = index;
  player.src(src);
  isAuto ? player.autoplay("true") : "";
  player.load();
  player.play();
};

 

#videojs