Add option for blur settings panel

This commit is contained in:
the1812 2018-09-12 11:38:02 +08:00
parent 8bbf50bf3e
commit 7cbbb5e53a
9 changed files with 54 additions and 17 deletions

View File

@ -22,6 +22,7 @@
# 设置
脚本启用后,在网页左侧中央会有一个齿轮图标,点击即可打开设置.
设置项的说明见功能概览一节.
**设置保存后,需要刷新网页才能生效.**
![设置](images/gui-settings.png)
@ -52,6 +53,7 @@
- 启用双击控制: `关闭`
### 其他
- 显示消息: `关闭`
- 模糊设置面板背景: `关闭`
# 功能概览
为保证最佳体验,设备分辨率建议在1080P及以上,并且已登录哔哩哔哩账户.
@ -166,9 +168,12 @@
##### 启用后
![放大后](images/player-buttons-large.png)
## 其他
关于脚本自身的一些设定.
### 显示消息
允许在网页左下角显示来自本脚本的消息,如更新提醒,错误提示等.
![消息](images/toast.png)
### 模糊设置面板背景
使设置面板的内容区半透明并模糊后方图像.
# 兼容性
## ![Chrome:兼容](https://img.shields.io/badge/Chrome-兼容-brightgreen.svg?style=flat-square&colorB=009688)

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -1,6 +1,6 @@
// ==UserScript==
// @name Bilibili Evolved (Preview)
// @version 1.3.11
// @version 1.3.12
// @description 增强哔哩哔哩Web端体验. (预览版分支)
// @author Grant Howard
// @match *://*.bilibili.com/*
@ -21,6 +21,7 @@
{
const $ = unsafeWindow.$ || self$;
const settings = {
blurSettingsPanel: false,
blurVideoControl: false,
toast: false,
fullTweetsTitle: false,
@ -48,7 +49,7 @@
notifyNewVersion: true,
fixFullscreen: false,
latestVersionLink: "https://github.com/the1812/Bilibili-Evolved/raw/preview/bilibili-evolved.preview.user.js",
currentVersion: "1.3.11"
currentVersion: "1.3.12"
};
function loadSettings()
{
@ -681,7 +682,11 @@
{
if (settings[key] === true && key !== "toast")
{
promises.push(this.fetchByKey(key));
const promise = this.fetchByKey(key);
if (promise)
{
promises.push(promise);
}
}
}
Promise.all(promises).then(() => resolve());

View File

@ -1,6 +1,6 @@
// ==UserScript==
// @name Bilibili Evolved
// @version 1.3.11
// @version 1.3.12
// @description 增强哔哩哔哩Web端体验.
// @author Grant Howard
// @match *://*.bilibili.com/*
@ -21,6 +21,7 @@
{
const $ = unsafeWindow.$ || self$;
const settings = {
blurSettingsPanel: false,
blurVideoControl: false,
toast: false,
fullTweetsTitle: false,
@ -48,7 +49,7 @@
notifyNewVersion: true,
fixFullscreen: false,
latestVersionLink: "https://github.com/the1812/Bilibili-Evolved/raw/master/bilibili-evolved.user.js",
currentVersion: "1.3.11"
currentVersion: "1.3.12"
};
function loadSettings()
{
@ -681,7 +682,11 @@
{
if (settings[key] === true && key !== "toast")
{
promises.push(this.fetchByKey(key));
const promise = this.fetchByKey(key);
if (promise)
{
promises.push(promise);
}
}
}
Promise.all(promises).then(() => resolve());

View File

@ -56,6 +56,9 @@
</checkbox>
<category>其他</category>
<checkbox indent="0" key="toast" dependencies=""></checkbox>
<checkbox indent="0" key="blurSettingsPanel" dependencies="">
模糊设置面板背景
</checkbox>
</ul>
</div>
<div class="gui-settings-footer">

View File

@ -235,7 +235,10 @@
listenDependencies();
syncGui();
addPredefinedColors();
addEffects();
if (settings.blurSettingsPanel)
{
addEffects();
}
}
}
).start();

View File

@ -1 +1 @@
(()=>{return(e,t)=>{const n={red:"#e57373",pink:"#F06292",purple:"#BA68C8",deepPurple:"#9575CD",indigo:"#7986CB",blue:"#2196F3",lightBlue:"#00A0D8",cyan:"#00ACC1",teal:"#26A69A",green:"#81C784",lightGreen:"#9CCC65",orange:"#FF9800",deepOrange:"#FF7043",brown:"#A1887F",grey:"#757575",blueGrey:"#78909C"};const s={settings:"M12,15.5A3.5,3.5 0 0,1 8.5,12A3.5,3.5 0 0,1 12,8.5A3.5,3.5 0 0,1 15.5,12A3.5,3.5 0 0,1 12,15.5M19.43,12.97C19.47,12.65 19.5,12.33 19.5,12C19.5,11.67 19.47,11.34 19.43,11L21.54,9.37C21.73,9.22 21.78,8.95 21.66,8.73L19.66,5.27C19.54,5.05 19.27,4.96 19.05,5.05L16.56,6.05C16.04,5.66 15.5,5.32 14.87,5.07L14.5,2.42C14.46,2.18 14.25,2 14,2H10C9.75,2 9.54,2.18 9.5,2.42L9.13,5.07C8.5,5.32 7.96,5.66 7.44,6.05L4.95,5.05C4.73,4.96 4.46,5.05 4.34,5.27L2.34,8.73C2.21,8.95 2.27,9.22 2.46,9.37L4.57,11C4.53,11.34 4.5,11.67 4.5,12C4.5,12.33 4.53,12.65 4.57,12.97L2.46,14.63C2.27,14.78 2.21,15.05 2.34,15.27L4.34,18.73C4.46,18.95 4.73,19.03 4.95,18.95L7.44,17.94C7.96,18.34 8.5,18.68 9.13,18.93L9.5,21.58C9.54,21.82 9.75,22 10,22H14C14.25,22 14.46,21.82 14.5,21.58L14.87,18.93C15.5,18.67 16.04,18.34 16.56,17.94L19.05,18.95C19.27,19.03 19.54,18.95 19.66,18.73L21.66,15.27C21.78,15.05 21.73,14.78 21.54,14.63L19.43,12.97Z",close:"M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z",ok:"M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"};const o={customStyleColor:t=>{const n=t.match(/^#([0-9a-fA-F]{6}|[0-9a-fA-F]{3})$/);if(n){if(t.length<7){return`#${t[1]}${t[1]}${t[2]}${t[2]}${t[3]}${t[3]}`}else{return t}}else{return e.customStyleColor}},blurBackgroundOpacity:t=>{const n=t.match(/^([-\+]?\d+)(\.\d+)?$/);if(n){const e=parseFloat(t);if(e>=0&&e<=1){return t}}return e.blurBackgroundOpacity}};function i(e,t,n){$(`input[type='checkbox'][key='${e}']`).prop("checked",n).change();$(`input[type='text'][key='${e}']`).val(n)}function c(){for(const t in e){i(t,undefined,e[t])}}function a(){$(".gui-settings-header .gui-settings-close").on("click",()=>{$(".gui-settings-panel").removeClass("opened")});$("input[key='customStyleColor']").on("input",()=>{const e=o.customStyleColor($("input[key='customStyleColor']").val());$("div.custom-color-preview").css("background",e)});$("input[type='text'][key]").each((t,n)=>{$(n).attr("placeholder",e[$(n).attr("key")])});$("div.custom-color-preview").on("click",()=>{if($("input[key='useNewStyle']").prop("checked")){const e=$(".predefined-colors");e.toggleClass("opened")}});const t=document.querySelector("button.save");const n=document.querySelector(".gui-settings-footer svg.gui-settings-ok");const s="save-complete";const a=()=>{n.classList.remove(s);t.classList.remove(s)};t.addEventListener("animationend",a);n.addEventListener("animationend",a);t.addEventListener("click",()=>{$("input[type='checkbox'][key]").each((t,n)=>{e[$(n).attr("key")]=$(n).prop("checked")});$("input[type='text'][key]").each((t,n)=>{const s=$(n).attr("key");const i=$(n).val();e[s]=o[s](i)});saveSettings(e);if([n,t].every(e=>!e.classList.contains(s))){t.classList.add(s);n.classList.add(s)}c()});onSettingsChange(i)}function r(){$(".gui-settings-close path").attr("d",s.close);$(".gui-settings-ok path").attr("d",s.ok);$(".gui-settings svg path").attr("d",s.settings)}function l(){const e={};$(`input[dependencies]`).each((t,n)=>{const s=$(n).attr("dependencies");if(s){e[$(n).attr("key")]=s}});$(`input[type='checkbox'][key]`).on("change",t=>{const n=$(t.target);const s=n.prop("checked");for(const t in e){const o=e[t].split(" ");if(o.indexOf(n.attr("key"))!==-1){let e=true;if(s&&o.every(e=>$(`input[key='${e}']`).prop("checked"))){e=false}$(`input[key='${t}']`).prop("disabled",e);if(e){$(`input[key='${t}'][type='text']`).parent().addClass("disabled")}else{$(`input[key='${t}'][type='text']`).parent().removeClass("disabled")}}}const o=$(".predefined-colors");if(o.hasClass("opened")){o.removeClass("opened")}})}function d(e){if($(".gui-settings").length===0){e.append(`<div class='gui-settings-icon-panel'><div class='gui-settings'>\n <svg style='width:24px;height:24px' viewBox='0 0 24 24'>\n <path/>\n </svg>\n </div></div>`);$(".gui-settings").on("click",()=>{$(".gui-settings-panel").addClass("opened")})}t.applyStyle("guiSettingsStyle","gui-settings-style")}function p(){const e=$(".predefined-colors-grid");for(const t of Object.values(n)){$(`<div class='predefined-colors-grid-block'></div>`).appendTo(e).css("background",t).attr("data-color",t).on("click",e=>{$(`input[key='customStyleColor']`).val($(e.target).attr("data-color")).trigger("input");$("div.custom-color-preview").on("click")})}}function u(){$(".gui-settings-content ul li.category, .gui-settings-content").addClass("blur")}new SpinQuery(()=>$("body"),e=>e.length>0&&unsafeWindow.$,e=>{d(e);const n=t.data.guiSettingsDom.text;if(n){$("body").append(n);a();r();l();c();p();u()}}).start();return{ajaxReload:false}}})();
(()=>{return(e,t)=>{const n={red:"#e57373",pink:"#F06292",purple:"#BA68C8",deepPurple:"#9575CD",indigo:"#7986CB",blue:"#2196F3",lightBlue:"#00A0D8",cyan:"#00ACC1",teal:"#26A69A",green:"#81C784",lightGreen:"#9CCC65",orange:"#FF9800",deepOrange:"#FF7043",brown:"#A1887F",grey:"#757575",blueGrey:"#78909C"};const s={settings:"M12,15.5A3.5,3.5 0 0,1 8.5,12A3.5,3.5 0 0,1 12,8.5A3.5,3.5 0 0,1 15.5,12A3.5,3.5 0 0,1 12,15.5M19.43,12.97C19.47,12.65 19.5,12.33 19.5,12C19.5,11.67 19.47,11.34 19.43,11L21.54,9.37C21.73,9.22 21.78,8.95 21.66,8.73L19.66,5.27C19.54,5.05 19.27,4.96 19.05,5.05L16.56,6.05C16.04,5.66 15.5,5.32 14.87,5.07L14.5,2.42C14.46,2.18 14.25,2 14,2H10C9.75,2 9.54,2.18 9.5,2.42L9.13,5.07C8.5,5.32 7.96,5.66 7.44,6.05L4.95,5.05C4.73,4.96 4.46,5.05 4.34,5.27L2.34,8.73C2.21,8.95 2.27,9.22 2.46,9.37L4.57,11C4.53,11.34 4.5,11.67 4.5,12C4.5,12.33 4.53,12.65 4.57,12.97L2.46,14.63C2.27,14.78 2.21,15.05 2.34,15.27L4.34,18.73C4.46,18.95 4.73,19.03 4.95,18.95L7.44,17.94C7.96,18.34 8.5,18.68 9.13,18.93L9.5,21.58C9.54,21.82 9.75,22 10,22H14C14.25,22 14.46,21.82 14.5,21.58L14.87,18.93C15.5,18.67 16.04,18.34 16.56,17.94L19.05,18.95C19.27,19.03 19.54,18.95 19.66,18.73L21.66,15.27C21.78,15.05 21.73,14.78 21.54,14.63L19.43,12.97Z",close:"M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z",ok:"M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"};const o={customStyleColor:t=>{const n=t.match(/^#([0-9a-fA-F]{6}|[0-9a-fA-F]{3})$/);if(n){if(t.length<7){return`#${t[1]}${t[1]}${t[2]}${t[2]}${t[3]}${t[3]}`}else{return t}}else{return e.customStyleColor}},blurBackgroundOpacity:t=>{const n=t.match(/^([-\+]?\d+)(\.\d+)?$/);if(n){const e=parseFloat(t);if(e>=0&&e<=1){return t}}return e.blurBackgroundOpacity}};function i(e,t,n){$(`input[type='checkbox'][key='${e}']`).prop("checked",n).change();$(`input[type='text'][key='${e}']`).val(n)}function c(){for(const t in e){i(t,undefined,e[t])}}function a(){$(".gui-settings-header .gui-settings-close").on("click",()=>{$(".gui-settings-panel").removeClass("opened")});$("input[key='customStyleColor']").on("input",()=>{const e=o.customStyleColor($("input[key='customStyleColor']").val());$("div.custom-color-preview").css("background",e)});$("input[type='text'][key]").each((t,n)=>{$(n).attr("placeholder",e[$(n).attr("key")])});$("div.custom-color-preview").on("click",()=>{if($("input[key='useNewStyle']").prop("checked")){const e=$(".predefined-colors");e.toggleClass("opened")}});const t=document.querySelector("button.save");const n=document.querySelector(".gui-settings-footer svg.gui-settings-ok");const s="save-complete";const a=()=>{n.classList.remove(s);t.classList.remove(s)};t.addEventListener("animationend",a);n.addEventListener("animationend",a);t.addEventListener("click",()=>{$("input[type='checkbox'][key]").each((t,n)=>{e[$(n).attr("key")]=$(n).prop("checked")});$("input[type='text'][key]").each((t,n)=>{const s=$(n).attr("key");const i=$(n).val();e[s]=o[s](i)});saveSettings(e);if([n,t].every(e=>!e.classList.contains(s))){t.classList.add(s);n.classList.add(s)}c()});onSettingsChange(i)}function r(){$(".gui-settings-close path").attr("d",s.close);$(".gui-settings-ok path").attr("d",s.ok);$(".gui-settings svg path").attr("d",s.settings)}function l(){const e={};$(`input[dependencies]`).each((t,n)=>{const s=$(n).attr("dependencies");if(s){e[$(n).attr("key")]=s}});$(`input[type='checkbox'][key]`).on("change",t=>{const n=$(t.target);const s=n.prop("checked");for(const t in e){const o=e[t].split(" ");if(o.indexOf(n.attr("key"))!==-1){let e=true;if(s&&o.every(e=>$(`input[key='${e}']`).prop("checked"))){e=false}$(`input[key='${t}']`).prop("disabled",e);if(e){$(`input[key='${t}'][type='text']`).parent().addClass("disabled")}else{$(`input[key='${t}'][type='text']`).parent().removeClass("disabled")}}}const o=$(".predefined-colors");if(o.hasClass("opened")){o.removeClass("opened")}})}function d(e){if($(".gui-settings").length===0){e.append(`<div class='gui-settings-icon-panel'><div class='gui-settings'>\n <svg style='width:24px;height:24px' viewBox='0 0 24 24'>\n <path/>\n </svg>\n </div></div>`);$(".gui-settings").on("click",()=>{$(".gui-settings-panel").addClass("opened")})}t.applyStyle("guiSettingsStyle","gui-settings-style")}function u(){const e=$(".predefined-colors-grid");for(const t of Object.values(n)){$(`<div class='predefined-colors-grid-block'></div>`).appendTo(e).css("background",t).attr("data-color",t).on("click",e=>{$(`input[key='customStyleColor']`).val($(e.target).attr("data-color")).trigger("input");$("div.custom-color-preview").on("click")})}}function p(){$(".gui-settings-content ul li.category, .gui-settings-content").addClass("blur")}new SpinQuery(()=>$("body"),e=>e.length>0&&unsafeWindow.$,n=>{d(n);const s=t.data.guiSettingsDom.text;if(s){$("body").append(s);a();r();l();c();u();if(e.blurSettingsPanel){p()}}}).start();return{ajaxReload:false}}})();

View File

@ -1 +1 @@
1.3.11
1.3.12