@mfcc64/ytms 10.2.1 → 11.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/script.mjs +63 -37
package/package.json
CHANGED
package/script.mjs
CHANGED
|
@@ -43,7 +43,8 @@ import {ShowCQTElement} from "../../showcqt-element@2/showcqt-element.mjs";
|
|
|
43
43
|
interval: { def: 1, min: 1, max: 4 },
|
|
44
44
|
codecs: { def: 1, min: 0, max: 2 },
|
|
45
45
|
transparent:{ def: 1, min: 0, max: 1 },
|
|
46
|
-
visible: { def:
|
|
46
|
+
visible: { def: document.location.hostname == "music.youtube.com" ? 1 : 0,
|
|
47
|
+
min: 0, max: 1 },
|
|
47
48
|
axis: { def: 0, min: 0, max: axis_list.length - 1 }
|
|
48
49
|
};
|
|
49
50
|
|
|
@@ -90,41 +91,63 @@ import {ShowCQTElement} from "../../showcqt-element@2/showcqt-element.mjs";
|
|
|
90
91
|
af_links.style.right = "8px";
|
|
91
92
|
af_links.style.bottom = "8px";
|
|
92
93
|
af_links.style.opacity = 1;
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
(
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
94
|
+
{
|
|
95
|
+
const e = (name, ...args) => {
|
|
96
|
+
const v = document.createElement(name);
|
|
97
|
+
for (const arg of args)
|
|
98
|
+
if (typeof arg == "object" && !(arg instanceof Node))
|
|
99
|
+
v.setAttribute(...Object.entries(arg)[0])
|
|
100
|
+
else
|
|
101
|
+
v.append(arg);
|
|
102
|
+
return v;
|
|
103
|
+
};
|
|
104
|
+
af_links.attachShadow({mode: "open"}).append(
|
|
105
|
+
e("style",
|
|
106
|
+
`:host { opacity: 0; max-width: 700px; }
|
|
107
|
+
:host(:hover) { opacity: 1; }
|
|
108
|
+
img { vertical-align: middle; }`),
|
|
109
|
+
e("div", {id: "message"},
|
|
110
|
+
e("h3", "YouTube Musical Spectrum"),
|
|
111
|
+
e("ul",
|
|
112
|
+
e("li", "By default, the visualization is visible on YT Music page but hidden on YouTube page."),
|
|
113
|
+
e("li", "Click the ", e("img", {alt: "YTMS"}, {src: icon_16}), " icon at the top left corner to open/close settings."),
|
|
114
|
+
e("li", "Press ", e("b", "Ctrl+Alt+H"), " to open/close settings and show/hide the ", e("img", {alt: "YTMS"}, {src: icon_16}), " icon."),
|
|
115
|
+
e("li", "Press ", e("b", "Ctrl+Alt+G"), " as a shortcut to show/hide visualization. This is equivalent to check/uncheck ", e("b", "Visible"), " setting."),
|
|
116
|
+
e("li", "If you want to change the axis, click it."),
|
|
117
|
+
e("li", "If you want to make your change persistent, click ", e("b", "Set as Default Settings"), " button."),
|
|
118
|
+
e("li", e("b", "New Features:"), " Hz-scale axis, microphone support, YT Music support, scale options to " +
|
|
119
|
+
"reduce CPU usage, custom color."),
|
|
120
|
+
e("li", e("a", {href: "https://github.com/mfcc64/youtube-musical-spectrum#settings"}, {target: "_blank"}, "Read more..."))
|
|
121
|
+
),
|
|
122
|
+
e("p",
|
|
123
|
+
e("button", {id: "close_message"}, {style: "cursor: pointer;"}, "Close"),
|
|
124
|
+
" (Click the ", e("img", {alt: "YTMS"}, {src: icon_16}), " icon below to reopen again)"
|
|
125
|
+
)
|
|
126
|
+
),
|
|
127
|
+
e("div", {style: "text-align: right;"},
|
|
128
|
+
e("img", {alt: "YTMS"}, {src: icon_16}, {style: "curson: pointer;"}, {id: "open_message"}),
|
|
129
|
+
" Support me on ",
|
|
130
|
+
e("a", {href: "https://www.youtube.com/@mfcc64"}, {target: "_blank"}, "Youtube"), " ",
|
|
131
|
+
e("a", {href: "https://www.patreon.com/mfcc64"}, {target: "_blank"}, "Patreon"), " ",
|
|
132
|
+
e("a", {href: "https://github.com/mfcc64"}, {target: "_blank"}, "GitHub"), " ",
|
|
133
|
+
e("a", {href: "https://paypal.me/mfcc64"}, {target: "_blank"}, "PayPal"), " ",
|
|
134
|
+
e("a", {href: "https://saweria.co/mfcc64"}, {target: "_blank"}, "Saweria")
|
|
135
|
+
)
|
|
136
|
+
);
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
let af_links_timeout = false;
|
|
140
|
+
setTimeout(() => {
|
|
141
|
+
af_links.style.opacity = "";
|
|
142
|
+
af_links_timeout = true,
|
|
143
|
+
update_af_links();
|
|
144
|
+
}, 15000);
|
|
145
|
+
|
|
146
|
+
function update_af_links() {
|
|
147
|
+
af_links.style.display = !af_links_timeout || (child_menu.visible?.checked ?? true) ? "block" : "none";
|
|
148
|
+
}
|
|
149
|
+
|
|
150
|
+
const message_version = 8;
|
|
128
151
|
af_links.shadowRoot.getElementById("message").style.display = get_opt("message_version") == message_version ? "none" : "block";
|
|
129
152
|
af_links.shadowRoot.getElementById("close_message").addEventListener("click", function() {
|
|
130
153
|
set_opt("message_version", message_version);
|
|
@@ -460,7 +483,10 @@ import {ShowCQTElement} from "../../showcqt-element@2/showcqt-element.mjs";
|
|
|
460
483
|
}
|
|
461
484
|
|
|
462
485
|
create_child_checkbox_menu("Transparent", "transparent", (child) => cqt.dataset.opacity = child.checked ? "transparent" : "opaque");
|
|
463
|
-
create_child_checkbox_menu("Visible", "visible", (child) =>
|
|
486
|
+
create_child_checkbox_menu("Visible", "visible", (child) => {
|
|
487
|
+
cqt.style.display = child.checked ? "block" : "none";
|
|
488
|
+
update_af_links();
|
|
489
|
+
});
|
|
464
490
|
|
|
465
491
|
current_tr = null;
|
|
466
492
|
set_common_tr_style(get_menu_table_tr());
|