Greasy Fork is available in English.

B站|bilibili 收藏夹名称完全显示+高度调整

B站|bilibili 收藏夹名称完全显示+高度自适应或完全铺开

// ==UserScript==
// @name         B站|bilibili 收藏夹名称完全显示+高度调整
// @license      MIT
// @icon         data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAAXNSR0IArs4c6QAAAyZJREFUaEPtWlFy2jAQ3XXof5pewJkpmekpAidJ+IQeAnKIwifkJDin6EzoTNwDlOYA4O2sVIEsFFuSkQdm8CfI0r6VdvftkxHO/MEQ+7/8eH3cJtvsffgtD3nf9s71bNV7H3Yz3/m8AdzMVmMgmPBCBW5um4K4nv1MkTpzBOgBwmQ97D75gPAHMH19A8BULdIEBBufUOdtbzDl69HdbVQActGrZVMQh8bzjkLf9xh57wB7xwYCiQZ/vt8tXLx3LON5rSAATUBwsCYESx1oiOfV+8EAQkAcGk95gTjwPTY6+AMAYhHAByJKEWgXrNVHYx/Uchx9kF7NcXIsAdamY0TICtg8m1mvBODzdLUU6eyEHzPWdgDOwfidX7V6IQDoxemEnV827T8ItKW0cwHBRRQ/8j6fNeY7pwGmkyZEc714ihpANMCb2a85ED2WDfUv6bGB2uoHIC7QGrwBpCo2ABGr0xXp6xBAdgHQhufVGpcdqPK2T5fGqRugkwJscp+G6Gg7wMYKFpMk90BFT6U3V0qtp24ORJESBdeBlypQwQBEsYNPY91Y624gLtbDr4O6uKiv/JLgEW4G+g41A1Bq/ewmsjf/jrr9OgCuvGs96pbIZjAAmYPLvXDJSMQF02Is6LdLVyYpO9wTQU9SdjvNNvvjZgBExS56gEmGRfGyTZjD+wVh1c4cgBLHsaxQNAJQdyza+P8CoA0vV61x2YGQHeCi55KZXOaOvgMmnVAFS5cfFY0IkVKiAmDjCXEu6gHBk6QZWqOEMOE6IceECcNRAezFATZaFSbKuW6YFMSVM5nHKjoAXlAVJPa2ukNQvwnPW8Qpl/N/6chcvRRzXCtHqE0AImFYZRVHXh/TWHNuqwDHmW2f/kqCRV7gtu/T7sUGY22CGEAV1xe6C9ZL37GNl1K/qZpL8e38xV3lPbvEGNu3YfPrrWu557TqpGGLxHrL7LutV0xIMG73poavpA77YiW5sDM4FgugZ5MEOl3yWZVhOJ6Cbc2EjgKzEwBbpmpyNWo7Xqbq4foFgDMARdSuCkqP/aGHnJvFs86DTgJd4sgLgMuEbY/5B0Ybna/xpe4TAAAAAElFTkSuQmCC
// @namespace    https://sumver.cn
// @version      0.0.3
// @description  B站|bilibili 收藏夹名称完全显示+高度自适应或完全铺开
// @author       lonelylizard
// @match        https://space.bilibili.com/*
// @icon         data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==
// @grant        GM_addStyle
// @grant        GM_setValue
// @grant        GM_getValue
// @grant        GM_registerMenuCommand
// @run-at       document-end
// ==/UserScript==

const fold_fn = GM_registerMenuCommand("收藏夹设置", function () {
    let cur_choose = window.confirm("当前状态:\n" + (GM_getValue("fold_status") === true ? "始终展示全部收藏夹(无滚动条)" : "收藏夹高度自适应(可能有滚动条)") +
        "\n\n按【确认】修改为"+(GM_getValue("fold_status") === true ? "收藏夹高度自适应(可能有滚动条)" : "始终展示全部收藏夹(无滚动条)") +"按【取消】保持设置不变\n设置后请手动刷新一次网页");
    if (cur_choose) {
        if (GM_getValue("fold_status")) {
            GM_setValue("fold_status", false)
        } else {
            GM_setValue("fold_status", true)
        }
    }
});

(function () {
    'use strict';

    // 样式设置
    let setStyle = function (css) {
        let css_list = css.split("}")
        css_list.forEach((item, index, array) => {
            GM_addStyle(item + "}")
        });
    }

    // 收藏夹设置
    let run = function () {

        // 收藏夹设置
        let fold_fn = function () {
            let css = `.text{
                    white-space:normal !important;
                    line-height:25px !important;
                    word-break:break-all;
                }
                .fav-item{
                    line-height:44px !important;
                    border-bottom: 1px solid #F3F3F3;
                }
                .fav-item:last-child{
                    border-bottom: none;
                }
                .icon-cursor{
                    background-position:unset !important;
                    height:100% !important;
                }`

            setStyle(css)
            // 有设置则使用设置,没有则使用默认
            if (GM_getValue("fold_status")) {
                let css = `#page-fav .fav-sidenav .fav-list-container{
                        max-height:100% !important;
                        
                    }`

                setStyle(css)
            } else {
                let fav_height = document.querySelector(".fav-list").scrollHeight;
                let res_height = window.innerHeight;
                let dif_height = res_height - 390
               
                // 滚动超过一屏就自适应
                if (fav_height > dif_height) {
                    let css = `
                        #fav-createdList-container{
                            height:${dif_height}px !important;
                        }
                        .nav-container.fav-container{
                            height:${dif_height + 50}px !important;
                        }
                        #page-fav .fav-sidenav .fav-list-container{
                            max-height:${dif_height}px !important;
                        }
                        .icon-cursor{
                            background-position:unset !important;
                            height:100% !important;
                        }`
    
                    setStyle(css)
                } else {
                    // 注意不需要滚动时,有可能出现临界情况,即从需要滚动的尺寸变成需要无需滚动的尺寸,此时需要重设属性,否则会受到已设置的属性影响导致
                    let css = `
                        #fav-createdList-container{
                            height:100% !important
                        }
                        .nav-container.fav-container{
                            height:unset !important;
                        }
                        #page-fav .fav-sidenav .fav-list-container{
                            max-height:1000px !important;
                        }`

                    setStyle(css)
                }
            }
        };
    
        // 收藏夹是TAB页,异步加载,需要等待元素出现并且填充了内容(出现了高度)才执行
        function waitForElement(selector, timeout = 3000) {
            return new Promise((resolve, reject) => {
                const startTime = Date.now();
                const checkInterval = setInterval(() => {
                    const element = document.querySelector(selector);
                    let status = false;
                    if (element) {
                        if (element.offsetTop != 0) {
                            clearInterval(checkInterval);
                            resolve(element);
                        }
                    } else if (Date.now() - startTime > timeout) {
                        clearInterval(checkInterval);
                        reject(new Error('没找到收藏夹节点'));
                    }
                }, 100);
            });
        }
    
        waitForElement('.fav-list', 5000)
            .then(element => {
                fold_fn()
            })
            .catch(error => {
                //   console.error(error);
            });
    }
    
    // 进入页面先执行一次
    run()

    // 监听页面尺寸变化,自适应高度
    const getWindowInfo = () => {
        // console.log("尺寸变化")
    };
    const debounce = (fn, delay) => {
        let timer;
        return function () {
            if (timer) {
                clearTimeout(timer);
            }
            timer = setTimeout(() => {
                run();
            }, delay);
        }
    };
    const cancalDebounce = debounce(getWindowInfo, 500);
    window.addEventListener('resize', cancalDebounce);

    // 重写pushState,replaceState,监听是否在收藏TAB
    window.addEventListener('pushState', function (e) {
        run()
	});

	window.addEventListener('replaceState', function (e) {
        run()
	});

	const bindEventListener = function (type) {
		const historyEvent = history[type];
		return function () {
			const newEvent = historyEvent.apply(this, arguments);
			const e = new Event(type);
			e.arguments = arguments;
			window.dispatchEvent(e);
			return newEvent;
		};
	};
	history.pushState = bindEventListener('pushState');
	history.replaceState = bindEventListener('replaceState');

	// 监听浏览器前进、后退
	window.onpopstate = function (event) {
        run()
	};

})();