feat(Ads): Allow use a custom playhead tracker in CS

[avelad]

Related to #2792

This is useful because it allows you to implement the use of IMA on platforms that do not support multiple video elements. See #5543 (comment)

[github-actions]

Incremental code coverage: No instrumented code was changed.

[joeyparrish]

It might be nice to have some details here on why/when you might want this. In the PR description, too.

[avelad]

Done!

[theodab]

Ok, I have to admit I'm not sure what this has to do with having multiple video elements?
I tried the change out and it doesn't seem to result in the ad container having a different DOM structure than the regular method.

[avelad]

The structure is the same, but the playhead tracker is used to get the position of the original video. If you can only have one video, if you delete it to leave the video to the ad, you stop having the position of the original video, so you can no longer track the position to launch the ads (vmap case)

[joeyparrish]

Looks fine otherwise.

[avelad]

With the following code implemented on the application side it is possible to support #2792

Using ads.customPlayheadTracker = true

this.eventManager_.listen(this.adManager_, shaka.ads.AdManager.AD_STARTED, (e) => {
  if (e?.originalEvent?.type !== google.ima.AdEvent.Type.CONTENT_PAUSE_REQUESTED) {
    return;
  }
  if (loadTimeout) {
    clearTimeout(loadTimeout);
  }
  if (prevUrl === undefined && prevTime === undefined) {
    prevUrl = this.player_.getAssetUri();
    if (!this.player_.isLive()) {
      prevTime = this.video_.currentTime;
    }
    this.player_.detach();
    while (this.video_.lastChild) {
      this.video_.removeChild(this.video_.firstChild);
    }
  }
});

this.eventManager_.listen(this.adManager_, shaka.ads.AdManager.AD_STOPPED, (e) => {
  if (e?.originalEvent?.type !== google.ima.AdEvent.Type.CONTENT_RESUME_REQUESTED) {
    return;
  }
  if (loadTimeout) {
    clearTimeout(loadTimeout);
  }
  loadTimeout = setTimeout(async () => {
    await this.player_.attach(this.video_, true);
    this.player_.load(prevUrl, prevTime).then(() => {
      externalConfigAfterLoad();
    });
    prevUrl = undefined;
    prevTime = undefined;
  }, 100);
});

The idea is to implement this within ShakaPlayer itself in a future release.