HiAnime QoL

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

Per 14-09-2024. Zie de nieuwste versie.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey, Greasemonkey of Violentmonkey.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey of Violentmonkey.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey of Violentmonkey.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey of Userscripts.

Voor het installeren van scripts heb je een extensie nodig, zoals {tampermonkey_link:Tampermonkey}.

Voor het installeren van scripts heb je een gebruikersscriptbeheerder nodig.

(Ik heb al een user script manager, laat me het downloaden!)

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

(Ik heb al een beheerder - laat me doorgaan met de installatie!)

// ==UserScript==
// @name         HiAnime QoL
// @namespace    https://greasyfork.org/en/users/1262395-grinnch
// @version      1.1
// @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
// ==/UserScript==

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

    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 = 'relative';
        }

        // 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 = '18%';
            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);
    };
})();