Fix bugs in gui settings

This commit is contained in:
the1812 2018-09-11 15:35:10 +08:00
parent 07f4d30378
commit 893e17db57
10 changed files with 23 additions and 21 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -485,7 +485,7 @@
`).replace(/<checkbox\s*indent="(.+)"\s*key="(.+)"\s*dependencies="(.*)">([^\0]*?)<\/checkbox>/g, `
<li class="indent-$1">
<label class="gui-settings-checkbox-container">
<input key="$2" type="checkbox" dependencies="$3"/>
<input key="$2" type="checkbox" dependencies="$3" checked/>
<svg class="gui-settings-ok" viewBox="0 0 24 24">
<path />
</svg>

View File

@ -485,7 +485,7 @@
`).replace(/<checkbox\s*indent="(.+)"\s*key="(.+)"\s*dependencies="(.*)">([^\0]*?)<\/checkbox>/g, `
<li class="indent-$1">
<label class="gui-settings-checkbox-container">
<input key="$2" type="checkbox" dependencies="$3"/>
<input key="$2" type="checkbox" dependencies="$3" checked/>
<svg class="gui-settings-ok" viewBox="0 0 24 24">
<path />
</svg>

View File

@ -1 +1 @@
.bilibili-player-video-sendbar{background-color:#222!important;}.mode-fullscreen .bilibili-player-video-btn-widescreen,.mode-webfullscreen .bilibili-player-video-sendbar,.mode-fullscreen .bilibili-player-video-sendbar,.bilibili-player-video-bottom-area::before{background-color:transparent!important;}.tab-mk2.active,.face-g-more,.bangumi-player{background-image:none!important;}.bangumi-player{box-shadow:none!important;}@supports (backdrop-filter: blur(64px)) or (-webkit-backdrop-filter: blur(64px)){.gui-settings-content{background:#222d!important;}}.face-g-more{color:$customStyleColor!important;}.bilibili-player-video-danmaku-setting-left-more:hover .bp-svgicon,.bilibili-player-video-danmaku-setting-right-more:hover .bp-svgicon{fill:$customStyleColor!important;}
.bilibili-player-video-sendbar{background-color:#222!important;}.mode-fullscreen .bilibili-player-video-btn-widescreen,.mode-webfullscreen .bilibili-player-video-sendbar,.mode-fullscreen .bilibili-player-video-sendbar,.bilibili-player-video-bottom-area::before{background-color:transparent!important;}.tab-mk2.active,.face-g-more,.bangumi-player{background-image:none!important;}.bangumi-player{box-shadow:none!important;}@supports (backdrop-filter: blur(64px)) or (-webkit-backdrop-filter: blur(64px)){.gui-settings-content.blur{background:#222d!important;}}.face-g-more{color:$customStyleColor!important;}.bilibili-player-video-danmaku-setting-left-more:hover .bp-svgicon,.bilibili-player-video-danmaku-setting-right-more:hover .bp-svgicon{fill:$customStyleColor!important;}

View File

@ -137,7 +137,7 @@
// }
@supports (backdrop-filter: blur(64px)) or (-webkit-backdrop-filter: blur(64px))
{
.gui-settings-content
.gui-settings-content.blur
{
background: #222d !important;
}

File diff suppressed because one or more lines are too long

View File

@ -108,7 +108,7 @@
}
@supports (backdrop-filter: blur(64px)) or (-webkit-backdrop-filter: blur(64px))
{
.gui-settings-content
.gui-settings-content.blur
{
background: #fff8;
-webkit-backdrop-filter: blur(64px);

View File

@ -62,7 +62,9 @@
function settingsChange(key, _, newValue)
{
$(`input[type='checkbox'][key='${key}']`).prop("checked", newValue);
$(`input[type='checkbox'][key='${key}']`)
.prop("checked", newValue)
.change();
$(`input[type='text'][key='${key}']`).val(newValue);
}
function syncGui()
@ -148,7 +150,7 @@
dependencies[$(element).attr("key")] = dep;
}
});
$(`input[type='checkbox']`).on("change", e =>
$(`input[type='checkbox'][key]`).on("change", e =>
{
const self = $(e.target);
const checked = self.prop("checked");
@ -216,7 +218,7 @@
}
function addEffects()
{
$(".gui-settings-content ul li.category").addClass("blur");
$(".gui-settings-content ul li.category, .gui-settings-content").addClass("blur");
}
new SpinQuery(
() => $("body"),
@ -230,8 +232,8 @@
$("body").append(settingsBox);
setupEvents();
fillSvgData();
syncGui();
listenDependencies();
syncGui();
addPredefinedColors();
addEffects();
}

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);$(`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']`).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").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();c();l();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 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}}})();