HiAnime QoL

Moves episodes/description under player, auto expands, auto 1080p (requires CORS), removes unnecessary stuff, other UI changes.

Versión del día 27/08/2024. Echa un vistazo a la versión más reciente.

Tendrás que instalar una extensión para tu navegador como Tampermonkey, Greasemonkey o Violentmonkey si quieres utilizar este script.

Necesitarás instalar una extensión como Tampermonkey o Violentmonkey para instalar este script.

Necesitarás instalar una extensión como Tampermonkey o Violentmonkey para instalar este script.

Necesitarás instalar una extensión como Tampermonkey o Userscripts para instalar este script.

Necesitará instalar una extensión como Tampermonkey para instalar este script.

Necesitarás instalar una extensión para administrar scripts de usuario si quieres instalar este script.

(Ya tengo un administrador de scripts de usuario, déjame instalarlo)

Necesitará instalar una extensión como Stylus para instalar este estilo.

Necesitará instalar una extensión como Stylus para instalar este estilo.

Necesitará instalar una extensión como Stylus para instalar este estilo.

Necesitará instalar una extensión del gestor de estilos de usuario para instalar este estilo.

Necesitará instalar una extensión del gestor de estilos de usuario para instalar este estilo.

Necesitará instalar una extensión del gestor de estilos de usuario para instalar este estilo.

(Ya tengo un administrador de estilos de usuario, déjame instalarlo)

// ==UserScript==
// @name         HiAnime QoL
// @namespace    https://greasyfork.org/en/users/1262395-grinnch
// @version      1.0
// @description  Moves episodes/description under player, auto expands, auto 1080p (requires CORS), removes unnecessary stuff, other UI changes.
// @author       grinnch
// @license      MIT
// @match        https://hianime.to/*
// @match        https://hianime.tv/*
// @match        https://hianime.nz/*
// @match        https://hianime.mn/*
// @match        https://hianime.sx/*
// @icon         https://cdn-b.saashub.com/images/app/service_logos/274/o0hsec74es20/large.png?1718791473
// ==/UserScript==

(async () => {
    'use strict';

    // Debounce function
    const debounce = (func, delay) => {
        let timeoutId;
        return (...args) => {
            clearTimeout(timeoutId);
            timeoutId = setTimeout(() => {
                func.apply(this, args);
            }, delay);
        };
    };

    function modifyStyle() {
        // Prevents header from moving when scrolling
        let headerElement = document.querySelector('#header');
        if (headerElement) {
            headerElement.style.position = 'static';
        }

        // Removes padding from header
        let wrapperElement = document.querySelector('#wrapper');
        if (wrapperElement) {
            wrapperElement.style.paddingTop = '0';
        }

        // Removes padding from left-side of player to make it centered
        let playerLeftPaddingElement = document.querySelector('#ani_detail > div > div > div.anis-watch-wrap.extend > div.anis-watch.anis-watch-tv');
        if (playerLeftPaddingElement) {
            playerLeftPaddingElement.style.paddingLeft = '0';
        }

        // Removes padding from right-side of player to make it centered when toggling "Light"
        let playerRightPaddingElement = document.querySelector('#ani_detail > div > div > div.anis-watch-wrap.extend.active > div.anis-watch.anis-watch-tv');
        if (playerRightPaddingElement) {
            playerRightPaddingElement.style.paddingRight = '0';
        }

        // Reduces padding on bottom of player to reduce player size
        let frameElement = document.querySelector('#ani_detail > div > div > div.anis-watch-wrap.extend > div.anis-watch.anis-watch-tv > div.watch-player > div.player-frame');
        if (frameElement) {
            frameElement.style.paddingBottom = '51.9%';
        }

        // Places episode panel underneath player
        let episodesElement = document.querySelector('#episodes-content');
        if (episodesElement) {
            episodesElement.style.position = 'relative';
            episodesElement.style.paddingTop = '23%';
            episodesElement.style.width = 'unset';
            //episodesElement.style.marginTop = '1px'; // optional seperator between episode panel and player
        }

        // Reduces padding under episode panel
        let wrapperPaddingElement = document.querySelector('#ani_detail > div > div > div.anis-watch-wrap.extend');
        if (wrapperPaddingElement) {
            wrapperPaddingElement.style.paddingBottom = '0';
        }

        // Moves description under episode panel
        let contentElement = document.querySelector('#ani_detail > div > div > div.anis-watch-wrap.extend > div.anis-watch-detail');
        if (contentElement) {
            contentElement.style.display = 'unset';
            contentElement.style.position = 'static';
        }

        // Reduces size of background image
        let backgroundImgElement = document.querySelector('#ani_detail > div > div > div.anis-cover-wrap > div');
        if (backgroundImgElement) {
            backgroundImgElement.style.height = '62.25%';
        }
    }

    modifyStyle();

    // Watches for changes in the element
    let observer = new MutationObserver(debounce(modifyStyle, 100));

    // Starts observing the target element
    let target = document.querySelector('#ani_detail');
    if (target) {
        observer.observe(target, { attributes: true, childList: true, subtree: true });
    }

    window.onload = function() {
        // Removes share bar
        var shareBarElement = document.querySelector('.share-buttons.share-buttons-detail');
        if (shareBarElement) {
            shareBarElement.remove();
        }

        // Removes description ad
        var descAdElement = document.querySelector('.film-text.m-hide.mb-3');
        if (descAdElement) {
            descAdElement.remove();
        }

        // Removes comments shortcut
        var commentButtonElement = document.querySelector('.dt-comment');
        if (commentButtonElement) {
            commentButtonElement.remove();
        }

        // Auto expands player
        var expandElement = document.querySelector('#media-resize');
        if (expandElement) {
            expandElement.click();
        }

        // Auto expands description
        var expandDescElement = document.querySelector('#ani_detail > div > div > div.anis-watch-wrap.extend > div.anis-watch-detail > div > div.anisc-detail > div.film-description.m-hide > div > span');
        if (expandDescElement) {
            expandDescElement.click();
        }

        // Auto selects highest quality (requires CORS)
        setTimeout(function() {
            let iframe = document.querySelector("#iframe-embed");
            let command = "jwplayer().setCurrentQuality(1)";

            if (iframe) {
                iframe.contentWindow.eval(command);
            }
        }, 3000);
    };
})();