Twitch Beautify

直播页面:自动美化、鼠标悬浮时自动收合按钮、重新播放功能自动触发。 首页: 恢复原始样式、自动暂停与静音、可拖拽与缩放直播窗口。

当前为 2024-04-18 提交的版本,查看 最新版本

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Greasemonkey 油猴子Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Userscripts ,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展后才能安装此脚本。

(我已经安装了用户脚本管理器,让我安装!)

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

(我已经安装了用户样式管理器,让我安装!)

// ==UserScript==
// @name         Twitch Beautify
// @name:zh-TW   Twitch Beautify
// @name:zh-CN   Twitch Beautify
// @name:ko      Twitch Beautify
// @name:ja      Twitch Beautify
// @name:en      Twitch Beautify
// @version      0.0.22
// @author       Canaan HS
// @description         直播頁面: 自動美化、滑鼠懸浮時自動收合按鈕、重新播放功能自動觸發。 首頁: 恢復原始樣式、自動暫停與靜音、可拖曳與縮放直播窗口。
// @description:zh-TW   直播頁面: 自動美化、滑鼠懸浮時自動收合按鈕、重新播放功能自動觸發。 首頁: 恢復原始樣式、自動暫停與靜音、可拖曳與縮放直播窗口。
// @description:zh-CN   直播页面:自动美化、鼠标悬浮时自动收合按钮、重新播放功能自动触发。 首页: 恢复原始样式、自动暂停与静音、可拖拽与缩放直播窗口。
// @description:ko      라이브 페이지: 자동 미화, 마우스 호버 시 자동으로 버튼 접기, 재생 기능 자동 트리거. 홈 페이지: 원래 스타일 복원, 자동 일시정지 및 음소거, 라이브 창 드래그 및 확대/축소 가능.
// @description:ja      ライブページ:自動美化、マウスホバー時に自動的にボタンを折りたたむ、再生機能が自動的にトリガーされる。ホーム:元のスタイルに戻す、自動停止とミュート、ライブウィンドウをドラッグアンドドロップして拡大縮小できる。
// @description:en      Live page: Auto-beautify, auto-collapse buttons on mouse hover, auto-trigger replay function. Home page: Restore original style, auto-pause and mute, draggable and scalable live window.

// @match        *://*.twitch.tv/*
// @icon         https://cdn-icons-png.flaticon.com/512/9290/9290165.png

// @license      MIT
// @namespace    https://greasyfork.org/users/989635

// @run-at       document-body
// @grant        GM_setValue
// @grant        GM_getValue
// @grant        GM_getResourceText
// @grant        window.onurlchange
// @grant        GM_registerMenuCommand

// @require      https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js
// @require      https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.13.2/jquery-ui.min.js
// @require      https://update.greasyfork.org/scripts/487608/1361998/SyntaxSimplified.js
// @resource     jui https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.13.2/themes/base/jquery-ui.min.css
// ==/UserScript==
(function(){const d=function(a){var b={MS_01:"\ud83d\udee0\ufe0f \u5df2\u7981\u7528\u7f8e\u5316\u274c",MS_02:"\ud83d\udee0\ufe0f \u5df2\u542f\u7528\u7f8e\u5316\u2705"},c={MS_01:"\ud83d\udee0\ufe0f \u5df2\u7981\u7528\u7f8e\u5316\u274c",MS_02:"\ud83d\udee0\ufe0f \u5df2\u555f\u7528\u7f8e\u5316\u2705"};b={ja:{MS_01:"\ud83d\udee0\ufe0f \u30d3\u30e5\u30fc\u30c6\u30a3\u30d5\u30a1\u30a4\u304c\u7121\u52b9\u3067\u3059\u274c",MS_02:"\ud83d\udee0\ufe0f \u30d3\u30e5\u30fc\u30c6\u30a3\u30d5\u30a1\u30a4\u304c\u6709\u52b9\u3067\u3059\u2705"},ko:{MS_01:"\ud83d\udee0\ufe0f \ubdf0\ud2f0\ud30c\uc774 \ube44\ud65c\uc131\ud654\ub428\u274c",MS_02:"\ud83d\udee0\ufe0f \ubdf0\ud2f0\ud30c\uc774 \ud65c\uc131\ud654\ub428\u2705"},"en-US":{MS_01:"\ud83d\udee0\ufe0f Beautification disabled\u274c",MS_02:"\ud83d\udee0\ufe0f Beautification enabled\u2705"},"zh-CN":b,"zh-SG":b,"zh-TW":c,"zh-HK":c,"zh-MO":c};return b[a]||b["en-US"]}(navigator.language);(new class extends Syntax{constructor(){super();this.Channel_Parent=this.Channel_Button=this.Chat_Button=this.Resume=this.Frame=this.Nav=null;this.IsLive=a=>/^https:\/\/www\.twitch\.tv\/(?!directory|settings|drops|wallet|subscriptions).+[^\/]$/.test(a);this.RegisterMenu=a=>{this.Menu({[a]:{func:()=>this.Use(),close:!1}})};this.Start=async()=>{this.AddListener(window,"urlchange",a=>{this.IsLive(a.url)&&(this.RemovListener(window,"urlchange"),this.Trigger())})};this.End=async()=>{this.AddListener(window,"urlchange",a=>{this.IsLive(a.url)||(this.Reset(),this.Fun($("div[data-a-player-state='mini']")),this.Start())})};this.Use=async()=>{this.store("g","Beautify",[])?(this.Reset(),this.RegisterMenu(d.MS_01),this.store("s","Beautify",!1)):(this.IsLive(document.URL)?this.Trigger():this.Start(),this.RegisterMenu(d.MS_02),this.store("s","Beautify",!0))};this.Reset=async()=>{this.Nav&&(this.Resume.disconnect(),this.RemovListener(window,"urlchange"),requestAnimationFrame(()=>{this.Nav.classList.remove("Nav_Effect");this.Channel_Button.removeAttribute("style");this.Channel_Button.classList.remove("Button_Effect");this.Channel_Parent.classList.remove("Channel_Expand_Effect")}),this.RemovListener(this.Channel_Button,"mouseenter"),this.RemovListener(this.Channel_Button,"mouseleave"))}}async Main(){this.ImportStyle();this.store("g","Beautify",[])?(this.ClearFooter(),this.RegisterMenu(d.MS_02),this.IsLive(document.URL)?this.Trigger():(this.Start(),this.PlayControl(!1))):this.RegisterMenu(d.MS_01)}async Trigger(){this.WaitMap("nav;.side-nav;.side-nav-section div;[data-a-player-state=''];[data-a-target='side-nav-arrow'];[data-a-target='right-column__toggle-collapse-btn']".split(";"),a=>{const [b,c,g,e,f,h]=a;this.Nav=b;this.Frame=e;this.Chat_Button=h;this.Channel_Button=f;this.Channel_Parent=c.parentNode;this.Beautify();this.AutoClick();this.ResumeWatching();this.PlayControl(!0);this.Fun($(e),!1);!g.getAttribute("data-a-target")&&f.click();this.End()},{raf:!0})}async Beautify(){requestAnimationFrame(()=>{this.Nav.classList.add("Nav_Effect");this.Channel_Parent.classList.add("Channel_Expand_Effect")})}async AutoClick(){this.Chat_Button.classList.add("Button_Effect");this.Channel_Button.classList.add("Button_Effect");this.Channel_Button.style.transform="translateY(15px)";let a;this.AddListener(this.Channel_Button,"mouseenter",()=>{a=setTimeout(()=>{this.Channel_Button.click()},250)});this.AddListener(this.Channel_Button,"mouseleave",()=>{clearTimeout(a);this.Channel_Button.classList.add("Button_Effect")});let b;this.AddListener(this.Chat_Button,"mouseenter",()=>{b=setTimeout(()=>{this.Chat_Button.click()},250)});this.AddListener(this.Chat_Button,"mouseleave",()=>{clearTimeout(b);this.Chat_Button.classList.add("Button_Effect")})}async ResumeWatching(){let a;this.Resume=new MutationObserver(()=>{(a=this.$$(".itFOsv"))&&a.click()});this.Resume.observe(this.Frame,{childList:!0,subtree:!0})}async PlayControl(a){let b;this.WaitElem("video",c=>{a?(b=setInterval(()=>{c.play();c.muted=!1},500),setTimeout(()=>{c.muted||c.paused||clearInterval(b)},5E3)):(b=setInterval(()=>{c.pause();c.muted=!0},500),setTimeout(()=>{c.muted&&c.paused&&clearInterval(b)},5E3))},{raf:!0})}async ClearFooter(){this.WaitElem("#twilight-sticky-footer-root",a=>{a.remove()},{throttle:200})}async Fun(a,b=!0){0<a.length&&(b?(a.draggable({cursor:"grabbing",start:function(){$(this).find(".doeqbO").addClass("Drag_Effect")},stop:function(){$(this).find(".doeqbO").removeClass("Drag_Effect")}}),a.css({top:$("nav").height()-10,left:$(".side-nav").width()-10,width:.68*window.innerWidth,height:.88*window.innerHeight}),a.resizable({minWidth:50,minHeight:50,handles:"all",aspectRatio:1.6})):a.data("ui-draggable")&&(a.draggable("destroy"),a.resizable("destroy")))}async ImportStyle(){this.AddStyle(`${GM_getResourceText("jui")}.Nav_Effect {opacity: 0;height: 1rem !important;transition: opacity 0.5s , height 0.8s;}.Nav_Effect:hover {opacity: 1;height: 5rem !important;}.Channel_Expand_Effect {opacity: 0;width: 1rem;transition: opacity 0.4s , width 0.7s;}.Channel_Expand_Effect:hover {opacity: 1;width: 24rem;}.Button_Effect {transform: translateY(10px);color: rgba(239, 239, 241, 0.3) !important;}.Button_Effect:hover {color: rgb(239, 239, 241) !important;}.Drag_Effect {border-radius: 10px;border: 2px solid white;}`,"Effect")}}).Main()})();