audio-video-links-generator/script.js

function getCastopodURL() {
  let castopod_url;
  try {
    castopod_url = document.querySelector("#castopod").value;
    const regex =
      /^https:\/\/podcast\.internet-czas-dzialac\.pl\/@icd\/episodes\//;
    if (!regex.test(castopod_url)) {
      throw new Error(
        "Incorrect Castopod URL format! Please paste the correct URL. Example: https://podcast.internet-czas-dzialac.pl/@icd/episodes/icd-weekend-6-stara-myszka-mickey-nowy-prezes-uodo-i-sony-psujace-sylwestra"
      );
    }
  } catch (error) {
    alert(error);
  }
  return castopod_url;
}

function getPeertubeID() {
  let peertube_id;

  try {
    const regex =
      /^https:\/\/video\.internet-czas-dzialac\.pl\/w\/[a-zA-Z0-9]{22,}$/;
    peertube_id = document.querySelector("#peertube").value.split("/w/")[1];

    if (
      !regex.test(document.querySelector("#peertube").value) ||
      !peertube_id
    ) {
      throw new Error(
        "Incorrect PeerTube URL format! Please paste the correct URL. Example: https://video.internet-czas-dzialac.pl/w/nTgqnY7FJLQzNYfD9xtcSy"
      );
    }
  } catch (error) {
    alert(error);
  }
  return peertube_id;
}

function makeCastopodPlayer(castopod_url) {
  return /* HTML */ `<div class="player">
    <iframe
      width="100%"
      height="112"
      frameborder="0"
      scrolling="no"
      style="width: 100%; height: 112px;  overflow: hidden;"
      src="${castopod_url}/embed/light"
    ></iframe>
  </div>`;
}

function makePeertubePlayer(peertube_id) {
  return /* HTML */ ` <div class="player">
    <iframe
      sandbox="allow-same-origin allow-scripts"
      src="https://video.internet-czas-dzialac.pl/videos/embed/${peertube_id}"
      allowfullscreen=""
      width="100%"
      height="394"
      frameborder="0"
    ></iframe>
  </div>`;
}

function makeAudioLinks(castopod_url) {
  return /* HTML */ ` <div class="podcast-logos audio-logos">
    <a
      title="Link do naszego podcastowego RSSa"
      alt="Logo RSS"
      href="https://podcast.internet-czas-dzialac.pl/@icd/feed.xml"
    >
      <img
        class="logo"
        height="32"
        width="32"
        src="https://assets.midline.pl/logos/light/rss.svg"
      />
    </a>
    <a
      title="${document.querySelector("#episode_name")
        .value} na naszej instancji Castopod."
      alt="Logo Castopod"
      href="${castopod_url}"
    >
      <img
        class="logo"
        style="--dark-image: url('https://assets.midline.pl/logos/dark/castopod.svg')"
        src="https://assets.midline.pl/logos/light/castopod.svg?v=2"
        height="32"
      />
    </a>
    <a
      title="Podcast 'Internet. Czas działać!' w aplikacji AntennaPod."
      alt="Logo AntennaPod"
      href="https://antennapod.org/deeplink/subscribe/?url=https://podcast.internet-czas-dzialac.pl/@icd/feed.xml"
    >
      <img
        class="logo"
        height="32"
        width="32"
        src="https://assets.midline.pl/logos/light/antennapod.svg"
      />
    </a>
    <a
      title="Podcast 'Internet. Czas działać!' w aplikacji Patronite Audio."
      alt="Logo Patronite Audio"
      href="https://patronite.pl/patrocast/podcasts/f2eaf21a-8c3e-4e7f-93e1-c11868afa5f0/details"
    >
      <img
        class="logo"
        src="https://assets.midline.pl/logos/light/patronite-audio.svg"
        height="32"
        width="32"
      />
    </a>
    <a
      title="Podcast 'Internet. Czas działać!' w serwisie Spotify."
      alt="Logo Spotify"
      href="https://open.spotify.com/show/2BSREI0uQcADS8W0RHrkxB"
    >
      <img
        class="logo"
        style="--dark-image: url('https://assets.midline.pl/logos/dark/spotify.svg')"
        src="https://assets.midline.pl/logos/light/spotify.svg"
        height="48"
      />
    </a>
    <a
      title="Podcast 'Internet. Czas działać!' w serwisie Apple Podcasts."
      alt="Logo Apple Podcasts"
      href="https://podcasts.apple.com/pl/podcast/internet-czas-dzia%C5%82a%C4%87/id1536929719"
    >
      <img
        class="logo"
        src="https://assets.midline.pl/logos/light/apple-podcasts.svg"
        height="48"
      />
    </a>
    <a
      title="Podcast 'Internet. Czas działać!' w serwisie Google Podcasts."
      alt="Logo Podcasty Google"
      href="https://podcasts.google.com/feed/aHR0cHM6Ly9wb2RjYXN0Lm1pZGxpbmUucGwvZmVlZC54bWw?sa=X&ved=0CAUQrrcFahcKEwiYtdDr7__sAhUAAAAAHQAAAAAQAQ"
    >
      <img
        class="logo"
        src="https://assets.midline.pl/logos/light/google-podcasts.svg"
        height="48"
      />
    </a>
  </div>`;
}

function makeVideoLinks(peertube_id) {
  return /* HTML */ ` <div class="podcast-logos video-logos">
    <a
      title="${document.querySelector("#episode_name")
        .value} na naszej instancji PeerTube."
      alt="Logo PeerTube"
      href="https://video.internet-czas-dzialac.pl/videos/watch/${peertube_id}"
    >
      <img
        class="logo"
        style="--dark-image: url('https://assets.midline.pl/logos/dark/peertube.svg')"
        src="https://assets.midline.pl/logos/light/peertube.svg"
        height="48"
      />
    </a>
    <a
      title="${document.querySelector("#odysee").value
        ? `${document.querySelector("#episode_name").value} w serwisie Odysee`
        : `Kanał 'Internet. Czas działać!' w serwisie Odysee.`}"
      alt="Logo Odysee"
      href="${document.querySelector("#odysee").value
        ? document.querySelector("#odysee").value
        : "https://odysee.com/@internetczasdzialac"}"
    >
      <img
        class="logo"
        src="https://assets.midline.pl/logos/light/odysee.svg"
        style="--dark-image: url('https://assets.midline.pl/logos/dark/odysee.svg')"
        height="48"
      />
    </a>
    <a
      title="${document.querySelector("#episode_name")
        .value} w serwisie YouTube."
      alt="Logo YouTube"
      href="${document.querySelector("#youtube").value}"
    >
      <img
        class="logo"
        src="https://assets.midline.pl/logos/light/youtube.svg"
        style="--dark-image: url('https://assets.midline.pl/logos/dark/youtube.svg')"
        height="48"
      />
    </a>
  </div>`;
}

function generateHtml() {
  const castopod_url = getCastopodURL();
  const peertube_id = getPeertubeID();

  let html = "";

  if (document.querySelector("#castopod-player-visible").checked) {
    html += makeCastopodPlayer(castopod_url);
  }

  if (document.querySelector("#peertube-player-visible").checked) {
    html += makePeertubePlayer(peertube_id);
  }

  if (document.querySelector("#audio-links-visible").checked) {
    html += makeAudioLinks(castopod_url);
  }

  if (document.querySelector("#video-links-visible").checked) {
    html += makeVideoLinks(peertube_id);
  }

  console.log("Copied to clipboard");
  document.querySelector("textarea").value = html;
  document.querySelector(".preview").innerHTML = html;
}

function copyHtml() {
  if (navigator) {
    navigator.clipboard.writeText(document.querySelector("textarea").value);
  }
}