☰

Serieslan Enhancements

Select video provider option automatically and change the background color of the page to improve visibility and reduce eye strain

  1. // ==UserScript==
  2. // @name         Serieslan Enhancements
  3. // @namespace    http://tampermonkey.net/
  4. // @version      0.1
  5. // @description  Select video provider option automatically and change the background color of the page to improve visibility and reduce eye strain
  6. // @author       JJJ
  7. // @match        https://serieslan.com/*
  8. // @icon         https://www.google.com/s2/favicons?sz=64&domain=serieslan.com
  9. // @grant        none
  10. // @license      MIT
  11. // ==/UserScript==
  12.  
  13. (function () {
  14.     'use strict';
  15.  
  16.     // Constants
  17.     const CLASS_SELECTOR = 'div.sels > button.selop';
  18.     const STORAGE_KEY = 'selectedOption';
  19.  
  20.     // CSS styles for the custom menu and page background
  21.     const menuStyles = `
  22.             /* Set background color to #2F353A for all elements */
  23.             body,div, li, ul, header, footer {
  24.                 background-color: #2F353A !important;
  25.             }
  26.             
  27.             /* Set text color to white for all text elements */
  28.             body, p, h1, h2, h3, h4, h5, h6, span, a, li, div:not(#customMenu div), button:not(#customMenu button) {
  29.                 color: white !important;
  30.             }
  31.             
  32.             /* Additional styles to improve visibility on links, if needed */
  33.             a:not(#customMenu a) {
  34.                 text-decoration: underline !important;
  35.             }
  36.     
  37.             #customMenu {
  38.                 position: fixed;
  39.                 top: 50%;
  40.                 left: 50%;
  41.                 transform: translate(-50%, -50%);
  42.                 background-color: rgba(255, 255, 255, 0.95) !important; /* Ensure background color is not overridden */
  43.                 border: 2px solid #000;
  44.                 padding: 15px;
  45.                 z-index: 9999;
  46.                 box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  47.                 border-radius: 8px;
  48.                 font-family: Arial, sans-serif;
  49.                 width: 300px;
  50.                 text-align: center;
  51.                 color: black !important; /* Ensure text color is not overridden */
  52.             }
  53.     
  54.             #customMenu select {
  55.                 width: 100% !important;
  56.                 padding: 10px !important;
  57.                 margin-bottom: 10px !important;
  58.                 border: 1px solid #ccc !important;
  59.                 border-radius: 4px !important;
  60.                 background-color: #FFFFFF !important; /* Ensure background color is white */
  61.                 color: black !important; /* Ensure text color is not overridden */
  62.                 -webkit-appearance: none !important; /* Disable default styling */
  63.                 -moz-appearance: none !important; /* Disable default styling */
  64.                 appearance: none !important; /* Disable default styling */
  65.             }
  66.     
  67.             #customMenu button {
  68.                 padding: 10px 20px;
  69.                 border: none;
  70.                 background-color: #007bff !important; /* Ensure background color is not overridden */
  71.                 color: white !important; /* Ensure text color is not overridden */
  72.                 font-size: 14px;
  73.                 cursor: pointer;
  74.                 border-radius: 4px;
  75.             }
  76.     
  77.             #customMenu button:hover {
  78.                 background-color: #0056b3 !important; /* Ensure hover background color is not overridden */
  79.             }
  80.         `;
  81.  
  82.     // Function to create the dropdown menu
  83.     function createDropdownMenu(options) {
  84.         const dropdownMenu = document.createElement('select');
  85.         dropdownMenu.id = 'optionDropdown';
  86.  
  87.         options.forEach((option) => {
  88.             const dropdownOption = document.createElement('option');
  89.             dropdownOption.value = option.getAttribute('title') || option.textContent.trim();
  90.             dropdownOption.textContent = option.getAttribute('title') || option.textContent.trim();
  91.             dropdownMenu.appendChild(dropdownOption);
  92.         });
  93.  
  94.         return dropdownMenu;
  95.     }
  96.  
  97.     // Function to toggle the menu visibility
  98.     function toggleMenu() {
  99.         const menu = document.getElementById('customMenu');
  100.         if (menu) {
  101.             menu.style.display = menu.style.display === 'none' ? 'block' : 'none';
  102.             console.log('Menu toggled, new display:', menu.style.display);
  103.         } else {
  104.             console.log('Menu element not found.');
  105.         }
  106.     }
  107.  
  108.     // Function to handle option selection
  109.     function handleOptionSelection() {
  110.         const selectedOptionValue = document.getElementById('optionDropdown').value;
  111.         const options = document.querySelectorAll(CLASS_SELECTOR);
  112.  
  113.         options.forEach((option) => {
  114.             if ((option.getAttribute('title') || option.textContent.trim()) === selectedOptionValue) {
  115.                 option.click();
  116.                 localStorage.setItem(STORAGE_KEY, selectedOptionValue);
  117.                 toggleMenu();
  118.             }
  119.         });
  120.     }
  121.  
  122.     // Function to create the custom menu
  123.     function createCustomMenu() {
  124.         const options = document.querySelectorAll(CLASS_SELECTOR);
  125.  
  126.         const dropdownMenu = createDropdownMenu(options);
  127.         const selectedOptionValue = localStorage.getItem(STORAGE_KEY);
  128.         if (selectedOptionValue !== null) {
  129.             dropdownMenu.value = selectedOptionValue;
  130.         }
  131.  
  132.         const confirmButton = document.createElement('button');
  133.         confirmButton.textContent = 'Confirm';
  134.         confirmButton.addEventListener('click', handleOptionSelection);
  135.  
  136.         const customMenu = document.createElement('div');
  137.         customMenu.id = 'customMenu';
  138.         customMenu.style.display = 'none';
  139.         customMenu.appendChild(dropdownMenu);
  140.         customMenu.appendChild(confirmButton);
  141.  
  142.         document.body.appendChild(customMenu);
  143.         console.log('Custom menu created and added to the body');
  144.     }
  145.  
  146.     // Function to automatically select the saved option
  147.     function autoSelectOption() {
  148.         const selectedOptionValue = localStorage.getItem(STORAGE_KEY);
  149.         if (selectedOptionValue !== null) {
  150.             const options = document.querySelectorAll(CLASS_SELECTOR);
  151.             options.forEach((option) => {
  152.                 if ((option.getAttribute('title') || option.textContent.trim()) === selectedOptionValue) {
  153.                     option.click();
  154.                 }
  155.             });
  156.         }
  157.     }
  158.  
  159.     // Function to initialize the script
  160.     function init() {
  161.         const styleElement = document.createElement('style');
  162.         styleElement.textContent = menuStyles;
  163.         document.head.appendChild(styleElement);
  164.         console.log('Styles added to the head');
  165.  
  166.         createCustomMenu();
  167.  
  168.         document.addEventListener('keydown', function (event) {
  169.             if (event.key === 'F2') {
  170.                 console.log('F2 key pressed');
  171.                 toggleMenu();
  172.             }
  173.         });
  174.  
  175.         setTimeout(autoSelectOption, 100); // Delay execution to allow page load
  176.  
  177.         console.log('Script initialized');
  178.     }
  179.  
  180.     // Run the script
  181.     init();
  182. })();