// ==UserScript==
// @name Host Selector
// @version 2
// @description:de Ermöglicht Auswahl von Video-Host und speichert die Auswahl. Funktioniert bei https://aniworld.to/ und https://s.to
// @description:en Enables selection of video host and saves the choice. Works on https://aniworld.to/ and https://s.to
// @description:ja ビデオホストの選択と選択内容の保存を可能にします。https://aniworld.to/ および https://s.to で動作します。
// @author       𝕭𝖚𝖉𝖚𝖒𝖟
// @icon https://w0.peakpx.com/wallpaper/40/813/HD-wallpaper-walpaper-zedge.jpg
// @match https://aniworld.to/*
// @match https://s.to/serie/stream/*
// @grant GM_addStyle
// @namespace http://tampermonkey.net/
// @description Enhanced GUI for aniworld.to and s.to websites, allowing you to effortlessly choose your preferred video host and have it automatically opened. A convenient green button positioned at the bottom right corner of the page will appear, prompting you to click and select your desired host from a user-friendly drop-down menu. Enjoy seamless video streaming with the host of your choice!
// @downloadURL none
// ==/UserScript==

(function () {
    'use strict';

    // Function to create and show the GUI pop-up
    function createGUI() {
        const existingPopup = document.getElementById('hostSelectorPopup');
        if (existingPopup) {
            // Close the existing popup if it's already open
            document.body.removeChild(existingPopup);
        }

        const popupDiv = document.createElement('div');
        popupDiv.id = 'hostSelectorPopup';
        popupDiv.innerHTML = `
      <div style="position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background: #ffffff; border: 1px solid #ddd; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1); max-width: 400px; width: 100%; padding: 20px; border-radius: 8px; font-family: 'Arial', sans-serif;">
        <h2 style="font-size: 20px; margin-bottom: 20px; color: #333;">Preferred Hoster</h2>
        <label for="preferredHoster" style="font-size: 16px; color: #555;">Select your preferred Hoster:</label>
        <select id="preferredHoster" style="width: 100%; padding: 10px; margin-bottom: 20px; font-size: 14px; border: 1px solid #ddd; border-radius: 4px; color: #555;">
          <option value="VOE">VOE</option>
          <option value="Doodstream">Doodstream</option>
          <option value="Vidoza">Vidoza</option>
          <option value="Streamtape">Streamtape</option>
        </select>
        <button id="submitButton" style="background-color: #4CAF50; color: white; padding: 10px 20px; border: none; border-radius: 4px; cursor: pointer; font-size: 16px;">Submit</button>
        <button id="closeButton" style="background-color: #ddd; color: #333; margin-left: 10px; padding: 10px 20px; border: none; border-radius: 4px; cursor: pointer; font-size: 16px;">Close</button>
      </div>
    `;
        document.body.appendChild(popupDiv);

        // Check if there's a previously selected preferred hoster in localStorage and pre-select it
        const storedPreferredHoster = localStorage.getItem('preferredHoster');
        const preferredHosterSelect = document.getElementById('preferredHoster');
        if (storedPreferredHoster && Array.from(preferredHosterSelect.options).some(option => option.value === storedPreferredHoster)) {
            preferredHosterSelect.value = storedPreferredHoster;
        }

        // Set up event listener for the submit button
        const submitButton = document.getElementById('submitButton');
        submitButton.addEventListener('click', () => {
            const preferredHoster = preferredHosterSelect.value;

            // Save the selected preferred hoster in localStorage
            localStorage.setItem('preferredHoster', preferredHoster);

            // Find the corresponding hoster link and emulate a click for the preferred hoster
            const hosterLinks = document.querySelectorAll('a.watchEpisode');
            for (const link of hosterLinks) {
                const hosterName = link.querySelector('h4').innerText;
                if (hosterName === preferredHoster) {
                    // Introduce a delay before clicking to ensure the page has processed the selection
                    setTimeout(() => {
                        link.querySelector('.hosterSiteVideoButton').click();
                    }, 120);
                    break;
                }
            }

            // Close the GUI pop-up after selecting and clicking the hoster
            document.body.removeChild(popupDiv);
        });

        // Set up event listener for the close button
        const closeButton = document.getElementById('closeButton');
        closeButton.addEventListener('click', () => {
            // Close the GUI pop-up without taking any action
            document.body.removeChild(popupDiv);
        });
    }

    // Auto-select preferred hoster if available
    const storedPreferredHoster = localStorage.getItem('preferredHoster');
    if (storedPreferredHoster) {
        const hosterLinks = document.querySelectorAll('a.watchEpisode');
        for (const link of hosterLinks) {
            const hosterName = link.querySelector('h4').innerText;
            if (hosterName === storedPreferredHoster) {
                // Introduce a delay before clicking to ensure the page has processed the selection
                setTimeout(() => {
                    link.querySelector('.hosterSiteVideoButton').click();
                }, 120);
                break;
            }
        }
    }

    // Add a button to the page
    function addGUIButton() {
        const existingButton = document.getElementById('hostSelectorButton');
        if (existingButton) {
            // Remove the existing button if it already exists
            document.body.removeChild(existingButton);
        }

        const button = document.createElement('button');
        button.id = 'hostSelectorButton';
        button.innerText = 'Open GUI';
        button.style.position = 'fixed';
        button.style.bottom = '20px';
        button.style.right = '20px';
        button.style.background = '#4CAF50';
        button.style.color = 'white';
        button.style.padding = '10px 20px';
        button.style.border = 'none';
        button.style.borderRadius = '4px';
        button.style.cursor = 'pointer';
        button.style.fontSize = '16px';
        button.addEventListener('click', createGUI);
        document.body.appendChild(button);
    }

    // Add the CSS styles
    GM_addStyle(`
    body {
      margin: 0;
      padding: 0;
      font-family: 'Arial', sans-serif;
    }

    button {
      outline: none;
    }
  `);

    // Add the GUI button to the page
    addGUIButton();
})();