// ==UserScript==
// @name         B站|bilibili 分P视频详情页优化
// @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      1.3.1
// @description  调整bilibili 分P视频合集列表，使得可以根据窗口大小上下铺满，标题显示得更长；适配了宽屏显示；支持小窗大小设置；支持右侧视频列表自定义宽度；支持视频列表标题换行显示；以及一些其他的调整
// @author       lonelylizard
// @match        https://www.bilibili.com/video/*
// @match        https://www.bilibili.com/list/*
// @icon         data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==
// @grant        GM_addStyle
// @grant        GM_registerMenuCommand
// @grant        GM_setValue
// @grant        GM_getValue
// @run-at       document-end
// @downloadURL none
// ==/UserScript==

// 添加控制菜单
// 宽屏适配开关
const menu_widescreen_status = GM_registerMenuCommand("1、宽屏适配开关", function() {
	let cur_choose = window.confirm("当前宽屏适配状态:\n" + (GM_getValue("widescreen_status") === true ? "已开启" : "已关闭") +
		"\n\n按【确认】修改状态，按【取消】保持设置不变\n注：只有在【视频合集宽度调整】未开启或设置为0时，宽屏模式才会生效\n设置后请手动刷新一次网页");
	if(cur_choose) {
		if(GM_getValue("widescreen_status")) {
			GM_setValue("widescreen_status", false)
		} else {
			GM_setValue("widescreen_status", true)
		}
	}
});

// 小窗尺寸设置开关
const miniwin_status = GM_registerMenuCommand("2、小窗尺寸设置（试验）", function() {
	let num = window.prompt("小窗缩放倍率，在1.1~3之间是最合理的，\n推荐倍率1.6~2.0尺寸最佳\n如设置后出现问题，请输入0即可恢复原尺寸的小窗")
	// 调整小窗大小
	if(typeof(Number(num)) === 'number') {
		if(num.toString()
			.split('.')
			.pop()
			.length <= 2) {

			let ori_area = document.querySelector("#bilibili-player-placeholder")
			// 原始小窗：360* 203
			let o_height = 203
			let o_width = 360
			let sc_height = Math.round(o_height * num, 2)
			let sc_width = Math.round(o_width * num, 2)

			if(num != 0) {

				GM_addStyle(
					`@media screen and (min-width: 1681px){
                    .bpx-player-container[data-revision="1"][data-screen=mini], .bpx-player-container[data-revision="2"][data-screen=mini]{
                        height:${sc_height}px !important;
                        width:${sc_width}px !important;
                    }
                    .bpx-player-video-perch, .bpx-player-video-area, .bpx-player-video-wrap{
                        height:inherit !important;
                        width:inherit !important;
                    }
                }`
				);
				GM_addStyle(
					`
                    .bpx-player-container[data-revision="1"][data-screen=mini], .bpx-player-container[data-revision="2"][data-screen=mini]{
                        height:${sc_height}px !important;
                        width:${sc_width}px !important;
                    }
                    .bpx-player-video-perch, .bpx-player-video-area, .bpx-player-video-wrap{
                        height:inherit !important;
                        width:inherit !important;
                    }`
				);

				// 保存设置
				GM_setValue("mini_height", sc_height)
				GM_setValue("mini_width", sc_width)
			} else {
				// 重置尺寸
				GM_setValue("mini_height", 0)
				GM_setValue("mini_width", 0)
				// 恢复小窗
				GM_addStyle(
					`@media screen and (min-width: 1681px){
                    .bpx-player-container[data-revision="1"][data-screen=mini], .bpx-player-container[data-revision="2"][data-screen=mini]{
                        height:${o_height}px !important;
                        width:${o_width}px !important;
                    }
                }`
				);
				GM_addStyle(
					`
                    .bpx-player-container[data-revision="1"][data-screen=mini], .bpx-player-container[data-revision="2"][data-screen=mini]{
                        height:${o_height}px !important;
                        width:${o_width}px !important;
                    }`
				);
			}
		}
	}
});

// 视频列表标题换行开关 
const menu_title_wrap_status = GM_registerMenuCommand("3、视频列表标题换行开关（试验）", function() {
	let cur_choose = window.confirm("使得右侧视频合集支持标题换行显示\n当前状态:\n" + (GM_getValue("title_wrap_status") === true ? "已开启" : "已关闭") +
		"\n\n按【确认】修改状态，按【取消】保持设置不变\n\n设置后请手动刷新一次网页");
	if(cur_choose) {
		if(GM_getValue("title_wrap_status")) {
			GM_setValue("title_wrap_status", false)
		} else {
			GM_setValue("title_wrap_status", true)
		}
	}
});

// 视频合集列表比例调整开关
const menu_area_ratio = GM_registerMenuCommand("4、视频合集列表宽度调整（试验）", function() {
	let area_ratio_prompt = window.prompt("输入0.5表示视频列表占屏幕一半，输入0.25表示占屏幕1/4，\n当前比率:\n" + (GM_getValue("area_ratio") != 0 && typeof(GM_getValue(
			"area_ratio")) != 'undefined' ? GM_getValue("area_ratio") : "未设置") +
		"\n\n按【确认】修改状态，按【取消】保持设置不变\n如设置导致页面混乱，请输入0还原页面\n\n注意：该功能开启时，宽屏模式会自动关闭\n设置后请手动刷新一次网页");
	if(typeof(Number(area_ratio_prompt)) === 'number') {
		if(area_ratio_prompt.toString()
			.split('.')
			.pop()
			.length <= 2) {
			GM_setValue("area_ratio", area_ratio_prompt)
		}
	}
});

// 视频列表标题换行开关 
const no_videos_list_support = GM_registerMenuCommand("5、让非分P视频页支持宽屏、自定义比例开关（试验）", function() {
	let cur_choose = window.confirm("让普通的视频播放页（没有视频合集），也按照宽屏或自定义比例进行显示\n当前状态:\n" + (GM_getValue("no_videos_list_support_status") === true ? "已开启" :
		"已关闭") + "\n\n该功能需要【视频合集列表宽度调整】或【宽屏适配开关】开启状态才生效\n按【确认】修改状态，按【取消】保持设置不变\n设置后请手动刷新一次网页");
	if(cur_choose) {
		if(GM_getValue("no_videos_list_support_status")) {
			GM_setValue("no_videos_list_support_status", false)
		} else {
			GM_setValue("no_videos_list_support_status", true)
		}
	}
});


(function() {
	'use strict';

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

	// 屏蔽广告
	let no_ad_fn = function() {

		let css =
			`#slide_ad {
            display: none
        }
        /* 去除右侧广告 */
        .ad-report {
            display: none !important;
            min-width: 0px !important;
            min-height: 0px !important
        }
        /* 去除简介下广告 */
        #activity_vote {
            display: none !important
        }
        /* 去除右下角直播窗口 */
        .pop-live-small-mode {
            display: none !important
        }
        /* 去除右侧游戏广告卡片 */
        .video-page-game-card-small {
            display: none !important
        }
        /* 去除视频下方的广播广告 */
        .reply-notice {
            display: none !important
        }`
		setStyle(css)
	}

	no_ad_fn()


	var targetNode = "";
	// 选择需要观察变动的节点
	if(document.getElementsByClassName('video-sections-content-list')[0]) {
		// fn1,fn2,fn3情况共同拥有video-sections-content-list，一起监听
		targetNode = document.getElementsByClassName('video-sections-content-list')[0];
	} else if(document.getElementsByClassName('multi-page-v1')[0]) {
		// fn4情况
		targetNode = document.getElementsByClassName('multi-page-v1')[0];
	}

	// 观察器的配置（需要观察什么变动）
	const config = {
		attributes: false, // 开启监听属性
		childList: true, // 开启监听子节点
		subtree: true // 开启监听子节点下面的所有节点
	};

	// 当观察到节点变动时，即视频进行了切换，重新计算
	const callback = function(mutationsList, observer) {
		for(let mutation of mutationsList) {
			if(mutation.type === 'childList') {
				// console.log('子节点有变化');
				if(document.querySelector(".base-video-sections-v1")) {
					fn1();
				}
				if(document.querySelector(".video-sections-v1")) {
					fn2();
				}
				if(document.querySelector("video-section-title")) {
					fn3();
				}
				if(document.querySelector(".multi-page-v1")) {
					fn4()
				}

				chapter_dispose()

				return;
			}
			// else if (mutation.type === 'attributes') {
			//     console.log('The ' + mutation.attributeName + ' 属性有变化');
			// }
		}
	};

	// 创建一个观察器实例并传入回调函数
	const observer = new MutationObserver(callback);

	// 以上述配置开始观察目标节点
	try {
		observer.observe(targetNode, config);
	} catch (err) {
		// console.log("节点不存在");
	}



	// 针对不带封面的视频合集列表
	let fn1 = function() {
		if(document.querySelector(".base-video-sections-v1")) {
			if(document.querySelector(".video-episode-card")) {

				// 带分类视频和仅标题视频合集有相同的外层div，从这里区分开两种类型
				if(document.querySelector(".video-section-title")) {
					change_right_width("fn3")
					change_title_wrap("fn3")
					fn3()
				} else {
					change_right_width("fn1")
					change_title_wrap("fn1")
					let list_height = document.querySelector(".video-section-list")
						.scrollHeight;
					let res_height = window.innerHeight;
					let right_content_top_heigt = document.querySelector(".base-video-sections-v1")
						.offsetTop;
					let dif_height = res_height - right_content_top_heigt - 150;
					// 判断小节是否展开
					let viewpoint_status = false
					if(document.querySelector(".bpx-player-viewpoint")) {
						if(document.querySelector(".bpx-player-viewpoint")
							.getAttribute('fold') == 'true') {
							viewpoint_status = true
						}
					}
					// 没有字幕插件、没有小节，那就正常显示
					if(!document.querySelector(".transcript-box") && viewpoint_status == false) {
						if(list_height > dif_height) {
							// 计算列表高度，如果达不到一屏就不铺满
							let css =
								`.video-sections-content-list {
                                            height: ${dif_height}px !important;
                                            max-height: 1000px !important
                                        }`
							setStyle(css)
						} else {
							// 如果高度小于一屏，同时开始换行功能，会导致高度不正确，这里修改为去除高度属性，让其自适应
							let css =
								`.video-sections-content-list {
                                            height: unset !important;
                                            max-height: 1000px !important
                                        }`
							setStyle(css)

						}
					} else {
						// 兼容脚本：在侧边显示 Bilibili 视频字幕/文稿(原始版)
						// 兼容小节列表
						if(list_height > res_height) {
							let css =
								`.video-sections-content-list {
                                            height: ${res_height - 280}px !important;
                                            max-height: 1000px !important
                                        }`
							setStyle(css)
						} else {
							let css =
								`.video-sections-content-list {
                                            height: unset !important;
                                            max-height: 1000px !important;
                                            border-width:2px !important
                                        }`
							setStyle(css)
						}
					}

					let css =
						`.video-episode-card__info-title {
                                    width: 100% !important
                                }
                                
                                .video-episode-card__info:hover {
                                    background: #DCE2E3
                                }
                                
                                .video-episode-card__info-title:hover {
                                    color: #000 !important
                                }
                                
                                .video-episode-card__info:hover .video-episode-card__info-title {
                                    color: #000 !important
                                }
                                /* 调整合集总标题 */
                                .first-line-left{
                                    width:70% !important;
                                }
                                .base-video-sections-v1 .video-sections-head_first-line .first-line-left .first-line-title{
                                    white-space:normal !important
                                }`
					setStyle(css)
				}


			}
		}
	};

	// 针对带封面的视频合集列表
	let fn2 = function() {
		if(document.querySelector(".video-sections-v1")) {
			if(document.querySelector(".video-episode-card")) {

				change_right_width("fn2");

				change_title_wrap("fn2");

				let list_height = document.querySelector(".video-section-list")
					.scrollHeight;

				let res_height = window.innerHeight;
				var right_content_top_heigt = document.querySelector(".video-sections-v1")
					.offsetTop;
				var dif_height = res_height - right_content_top_heigt - 160;

				// 判断小节是否展开
				let viewpoint_status = false
				if(document.querySelector(".bpx-player-viewpoint")) {
					if(document.querySelector(".bpx-player-viewpoint")
						.getAttribute('fold') == 'true') {
						viewpoint_status = true
					}
				}
				// 没有字幕插件、没有小节，那就正常显示
				if(!document.querySelector(".transcript-box") && viewpoint_status == false) {
					if(list_height > dif_height) {
						let css =
							`.video-sections-content-list {
                                        height: ${dif_height}px !important;
                                        max-height: 1000px !important
                                    }`
						setStyle(css)
					} else {
						let css =
							`.video-sections-content-list {
                                        height: unset !important;
                                        max-height: 1000px !important
                                    }`
						setStyle(css)
					}
				} else {
					// 兼容脚本：在侧边显示 Bilibili 视频字幕/文稿(原始版)
					if(list_height > res_height) {
						let css =
							`.video-sections-content-list {
                                        height: ${res_height - 280}px !important;
                                        max-height: 1000px !important
                                    }`
						setStyle(css)
					} else {
						let css =
							`.video-sections-content-list {
                                        height: unset !important;
                                        max-height: 1000px !important
                                    }`
						setStyle(css)

					}
				}

				let css =
					` /* 添加滑动鼠标一个浅的聚焦颜色 */
                            .video-episode-card:hover {
                                background: #DCE2E3
                            }
                            /* 去除字体蓝色提醒 */
                            .video-episode-card:hover .video-episode-card__info-title {
                                color: #000 !important
                            }
                            .video-episode-card{
                                border-radius: 4px !important;
                                height: auto !important;
                                margin-bottom: 10px !important;
                            }
                            /* 让标题（最大2行）区域跟图片高度对齐，以优化聚焦效果 */
                            .video-episode-card__info{
                                height:60px !important;
                                margin-right: 3px !important
                            }
                            .video-episode-card__info__number{
                                margin-top: -2px !important;
                            }   
                            /* 调整合集总标题 */
                            .first-line-left{
                                width:70% !important;
                            }
                            .video-sections-v1 .video-sections-head_first-line .first-line-left .first-line-title{
                                white-space:normal !important
                            }`
				setStyle(css)
			}
		}
	};

	// 针对带分类的视频合集列表
	let fn3 = function() {
		if(document.querySelector(".base-video-sections-v1")) {
			if(document.querySelector(".video-section-title")) {

				change_right_width("fn3");

				let list_height = window.innerHeight;
				let right_content_top_heigt = document.querySelector(".base-video-sections-v1")
					.offsetTop;
				let dif_height = list_height - right_content_top_heigt - 150;
				// 兼容脚本：在侧边显示 Bilibili 视频字幕/文稿(原始版)
				// 判断小节是否展开
				let viewpoint_status = false
				if(document.querySelector(".bpx-player-viewpoint")) {
					if(document.querySelector(".bpx-player-viewpoint")
						.getAttribute('fold') == 'true') {
						viewpoint_status = true
					}
				}
				// 没有字幕插件、没有小节，那就正常显示
				if(!document.querySelector(".transcript-box") && viewpoint_status == false) {
					// 默认一屏
					let css =
						`.video-sections-content-list {
                                    height: ${dif_height}px !important;
                                    max-height: 1000px !important
                                }`
					setStyle(css)
				} else {
					let css =
						`.video-sections-content-list {
                                    height: ${list_height - 280}px !important;
                                    max-height: 1000px !important
                                }`
					setStyle(css)
				}

				let css =
					`/* 加宽视频列表标题 */
                            .video-episode-card__info-title {
                                width: 100% !important
                            }
                            /* 分类颜色和视频标题一样，略做修改增加辨识度 */
                            .video-section-title {
                                background-color: #E4E6E8 !important
                            }
                            /* 去除分类区域奇怪的圆角 */
                            .video-sections-content-list {
                                border-radius: 0px !important
                            }
                            /* 重设分割线 */
                            .border-bottom-line {
                                background: #F1F2F3 !important
                            }
                            /* 添加滑动鼠标一个浅的聚焦颜色 */
                            .video-episode-card__info:hover {
                                background: #DCE2E3
                            }
                            /* 去除字体蓝色提醒 */
                            .video-episode-card__info-title:hover {
                                color: #000 !important
                            }
                            .video-episode-card:hover .video-episode-card__info-title {
                                color: #000 !important
                            }
                            /* 分类名调整为圆角 */
                            .video-section-title {
                                border-radius:5px !important;
                                margin-left:4px !important
                            }
                            /* 调整合集总标题 */
                            .first-line-left{
                                width:70% !important;
                            }
                            .base-video-sections-v1 .video-sections-head_first-line .first-line-left .first-line-title{
                                white-space:normal !important
                            }`
				setStyle(css)
			}
		}
	};

	// 针对带选集（分P）的视频合集列表
	let fn4 = function() {
		if(document.querySelector(".multi-page-v1")) {
			if(document.querySelector(".cur-list")) {

				change_right_width("fn4");

				change_title_wrap("fn4");

				let res_height = window.innerHeight;
				let list_height = document.querySelector(".list-box")
					.scrollHeight;

				let right_content_top_heigt = document.querySelector(".multi-page-v1")
					.offsetTop;
				let dif_height = res_height - right_content_top_heigt - 120;

				// 判断小节是否展开
				let viewpoint_status = false
				if(document.querySelector(".bpx-player-viewpoint")) {
					if(document.querySelector(".bpx-player-viewpoint")
						.getAttribute('fold') == 'true') {
						viewpoint_status = true
					}
				}
				// 没有字幕插件、没有小节，那就正常显示
				if(!document.querySelector(".transcript-box") && viewpoint_status == false) {
					if(list_height > dif_height) {
						let css =
							`.cur-list {
                                        height: ${dif_height}px !important;
                                        max-height: 1000px !important
                                    }`
						setStyle(css)
					} else {
						let css =
							`.cur-list {
                                        height: ${list_height}px !important;
                                        max-height: 1000px !important
                                    }`
						setStyle(css)
					}
				} else {
					// 兼容脚本：在侧边显示 Bilibili 视频字幕/文稿(原始版)
					if(list_height > res_height) {
						let css =
							`.cur-list {
                                        height: ${res_height - 280}px !important;
                                        max-height: 1000px !important
                                    }`
						setStyle(css)
					} else {
						let css =
							`.cur-list {
                                        height: ${list_height}px !important;
                                        max-height: 1000px !important
                                    }`
						setStyle(css)
					}
				}

				// 添加滑动鼠标一个浅的聚焦颜色
				let css = `.list-box>li:hover {
                                background: #DCE2E3 !important
                            }`
				setStyle(css)
			}
		}
	};

	// 宽屏适配+自定义设置比率
	let change_right_width = function(source) {

		// 如果有自定义比率，则优先使用
		if(GM_getValue("area_ratio") && GM_getValue("area_ratio") != 0) {

			let body_width = document.querySelector("#app")
				.offsetWidth;
			let res_width = window.innerWidth;
			var dif_width = Math.round(res_width * GM_getValue("area_ratio"));

			let player_banner_height = document.querySelector(".bpx-player-sending-bar")
				.offsetHeight;

			// 如果.playlist-container--left存在，那就是全部视频列表
			if(document.querySelector(".playlist-container--left")) {
				let css =
					`/* 调整合集宽度 */
                            .playlist-container--right {
                                width: ${dif_width}px !important
                            }
                            .playlist-container--left {
                                width: ${body_width - dif_width - 50}px !important;
                            }
                            #playerWrap {
                                height:unset !important
                            }
                            #bilibili-player{
                                width: ${body_width - dif_width - 50}px !important;
                                height:${0.5625 * (body_width - dif_width - 50) + player_banner_height}px !important
                            }
                            /* 这里不要使用important，因为后面小窗的尺寸计算调整会需要更高的优先级，这里写了important会导致小窗尺寸可能被覆盖 */
                            .bpx-player-video-perch,.bpx-player-video-area,.bpx-player-video-wrap{
                                width: ${body_width - dif_width - 50}px;
                                height:${0.5625 * (body_width - dif_width - 50)}px
                            }`
				setStyle(css)

			} else {
				// 设置播放器尺寸
				let css =
					`/* 调整合集名称长度 */
                            .first-line-left>a {
                                max-width: ${dif_width}px !important
                            }
                            /* 调整合集宽度 */
                            .right-container {
                                width: ${dif_width}px !important
                            }
                            .left-container {
                                width: ${body_width - dif_width - 50}px !important;
                            }
                            #playerWrap {
                                height:unset !important
                            }
                            #bilibili-player{
                                width: ${body_width - dif_width - 50}px !important;
                                height:${0.5625 * (body_width - dif_width - 50) + player_banner_height}px !important
                            }
                            /* 这里不要使用important，因为后面小窗的尺寸计算调整会需要更高的优先级，这里写了important会导致小窗尺寸可能被覆盖 */
                            .bpx-player-video-perch,.bpx-player-video-area,.bpx-player-video-wrap{
                                width: ${body_width - dif_width - 50}px;
                                height:${0.5625 * (body_width - dif_width - 50)}px
                            }`
				setStyle(css)
			}


			// console.log("检测到自定义比例")
			//不同的合集页需要单独适配
			if(source == "fn1") {
				let css =
					`.video-episode-card__info-title {
                                width: 100% !important
                            }
                            /* 调整标题宽度 */
                            .video-episode-card__info-title {
                                width: 100% !important
                            }`
				setStyle(css)
			}
			if(source == "fn2") {
				let css =
					` /* 调整合集名称长度 */
                            .first-line-left>a {
                                max-width: ${dif_width}px !important
                            }
                            /* 调整合集内视频标题的宽度 */
                            .video-sections-item {
                                width: 95% !important
                            }`
				setStyle(css)
			}
			if(source == "fn3") {
				let css =
					`/* 调整合集名称长度 */
                            .first-line-left>a {
                                max-width: ${dif_width}px !important
                            }
                            /* 调整标题宽度 */
                            .video-episode-card__info-title {
                                width: 100% !important
                            }`
				setStyle(css)
			}
			if(source == "fn4") {
				//分P视频无需调整标题宽度，因为选集名称固定为“视频选集”

				let css =
					`/* 合集内需要单独调整 */
                            #multi_page .cur-list .list-box>li {
                                width: ${dif_width}px
                            }
                            /* 分P视频合集的分P时长偏右，微调 */
                            .cur-list>ul>li>a {
                                margin-right: 15px !important
                            }`
				setStyle(css)
			}
		} else if(GM_getValue("widescreen_status")) {
			// console.log("检测到开启了宽屏")
			let body_width = document.querySelector("#app")
				.offsetWidth;
			let res_width = window.innerWidth;

			if(res_width - 100 > body_width) {
				//带鱼屏
				let left_div = document.querySelector(".left-container")
					.offsetWidth;
				let right_div = document.querySelector(".right-container")
					.offsetWidth;
				var dif_width = (body_width - (left_div + right_div)) + right_div - 100;
			} else {
				//非带鱼屏
				let left_div = document.querySelector(".left-container")
					.offsetWidth;
				let right_div = document.querySelector(".right-container")
					.offsetWidth;
				var dif_width = (res_width - (left_div + right_div)) + right_div - 80;
			}
			//不同的合集页需要单独适配
			if(source == "fn1") {
				let css =
					`/* 调整合集名称长度 */
                            .first-line-left>a {
                                max-width: ${dif_width - 200}px !important
                            }
                            /* 调整合集宽度 */
                            .right-container {
                                width: ${dif_width}px !important
                            }
                            /* 调整标题宽度 */
                            .video-episode-card__info-title {
                                width: 100% !important
                            }`
				setStyle(css)
			}
			if(source == "fn2") {
				let css =
					`/* 调整合集名称长度 */
                            .first-line-left>a {
                                max-width: ${dif_width - 200}px !important
                            }
                            /* 调整合集宽度 */
                            .right-container {
                                width: ${dif_width}px !important
                            }
                            /* 调整合集内视频标题的宽度 */
                            .video-sections-item {
                                width: 95% !important
                            }`
				setStyle(css)
			}
			if(source == "fn3") {
				let css =
					`/* 调整合集名称长度 */
                            .first-line-left>a {
                                max-width: ${dif_width - 200}px !important
                            }
                            /* 调整合集宽度 */
                            .right-container {
                                width: ${dif_width}px !important
                            }`
				setStyle(css)
			}
			if(source == "fn4") {
				//分P视频无需调整标题宽度，因为选集名称固定为“视频选集”
				let css =
					`/* 调整合集宽度 */
                            .right-container {
                                width: ${dif_width}px !important
                            }
                            /* 合集内需要单独调整 */
                            #multi_page .cur-list .list-box>li {
                                width: ${dif_width}px
                            }
                            /* 分P视频合集的分P时长偏右，微调 */
                            .cur-list>ul>li>a {
                                margin-right: 15px !important
                            }`
				setStyle(css)

			}
			// 没有参数即为普通视频页
			if(!source) {
				let css = `.right-container {
                            width: ${dif_width}px !important
                            }`
				setStyle(css)
			}
		}

	}

	// 支持自定义视频合集（如UP空间-播放全部、收藏夹-播放全部）
	let no_videos_list_change_right_width = function() {
		if(document.querySelector(".playlist-container--left")) {
			// 计算列表高度，如果达不到一屏就不铺满
			let list_height = document.querySelector(".action-list-inner")
				.scrollHeight;

			let res_height = window.innerHeight;
			var right_content_top_heigt = document.querySelector(".action-list-container")
				.offsetTop;
			var dif_height = res_height - right_content_top_heigt - 10;

			if(!document.querySelector(".transcript-box")) {
				if(list_height > dif_height) {
					let css =
						`.action-list-container {
                                    height: ${dif_height}px !important;
                                    max-height: 1000px !important
                                }
                                #playlist-video-action-list{
                                    max-height:1000px !important
                                }
                                .playlist-video-action-list-body,.action-list-body-bottomaction-list-body-bottom,playlist-video-action-list{
                                    height:100% !important
                                }`
					setStyle(css)
				} else {
					let css =
						`.action-list-container {
                                    height: unset !important;
                                    max-height: 1000px !important
                                }
                                #playlist-video-action-list-body,#playlist-video-action-list{
                                    max-height: 1000px !important
                                }`
					setStyle(css)
				}
			} else {
				// 兼容脚本：在侧边显示 Bilibili 视频字幕/文稿(原始版)
				if(list_height > res_height) {
					let css =
						`.action-list-container {
                                    height: ${res_height - 280}px !important;
                                    max-height: 1000px !important
                                }`
					setStyle(css)
				} else {
					let css =
						`.action-list-container {
                                    height: unset !important;
                                    max-height: 1000px !important
                                }`
					setStyle(css)

				}
			}

			let css =
				`/* 增加聚焦效果 */
                        .action-list-item:hover {
                            background: #DCE2E3;
                            border-radius: 6px !important;
                        }
                        /* 去除蓝色字体提醒 */
                        .action-list-item:hover .title {
                            color: #000 !important
                        }`
			setStyle(css)
		}
	}

	// 非视频合集的播放页这次自定义比例、宽屏模式
	let support_no_video_list = function() {
		if(GM_getValue("no_videos_list_support_status")) {
			change_right_width()
		}
	}

	// 视频合集换行功能，不限制标题行数
	let change_title_wrap = function(source) {
		if(GM_getValue("title_wrap_status")) {
			if(source == "fn1") {

				let css =
					`.video-episode-card__info{
								border-bottom: 1px solid #D0D9DA;
							}
							.base-video-sections-v1 .video-section-list .video-episode-card__info-title {
                                white-space: normal !important;
                                flex-wrap: wrap !important;
                                max-height: 300px !important
                            }
                            .base-video-sections-v1 .video-section-list{
                                height: 100% !important
                            }
                            .video-episode-card{
                                height:120% !important
                            }
                            .video-section-list {
                                height: 100% !important
                            }
                            /*因为换行会改变整体高度，这里需要重写高度
                            换行后会导致视频列表项不明显，这里加宽了项之间的间距*/
                            .video-episode-card__info {
                                height: 100% !important;
                                min-height:30px !important;

                            }`
				setStyle(css)
			}
			if(source == "fn2") {
				//不处理，因为默认支持2行，足够显示长标题
			}
			if(source == "fn3") {

				let css =
					`.video-episode-card__info{
								border-bottom: 1px solid #D0D9DA;
							}
							.base-video-sections-v1 .video-section-list .video-episode-card__info-title {
								white-space: normal !important;
								flex-wrap: wrap !important;
								max-height: 300px !important
							}
							.video-episode-card__info-title {
                                white-space: normal !important;
                                max-height: unset !important
                            }
                            .base-video-sections-v1 .video-section-list .video-episode-card__info {
                                height: unset !important
                            }
                            
                            .base-video-sections-v1 .video-section-list .video-episode-card {
                                height: unset !important
                            }
                            
                            /* todo:现在这么设置意味着收起分类功能会失效，但是想着全展开也没啥不好的，暂时不做修复 */
                            .video-section-list {
                                height: 100% !important
                            }
                            /* 换行后会导致视频列表项不明显，这里加宽了项之间的间距 */
                            .video-episode-card__info {
                                height: 100% !important;
                                min-height:30px !important;
                            }`
				setStyle(css)
			}
			if(source == "fn4") {

				let css =
					`.list-box > li{
								border-bottom: 1px solid #D0D9DA;
							}
							.base-video-sections-v1 .video-section-list .video-episode-card__info-title {
								white-space: normal !important;
								flex-wrap: wrap !important;
								max-height: 300px !important
							}
							.multi-page-v1 .cur-list .list-box li {
                                white-space: normal !important;
                                height: unset !important;
                            }
                            
                            /* 换行后会导致视频列表项不明显，这里缩小标题文字换行间距 */
                            .part {
                                line-height: normal !important
                            }`
				setStyle(css)
			}

		}
	}

	// 小节处理函数
	let chapter_dispose = function() {
		let res_height = window.innerHeight;
		let css =
			`
            .bpx-player-viewpoint-body{
                max-height:${res_height - 280}px;
                height:min-content !important
            }
            li.bpx-player-viewpoint-menu-item:hover{
                background: #DCE2E3 !important
            }
            li.bpx-player-viewpoint-menu-item:hover .bpx-player-viewpoint-menu-item-content{
                color: #000 !important
            }
            .bpx-player-viewpoint-menu-item-content :has(.bpx-player-viewpoint-menu-item-active{
                color:#00a1d !important
            }
            `
		setStyle(css)
	}

	// 小窗处理函数
	const mini_win_fn = function() {
		// 初始化小窗大小
		if(GM_getValue("mini_height") != 0) {
			let css =
				`@media screen and (min-width: 1681px){
                        .bpx-player-container[data-revision="1"][data-screen=mini], .bpx-player-container[data-revision="2"][data-screen=mini]{
                            height:${GM_getValue("mini_height")}px !important;
                            width:${GM_getValue("mini_width")}px !important;
                            }
                        /* 这里需要使用继承inherit，否则小窗显示内容、主体视频播放器尺寸都会异常 */
                        .bpx-player-video-perch, .bpx-player-video-area, .bpx-player-video-wrap{
                            height:inherit !important;
                            width:inherit !important;
                            }
                        }
                        .bpx-player-container[data-revision="1"][data-screen=mini], .bpx-player-container[data-revision="2"][data-screen=mini]{
                            height:${GM_getValue("mini_height")}px !important;
                            width:${GM_getValue("mini_width")}px !important;
                        }`
			setStyle(css)
		} else if(typeof(GM_getValue("mini_height")) == 'undefined' || GM_getValue("mini_height") == 0) {
			// 小窗默认比例 360*203
			let o_height = 203
			let o_width = 360
			let css =
				`@media screen and (min-width: 1681px){
                        .bpx-player-container[data-revision="1"][data-screen=mini], .bpx-player-container[data-revision="2"][data-screen=mini]{
                            height:${o_height}px !important;
                            width:${o_width}px !important;
                            }
                        /* 这里需要使用继承inherit，否则小窗显示内容、主体视频播放器尺寸都会异常 */
                        .bpx-player-video-perch, .bpx-player-video-area, .bpx-player-video-wrap{
                            height:inherit !important;
                            width:inherit !important;
                            }
                        }
                        /* 恢复到小窗默认尺寸 */
                        .bpx-player-container[data-revision="1"][data-screen=mini], .bpx-player-container[data-revision="2"][data-screen=mini]{
                            height:${o_height}px !important;
                            width:${o_width}px !important;
                        }`
			setStyle(css)
		}
	}

	// 超竖屏支持
	// 竖屏下，阿B原来的最小宽度适配是width=1080px，但是这会在实际1080P分辨率屏幕下内容向右溢出，此处调整为1000px修复该问题
	const support_portrait_fn = function() {
		let css = `#mirror-vdcon{
                        min-width:1000px !important
                    }`
		setStyle(css)
	}

	// 统一调用入口
	let run = function() {
		fn1();
		fn2();
		fn3();
		fn4();
		chapter_dispose();
		mini_win_fn();
		support_no_video_list();
		no_videos_list_change_right_width();
		support_portrait_fn()
	}

	run()

	// 窗口大小变化时重新计算
	const getWindowInfo = () => {
		run()
	};
	const debounce = (fn, delay) => {
		let timer;
		return function() {
			if(timer) {
				clearTimeout(timer);
			}
			timer = setTimeout(() => {
				fn();
			}, delay);
		}
	};
	const cancalDebounce = debounce(getWindowInfo, 500);
	window.addEventListener('resize', cancalDebounce);

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

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

	// B站视频详情页的自动播放下一个视频，或者点击其他视频，使用的是pushState不会刷新页面，这里需要重写pushState、replaceState为来实现监听页面视频是否切换
	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()
	};

})();