How to add video.removeEventListener to code?

Everytime I call the createResetHandler I bind the video.addEventListener to the same element.

I need to video.removeEventListener everytime I destroy the player.

How do I add video.removeEventListener to the code? https://jsfiddle.net/yb0tn7p9/

const videoPlayer = (function makeVideoPlayer() {
  const players = [];

  const tag = document.createElement("script");
  tag.src = "https://www.youtube.com/player_api";
  const firstScriptTag = document.getElementsByTagName("script")[0];
  firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

  function createResetHandler(player) {
    const resetVideos = document.querySelectorAll('.exit');
    resetVideos.forEach(function resetVideoHandler(video) {
        video.addEventListener('click', function resetVideoHandler() {
            player.destroy();
            console.log('hit')
          }
        );
      }
    )
  }

  function onPlayerReady(event) {
    const player = event.target;
    player.setVolume(100);
    createResetHandler(player);
  }

  function addPlayer(video, settings) {
    const defaults = {
      height: 360,
      host: "https://www.youtube-nocookie.com",
      videoId: video.dataset.id,
      width: 640
    };
    defaults.events = {
      "onReady": onPlayerReady
    };

    const playerOptions = combinePlayerOptions(defaults, settings);
    const player = new YT.Player(video, playerOptions);
    players.push(player);
    return player;
  }

  return {
    addPlayer
  };
}());

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.