Converting the inline javascript to pure javascript, how would this be done?

Would this way have worked too, or no?
data-autoplay=“0”

  const enableAutoplay = (el) => el.src.replace("autoplay=0", "autoplay=1");
  const autoplay = (el) => el.setAttribute("src", enableAutoplay(el));

I don’t think that’s compatible with the Youtube API.

It’s shown in here:

Would I be able to set it up that way?

 <div data-video="VIDEO_ID"  
         data-autoplay="0"         
         data-loop="1"             
         id="youtube-audio">
  </div>

It’s replacing the data value with other values that is not a good idea.

You can have data-autoplay in the div, or you can have it in the onYouTubePlayerAPIReady code. Both at the same time is not a good idea.

I’ll have this outside:

<div class="video " data-autoplay="0" data-id="M7lc1UVf-VE"></div>

  playerVars: {
        autoplay: ctrlq1.dataset.autoplay,

Then this would be able to read it, right?
or no?

  const enableAutoplay = (el) => el.src.replace("autoplay=0", "autoplay=1");
  const autoplay = (el) => el.setAttribute("src", enableAutoplay(el));

Doing that though, doesn’t help the video to play when you click on the big cover play button.
In other words, it doesn’t work.

The data-autoplay is for when the youtube player is being initialized. It’s too late after that.

1 Like

oh, ok. thanks.

I was just told this:

It should be this:
That’s all that needed to be adjusted:

function coverClickHandler(evt) {
    const cover = evt.currentTarget;
    const wrapper = cover.parentNode.querySelector(".wrapg");
    const video = document.querySelector(".video");
    hide(cover);
    show(wrapper);
    autoplay(video);
  }

Not this:

  function coverClickHandler(evt) {
    const cover = evt.currentTarget;
    const wrapper = cover.parentNode.querySelector(".wrapg");
    hide(cover);
    show(wrapper);
    autoplay(wrapper);
  }

Would a ‘mousedown event’ work here, or still no?

No wouldn’t work

1 Like

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