Ferdium Slack screen share window workaround

user.js

module.exports = (config, Ferdium) => {
  document.body.addEventListener("click", function (event) {
    const qa = event.target.dataset.qa
    const parentQA = event.target.parentElement?.dataset.qa
    if (qa === "open-in-window" || parentQA === "open-in-window" || qa === "mini_player_open_in_new_window_button") {
      toggleCustomStyles()
    }
  })

  function toggleCustomStyles() {
    const styleId = "proper-screenshare-video-styles"
    let styleElement = document.getElementById(styleId)

    if (styleElement) {
      styleElement.remove()
    } else {
      styleElement = document.createElement("style")
      styleElement.id = styleId
      styleElement.type = "text/css"
      styleElement.innerHTML = `
            .p-huddle_sidebar_footer__container .p-file_drag_drop__container {
                width: 89vw;
                background: black;
            }
            .p-huddle_sidebar_footer__container .p-file_drag_drop__container video.p-presented_items_pane__screenshare,
            .p-huddle_sidebar_footer__container .p-file_drag_drop__container .p-presented_items_pane__slider {
                max-height: none;
            }
            .p-huddle_sidebar_footer__container .p-file_drag_drop__container .p-presented_items_pane__video {
                width: auto !important;
                height: 5vh !important;
            }
            .p-huddle_sidebar_footer__container .p-file_drag_drop__container .p-presented_items_pane__screenshare_overlay {
                display: none;
            }
            .p-presented_items_pane__screenshare {
                object-fit: contain;
            }
        `
      document.head.appendChild(styleElement)
    }
  }
}