Rearrange Links on animestars.org

Располагает ссылки в заданном порядке на странице animestars.org и заменяет ссылку на "Моя коллекция" на "Ответы на вопросы" с новой иконкой. Добавлены специфические размеры для ПК и телефонов.

目前為 2024-10-05 提交的版本,檢視 最新版本

// ==UserScript==
// @name         Rearrange Links on animestars.org
// @namespace    http://tampermonkey.net/
// @version      2.2
// @description  Располагает ссылки в заданном порядке на странице animestars.org и заменяет ссылку на "Моя коллекция" на "Ответы на вопросы" с новой иконкой. Добавлены специфические размеры для ПК и телефонов.
// @author       eretly
// @match        https://animestars.org/*
// @grant        none
// @license MIT
// ==/UserScript==

(function() {
    'use strict';

    // Функция для поиска элемента по XPath
    function getElementByXpath(path) {
        return document.evaluate(path, document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
    }

    // Функция для генерации XPath для ссылки по её номеру
    function generateLinkXPath(number) {
        return `/html/body/div[2]/ul/li[${number}]/a`;
    }

    // Массив с номерами ссылок, как они должны располагаться в новом порядке
    let linksToSwap = [3, 2, 5, 6, 7, 10, 4, 9, 8, 1, 11];

    // Массив для хранения оригинальных элементов ссылок
    let originalLinks = [];

    // Проходим по всем ссылкам (1-11) и сохраняем их в оригинальном порядке
    for (let i = 1; i <= 11; i++) {
        let linkXPath = generateLinkXPath(i);
        let linkElement = getElementByXpath(linkXPath);
        if (linkElement) {
            originalLinks.push(linkElement); // Сохраняем оригинальные ссылки
        }
    }

    // Меняем текст ссылки "Моя списки" на "Мои списки"
    const myListsLinkXPath = '/html/body/div[2]/ul/li[6]/a'; // XPath для ссылки
    const myListsLink = getElementByXpath(myListsLinkXPath);

    if (myListsLink) {
        // Изменяем текст внутри ссылки, сохраняя иконку
        myListsLink.childNodes[1].textContent = "Мои списки"; // Изменяем текст второго дочернего узла
    }

    // Заменяем ссылку "Моя коллекция" на "Ответы на вопросы" с новой иконкой, добавляем стили для размеров и убираем отступы
    const collectionLinkXPath = generateLinkXPath(10); // XPath для "Моя коллекция", которую заменяем на "Ответы на вопросы"
    const collectionLink = getElementByXpath(collectionLinkXPath);

    if (collectionLink) {
        collectionLink.outerHTML = `
            <a href="https://animestars.org/faq/" class="custom-link" style="display: flex; flex-direction: column; align-items: center; text-align: center; width: 155px; height: 67.6px; box-sizing: border-box; margin: 0; padding: 0;">
                <svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" viewBox="0 0 14 14" class="fal" style="opacity: 0.9; margin-bottom: 4px;">
                     <circle cx="7" cy="7" r="6.5" fill="none" stroke="#b3b3b3" stroke-linecap="round" stroke-linejoin="round"/>
                    <path fill="none" stroke="#b3b3b3" stroke-linecap="round" stroke-linejoin="round" d="M5.5 5.5A1.5 1.5 0 1 1 7 7v1"/>
                    <path fill="#b3b3b3" d="M7 9.5a.75.75 0 1 0 .75.75A.76.76 0 0 0 7 9.5Z"/>
                </svg>
                Ответы на вопросы
            </a>`;
    }

    // Изменяем ширину, высоту и убираем отступы для ссылки "Новое"
    const newLinkXPath = '/html/body/div[2]/ul/li[8]/a'; // XPath для ссылки "Новое"
    const newLink = getElementByXpath(newLinkXPath);

    if (newLink) {
        newLink.style.width = '155px'; // Устанавливаем ширину для ПК
        newLink.style.height = '67.6px'; // Устанавливаем высоту для ПК
        newLink.style.margin = '0'; // Убираем любые внешние отступы
        newLink.style.padding = '0'; // Убираем внутренние отступы
    }

    // Переставляем элементы ссылок по новому порядку
    linksToSwap.forEach((newPosition, index) => {
        // Найдем текущий родительский элемент
        let parent = originalLinks[index].parentNode;

        // Проверяем, существует ли ссылка для перестановки
        if (originalLinks[newPosition - 1] && parent) {
            // Заменяем текущий элемент на новый в правильном порядке
            parent.replaceChild(originalLinks[newPosition - 1].cloneNode(true), originalLinks[index]);
        }
    });

    // Адаптивность с использованием медиазапросов для "Ответы на вопросы" и "Новое", и убираем отступы
    const style = document.createElement('style');
    style.textContent = `
        @media (max-width: 768px) {
            .custom-link, ${newLinkXPath} {
                width: 145.68px !important; /* Ширина для телефонов */
                height: 67.6px !important;  /* Высота для телефонов */
                margin: 0 !important; /* Убираем внешние отступы */
                padding: 0 !important; /* Убираем внутренние отступы */
            }
        }
    `;
    document.head.appendChild(style);

})();