// ==UserScript==
// @name        Better DGG Kick Embed
// @namespace   yuniDev.kickembed
// @match       https://kick.com/*
// @match       https://www.destiny.gg/bigscreen
// @match       https://destiny.gg/bigscreen
// @grant       none
// @version     1.4
// @license     MIT
// @author      yuniDev
// @run-at      document-idle
// @description Hacky solution to embed full kick site instead of the embed. I can't promise it will continue to work indefinitely. If it bugs out when resizing the window, try refreshing the page.
// @downloadURL none
// ==/UserScript==

function htmlToNode(html) {
    const template = document.createElement('template');
    template.innerHTML = html;
    return template.content.firstChild;
}

function hideElObserver(selector) {
    function checkAndHide(obs) {
        const elToHide = document.querySelector(selector);
        if (elToHide) {
            elToHide.style.display = 'none';
            obs.disconnect();
        }
    }
    const observer = new MutationObserver((_, obs) => checkAndHide(obs));
    observer.observe(document.body, { childList: true, subtree: true });
    checkAndHide(observer);
}

function hideSurroundings() {
    [...document.querySelectorAll("nav")].forEach(el => el.style = "display: none;");

    hideElObserver("#channel-chatroom");
    hideElObserver("#sidebar-wrapper");
    hideElObserver("#channel-content");

    const injectedChannelPlayer = document.getElementById("injected-channel-player");
    if (injectedChannelPlayer) {
      injectedChannelPlayer.style = "padding: 0px; max-height: max-content;";
      injectedChannelPlayer.parentNode.style = "max-height: max-content;";
    }

    const bodyChild = document.body.firstChild;
    if (bodyChild) {
      bodyChild.style = "height: min-content;";
      [...bodyChild.children].forEach(el => el.style = el.getAttribute("style") ?? "" +  ";padding-top: 0px;");
    }
    document.body.style = "height: min-content;";

    hideElObserver(".z-modal:has(button[data-testid='accept-cookies'])");
}

function updateEmbed() {
  const iframe = document.querySelector("iframe.embed-frame");
  const iframeLocation = iframe.src;
  let channel = null;
  if (iframeLocation.includes("player.kick")) {
    channel = iframeLocation.split('/').pop();
  } else if (window.location.hash.startsWith("#kick/")) {
    channel = window.location.hash.split('/')[1];
  }
  if (!iframe || !channel) return;
  iframe.src = `https://kick.com/${channel}`;
  iframe.setAttribute("src", `https://kick.com/${channel}`);
  iframe.setAttribute("is", "x-frame-bypass");
}

function loadDGG(channel) {
  document.body.appendChild(htmlToNode(`<script type="module" src="https://unpkg.com/x-frame-bypass"></script>`));

  function embedObserver(list, obs) {
    for (const mutation of list) {
      if (mutation.type === 'childList' && mutation.addedNodes.length > 0) {
        for (const node of mutation.addedNodes) {
          if (node.nodeType === Node.ELEMENT_NODE &&
              node.tagName === 'IFRAME' &&
              node.classList.contains('embed-frame'))
            updateEmbed();
        }
      }
    }
  }
  const observer = new MutationObserver((obj, obs) => embedObserver(obj, obs));
  observer.observe(document.getElementById("embed"), { childList: true, subtree: true });
  updateEmbed();

  function clearObserver() {
    observer.disconnect();
    removeEventListener('hashchange', clearObserver);
  }
  addEventListener('hashchange', clearObserver);
}

if (window.location.hostname === "kick.com" && window.self !== window.top) { // Kick inside of iframe
  hideSurroundings();
  setInterval(() => {
    if (![...document.querySelectorAll("nav")].find(el => el.getAttribute("style") && el.getAttribute("style").indexOf("display: none") > -1)) hideSurroundings();
  }, 200);
} else if (window.location.pathname === "/bigscreen") {
  loadDGG();
  addEventListener('hashchange', loadDGG);
}