Advert Link

import { newEvent } from "@/lib/newEvent";
import { BwPlayerConsumer } from "@/registry/html/PlayerProvider";

const getHostName = (url) => {
  try {
    return new URL(url).hostname.replace(/^www\./, "");
  } catch {
    return null;
  }
};

export class BwAdvertLink extends BwPlayerConsumer {
  _link = null;
  _listener = null;

  constructor() {
    super();

    this._link = document.createElement("a");
    this._link.setAttribute("target", "_blank");
    this._link.setAttribute("rel", "noreferrer");
    this._link.addEventListener("click", () => {
      if (!this._player) return;
      this._player.onEvent(
        newEvent({
          type: "PressedAdvertLink",
          description: "The advert link was pressed to open the click-through URL in a new tab.",
          initiatedBy: "user",
        }),
      );
    });
  }

  #render() {
    const advert = this._player?.adverts?.[this._player.advertIndex];
    if (!advert) {
      this._link.remove();
      return;
    }
    this._link.setAttribute("href", advert.clickThroughUrl);
    this._link.textContent = getHostName(advert.clickThroughUrl) ?? "";
    if (!this._link.isConnected) this.appendChild(this._link);
  }

  connectedCallback() {
    super.connectedCallback();
    this._listener = this._player?.addEventListener("<any>", () => this.#render());
    this.#render();
  }

  disconnectedCallback() {
    this._player?.removeEventListener("<any>", this._listener);
    this._listener = null;
    super.disconnectedCallback();
  }
}

customElements.define("bw-advert-link", BwAdvertLink);