Using setTimeout one time in the code instead of twice

Question

This set of code is used twice:

setTimeout(function () 
}, 621);

It is used to prevent the cover from being clicked on until the video is ready to be played.

Can that be used one time instead of twice in the code?

That is all I am trying to do.

I want to know if I can use setTimeout one time in the code.

Code: https://jsfiddle.net/efjwn8qd/

setTimeout(function () {
  const manageCover = (function makeManageCover() {

    function show(el) {
      el.classList.remove("hide");
    }

    function showCover(playButton) {
      const cover = playButton.parentElement;
      cover.classList.add("active");
      show(cover);
    }

    function coverClickHandler(evt) {
      const cover = evt.currentTarget;
      showCover(cover);
    }

    const playButton = document.querySelector(".playa");
    playButton.addEventListener("click", coverClickHandler);
  }());
}, 621);

const videoPlayer = (function makeVideoPlayer() {

  let player = null;

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

  function shufflePlaylist(player) {
    player.setShuffle(true);
    player.playVideoAt(0);
    player.stopVideo();
  }

  function onPlayerReady(event) {
    player = event.target;
    player.setVolume(0);
    shufflePlaylist(player);
  }

  function addPlayer(video) {

    const playlist = "2VwsvrPFr9w";

    const config = {
      height: 360,
      host: "https://www.youtube-nocookie.com",
      width: 640
    };
    config.playerVars = {
      cc_load_policy: 0,
      controls: 1,
      disablekb: 1,
      fs: 0,
      iv_load_policy: 3,
      loop: 1,
      playlist,
      rel: 0
    };
    config.events = {
      "onReady": onPlayerReady
    };
    player = new YT.Player(video, config);

  }

  function play() {
    player.playVideo();
  }
  return {
    addPlayer,
    play
  };
}());

function onYouTubeIframeAPIReady() {
  const cover = document.querySelector(".playa");
  const wrapper = cover.parentElement;
  const frameContainer = wrapper.querySelector(".video");
  videoPlayer.addPlayer(frameContainer);
}
setTimeout(function () {
  (function iife() {
    "use strict";

    function coverClickHandler() {
      videoPlayer.play();
    }

    const cover = document.querySelector(".playa");
    cover.addEventListener("click", coverClickHandler);
  }());
}, 621);

Answer 1

I went to the jsFiddle, cut the first setTimeout call and pasted it into the last setTimeout call, like this:

setTimeout(function () {
    const manageCover = (function makeManageCover() {

    function show(el) {
      el.classList.remove("hide");
    }

    function showCover(playButton) {
      const cover = playButton.parentElement;
      cover.classList.add("active");
      show(cover);
    }

    function coverClickHandler(evt) {
      const cover = evt.currentTarget;
      showCover(cover);
    }

    const playButton = document.querySelector(".playa");
    playButton.addEventListener("click", coverClickHandler);
  }());
  (function iife() {
    "use strict";

    function coverClickHandler() {
      videoPlayer.play();
    }

    const cover = document.querySelector(".playa");
    cover.addEventListener("click", coverClickHandler);
  }());
}, 621);

and it seemed to work with no issues.