${(index + 1).toString().padStart(2, '0')}
-
+ 
- `).join('');
+ `
+ )
+ .join("");
this.elements.playlistContent.innerHTML = html;
- this.elements.playlistContent.querySelectorAll('.playlist-item').forEach(item => {
- item.addEventListener('click', async () => {
+ this.elements.playlistContent.querySelectorAll(".playlist-item").forEach((item) => {
+ item.addEventListener("click", async () => {
const index = parseInt(item.dataset.index);
if (index !== this.currentIndex) {
this.currentIndex = index;
@@ -996,9 +1176,9 @@ class NeteaseMiniPlayer {
}
});
});
- const activeItem = this.elements.playlistContent.querySelector('.playlist-item.active');
+ const activeItem = this.elements.playlistContent.querySelector(".playlist-item.active");
if (activeItem) {
- activeItem.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
+ activeItem.scrollIntoView({ behavior: "smooth", block: "nearest" });
}
}
seekTo(e) {
@@ -1020,68 +1200,84 @@ class NeteaseMiniPlayer {
}
toggleLyrics() {
this.showLyrics = !this.showLyrics;
- this.elements.lyricsContainer.classList.toggle('hidden', !this.showLyrics);
- this.elements.lyricsBtn.classList.toggle('active', this.showLyrics);
+ this.elements.lyricsContainer.classList.toggle("hidden", !this.showLyrics);
+ this.elements.lyricsBtn.classList.toggle("active", this.showLyrics);
}
togglePlaylist(show = null) {
if (!this.elements.playlistContainer) return;
- const isShowing = this.elements.playlistContainer.classList.contains('show');
+ const isShowing = this.elements.playlistContainer.classList.contains("show");
const shouldShow = show !== null ? show : !isShowing;
if (shouldShow) {
this.determinePlaylistDirection();
this.updatePlaylistDisplay();
- this.elements.playlistContainer.classList.add('show');
+ this.elements.playlistContainer.classList.add("show");
if (this.elements.listBtn) {
- this.elements.listBtn.classList.add('active');
+ this.elements.listBtn.classList.add("active");
}
} else {
- this.elements.playlistContainer.classList.remove('show', 'show-above', 'show-below');
+ this.elements.playlistContainer.classList.remove("show", "show-above", "show-below");
if (this.elements.listBtn) {
- this.elements.listBtn.classList.remove('active');
+ this.elements.listBtn.classList.remove("active");
}
}
}
togglePlayMode() {
- const modes = ['list', 'single', 'shuffle'];
+ const modes = ["list", "single", "shuffle"];
const currentIndex = modes.indexOf(this.playMode);
this.playMode = modes[(currentIndex + 1) % 3];
-
+
const iconSvgs = { list: ICONS.loopList, single: ICONS.loopSingle, shuffle: ICONS.shuffle };
- const titles = { list: '列表循环', single: '单曲循环', shuffle: '随机播放' };
-
+ const titles = { list: "列表循环", single: "单曲循环", shuffle: "随机播放" };
+
if (this.elements.loopModeBtn) {
this.elements.loopModeBtn.innerHTML = iconSvgs[this.playMode];
this.elements.loopModeBtn.title = titles[this.playMode];
}
}
toggleMinimize() {
- const isCurrentlyMinimized = this.element.classList.contains('minimized');
+ const isCurrentlyMinimized = this.element.classList.contains("minimized");
this.isMinimized = isCurrentlyMinimized;
if (!isCurrentlyMinimized) {
- this.element.classList.add('minimized');
+ this.element.classList.add("minimized");
this.isMinimized = true;
if (this.elements.minimizeBtn) {
- this.elements.minimizeBtn.classList.add('active');
- this.elements.minimizeBtn.title = '展开';
- this.elements.minimizeBtn.innerHTML = ICONS.maximize;
+ this.elements.minimizeBtn.classList.add("active");
+ this.elements.minimizeBtn.title = "展开";
+ this.elements.minimizeBtn.innerHTML = ICONS.maximize;
}
this.clearIdleTimer();
this.isIdle = false;
- this.element.classList.remove('idle', 'fading-in', 'fading-out', 'docked-left', 'docked-right', 'popping-left', 'popping-right');
+ this.element.classList.remove(
+ "idle",
+ "fading-in",
+ "fading-out",
+ "docked-left",
+ "docked-right",
+ "popping-left",
+ "popping-right"
+ );
this.startIdleTimer();
} else {
- this.element.classList.remove('minimized');
+ this.element.classList.remove("minimized");
this.isMinimized = false;
if (this.elements.minimizeBtn) {
- this.elements.minimizeBtn.classList.remove('active');
- this.elements.minimizeBtn.title = '缩小';
+ this.elements.minimizeBtn.classList.remove("active");
+ this.elements.minimizeBtn.title = "缩小";
this.elements.minimizeBtn.innerHTML = ICONS.minimize;
}
this.clearIdleTimer();
if (this.isIdle) {
this.restoreOpacity();
} else {
- this.element.classList.remove('idle', 'fading-in', 'fading-out', 'docked-left', 'docked-right', 'popping-left', 'popping-right');
+ this.element.classList.remove(
+ "idle",
+ "fading-in",
+ "fading-out",
+ "docked-left",
+ "docked-right",
+ "popping-left",
+ "popping-right"
+ );
}
this.isIdle = false;
}
@@ -1092,10 +1288,10 @@ class NeteaseMiniPlayer {
const spaceBelow = viewportHeight - playerRect.bottom;
const spaceAbove = playerRect.top;
const playlistHeight = 220;
- this.elements.playlistContainer.classList.remove('expand-up');
+ this.elements.playlistContainer.classList.remove("expand-up");
if (spaceBelow >= playlistHeight || spaceBelow >= spaceAbove) {
} else {
- this.elements.playlistContainer.classList.add('expand-up');
+ this.elements.playlistContainer.classList.add("expand-up");
}
}
setupDragAndDrop() {
@@ -1103,27 +1299,27 @@ class NeteaseMiniPlayer {
}
showError(message) {
this.elements.songTitle.textContent = message;
- this.elements.songArtist.textContent = '';
- this.elements.lyricLine.textContent = '';
+ this.elements.songArtist.textContent = "";
+ this.elements.lyricLine.textContent = "";
}
initTheme() {
this.setTheme(this.config.theme);
- if (this.config.theme === 'auto') {
+ if (this.config.theme === "auto") {
this.setupThemeListener();
}
}
setTheme(theme) {
- if (theme === 'auto') {
+ if (theme === "auto") {
const detectedTheme = this.detectTheme();
- this.element.setAttribute('data-theme', 'auto');
- if (detectedTheme === 'dark') {
- this.element.classList.add('theme-dark-detected');
+ this.element.setAttribute("data-theme", "auto");
+ if (detectedTheme === "dark") {
+ this.element.classList.add("theme-dark-detected");
} else {
- this.element.classList.remove('theme-dark-detected');
+ this.element.classList.remove("theme-dark-detected");
}
} else {
- this.element.setAttribute('data-theme', theme);
- this.element.classList.remove('theme-dark-detected');
+ this.element.setAttribute("data-theme", theme);
+ this.element.classList.remove("theme-dark-detected");
}
}
detectTheme() {
@@ -1140,28 +1336,28 @@ class NeteaseMiniPlayer {
detectHostTheme() {
const html = document.documentElement;
const body = document.body;
- const darkClasses = ['dark', 'theme-dark', 'dark-theme', 'dark-mode'];
- const lightClasses = ['light', 'theme-light', 'light-theme', 'light-mode'];
+ const darkClasses = ["dark", "theme-dark", "dark-theme", "dark-mode"];
+ const lightClasses = ["light", "theme-light", "light-theme", "light-mode"];
for (const className of darkClasses) {
- if (html.classList.contains(className)) return 'dark';
+ if (html.classList.contains(className)) return "dark";
}
for (const className of lightClasses) {
- if (html.classList.contains(className)) return 'light';
+ if (html.classList.contains(className)) return "light";
}
if (body) {
for (const className of darkClasses) {
- if (body.classList.contains(className)) return 'dark';
+ if (body.classList.contains(className)) return "dark";
}
for (const className of lightClasses) {
- if (body.classList.contains(className)) return 'light';
+ if (body.classList.contains(className)) return "light";
}
}
- const htmlTheme = html.getAttribute('data-theme');
- if (htmlTheme === 'dark' || htmlTheme === 'light') {
+ const htmlTheme = html.getAttribute("data-theme");
+ if (htmlTheme === "dark" || htmlTheme === "light") {
return htmlTheme;
}
- const bodyTheme = body?.getAttribute('data-theme');
- if (bodyTheme === 'dark' || bodyTheme === 'light') {
+ const bodyTheme = body?.getAttribute("data-theme");
+ if (bodyTheme === "dark" || bodyTheme === "light") {
return bodyTheme;
}
return null;
@@ -1169,37 +1365,39 @@ class NeteaseMiniPlayer {
detectCSSTheme() {
try {
const rootStyles = getComputedStyle(document.documentElement);
- const bgColor = rootStyles.getPropertyValue('--bg-color') ||
- rootStyles.getPropertyValue('--background-color') ||
- rootStyles.getPropertyValue('--color-bg');
- const textColor = rootStyles.getPropertyValue('--text-color') ||
- rootStyles.getPropertyValue('--color-text') ||
- rootStyles.getPropertyValue('--text-primary');
+ const bgColor =
+ rootStyles.getPropertyValue("--bg-color") ||
+ rootStyles.getPropertyValue("--background-color") ||
+ rootStyles.getPropertyValue("--color-bg");
+ const textColor =
+ rootStyles.getPropertyValue("--text-color") ||
+ rootStyles.getPropertyValue("--color-text") ||
+ rootStyles.getPropertyValue("--text-primary");
if (bgColor || textColor) {
const isDarkBg = this.isColorDark(bgColor);
const isLightText = this.isColorLight(textColor);
if (isDarkBg || isLightText) {
- return 'dark';
+ return "dark";
}
if (!isDarkBg || !isLightText) {
- return 'light';
+ return "light";
}
}
} catch (error) {
- console.warn('CSS主题检测失败:', error);
+ console.warn("CSS主题检测失败:", error);
}
return null;
}
detectSystemTheme() {
- if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
- return 'dark';
+ if (window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches) {
+ return "dark";
}
- return 'light';
+ return "light";
}
isColorDark(color) {
if (!color) return false;
- color = color.replace(/\s/g, '').toLowerCase();
- if (color.includes('dark') || color.includes('black') || color === 'transparent') {
+ color = color.replace(/\s/g, "").toLowerCase();
+ if (color.includes("dark") || color.includes("black") || color === "transparent") {
return true;
}
const rgb = color.match(/rgb\((\d+),(\d+),(\d+)\)/);
@@ -1224,47 +1422,49 @@ class NeteaseMiniPlayer {
}
setupThemeListener() {
if (window.matchMedia) {
- const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');
+ const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
const handleThemeChange = () => {
- if (this.config.theme === 'auto') {
- this.setTheme('auto');
+ if (this.config.theme === "auto") {
+ this.setTheme("auto");
}
};
if (mediaQuery.addEventListener) {
- mediaQuery.addEventListener('change', handleThemeChange);
+ mediaQuery.addEventListener("change", handleThemeChange);
} else {
mediaQuery.addListener(handleThemeChange);
}
}
if (window.MutationObserver) {
const observer = new MutationObserver((mutations) => {
- if (this.config.theme === 'auto') {
+ if (this.config.theme === "auto") {
let shouldUpdate = false;
mutations.forEach((mutation) => {
- if (mutation.type === 'attributes' &&
- (mutation.attributeName === 'class' || mutation.attributeName === 'data-theme')) {
+ if (
+ mutation.type === "attributes" &&
+ (mutation.attributeName === "class" || mutation.attributeName === "data-theme")
+ ) {
shouldUpdate = true;
}
});
if (shouldUpdate) {
- this.setTheme('auto');
+ this.setTheme("auto");
}
}
});
observer.observe(document.documentElement, {
attributes: true,
- attributeFilter: ['class', 'data-theme']
+ attributeFilter: ["class", "data-theme"],
});
if (document.body) {
observer.observe(document.body, {
attributes: true,
- attributeFilter: ['class', 'data-theme']
+ attributeFilter: ["class", "data-theme"],
});
}
}
}
static init() {
- document.querySelectorAll('.netease-mini-player').forEach(element => {
+ document.querySelectorAll(".netease-mini-player").forEach((element) => {
if (!element._neteasePlayer) {
element._neteasePlayer = new NeteaseMiniPlayer(element);
}
@@ -1277,10 +1477,10 @@ class NeteaseMiniPlayer {
return element._neteasePlayer;
}
}
-if (typeof window !== 'undefined') {
+if (typeof window !== "undefined") {
window.NeteaseMiniPlayer = NeteaseMiniPlayer;
- if (document.readyState === 'loading') {
- document.addEventListener('DOMContentLoaded', NeteaseMiniPlayer.init);
+ if (document.readyState === "loading") {
+ document.addEventListener("DOMContentLoaded", NeteaseMiniPlayer.init);
} else {
NeteaseMiniPlayer.init();
}
@@ -1289,18 +1489,18 @@ if (typeof window !== 'undefined') {
class NMPv2ShortcodeParser {
constructor() {
this.paramMappings = {
- 'position': 'data-position',
- 'theme': 'data-theme',
- 'lyric': 'data-lyric',
- 'embed': 'data-embed',
- 'minimized': 'data-default-minimized',
- 'autoplay': 'data-autoplay',
- 'idle-opacity': 'data-idle-opacity',
- 'auto-pause': 'data-auto-pause'
+ position: "data-position",
+ theme: "data-theme",
+ lyric: "data-lyric",
+ embed: "data-embed",
+ minimized: "data-default-minimized",
+ autoplay: "data-autoplay",
+ "idle-opacity": "data-idle-opacity",
+ "auto-pause": "data-auto-pause",
};
- if (document.readyState === 'loading') {
- document.addEventListener('DOMContentLoaded', () => this.init());
+ if (document.readyState === "loading") {
+ document.addEventListener("DOMContentLoaded", () => this.init());
} else {
this.init();
}
@@ -1323,34 +1523,29 @@ class NMPv2ShortcodeParser {
* 处理文本节点中的短语法
*/
processTextNodes(container) {
- const walker = document.createTreeWalker(
- container,
- NodeFilter.SHOW_TEXT,
- null,
- false
- );
+ const walker = document.createTreeWalker(container, NodeFilter.SHOW_TEXT, null, false);
const textNodes = [];
let node;
- while (node = walker.nextNode()) {
- if (node.textContent.includes('{nmpv2:')) {
+ while ((node = walker.nextNode())) {
+ if (node.textContent.includes("{nmpv2:")) {
textNodes.push(node);
}
}
- textNodes.forEach(node => {
+ textNodes.forEach((node) => {
const content = node.textContent;
const shortcodes = this.extractShortcodes(content);
-
+
if (shortcodes.length > 0) {
const fragment = document.createDocumentFragment();
let lastIndex = 0;
- shortcodes.forEach(shortcode => {
+ shortcodes.forEach((shortcode) => {
if (shortcode.startIndex > lastIndex) {
- fragment.appendChild(document.createTextNode(
- content.substring(lastIndex, shortcode.startIndex)
- ));
+ fragment.appendChild(
+ document.createTextNode(content.substring(lastIndex, shortcode.startIndex))
+ );
}
const playerElement = this.createPlayerElement(shortcode);
@@ -1360,9 +1555,7 @@ class NMPv2ShortcodeParser {
});
if (lastIndex < content.length) {
- fragment.appendChild(document.createTextNode(
- content.substring(lastIndex)
- ));
+ fragment.appendChild(document.createTextNode(content.substring(lastIndex)));
}
node.parentNode.replaceChild(fragment, node);
@@ -1371,18 +1564,16 @@ class NMPv2ShortcodeParser {
}
processExistingElements(container) {
- container.querySelectorAll('.netease-mini-player:not([data-shortcode-processed])')
- .forEach(element => {
- element.setAttribute('data-shortcode-processed', 'true');
- });
+ container.querySelectorAll(".netease-mini-player:not([data-shortcode-processed])").forEach((element) => {
+ element.setAttribute("data-shortcode-processed", "true");
+ });
}
initializePlayers(container) {
- container.querySelectorAll('.netease-mini-player:not([data-initialized])')
- .forEach(element => {
- element.setAttribute('data-initialized', 'true');
- NeteaseMiniPlayer.initPlayer(element);
- });
+ container.querySelectorAll(".netease-mini-player:not([data-initialized])").forEach((element) => {
+ element.setAttribute("data-initialized", "true");
+ NeteaseMiniPlayer.initPlayer(element);
+ });
}
extractShortcodes(text) {
@@ -1397,11 +1588,11 @@ class NMPv2ShortcodeParser {
const endIndex = match.index + match[0].length;
let shortcode = {
- type: 'song',
+ type: "song",
id: null,
params: {},
startIndex,
- endIndex
+ endIndex,
};
this.parseShortcodeContent(content, shortcode);
@@ -1412,49 +1603,49 @@ class NMPv2ShortcodeParser {
}
parseShortcodeContent(content, shortcode) {
- if (content.startsWith('playlist=')) {
- shortcode.type = 'playlist';
+ if (content.startsWith("playlist=")) {
+ shortcode.type = "playlist";
const parts = content.split(/,\s*/);
const firstPart = parts.shift();
- shortcode.id = firstPart.replace('playlist=', '').trim();
-
- parts.forEach(part => this.parseParam(part, shortcode.params));
- } else if (content.includes('=')) {
+ shortcode.id = firstPart.replace("playlist=", "").trim();
+
+ parts.forEach((part) => this.parseParam(part, shortcode.params));
+ } else if (content.includes("=")) {
const parts = content.split(/,\s*/);
const firstPart = parts.shift();
-
- if (firstPart.includes('=')) {
+
+ if (firstPart.includes("=")) {
this.parseParam(firstPart, shortcode.params);
- parts.forEach(part => this.parseParam(part, shortcode.params));
+ parts.forEach((part) => this.parseParam(part, shortcode.params));
} else {
shortcode.id = firstPart.trim();
- parts.forEach(part => this.parseParam(part, shortcode.params));
+ parts.forEach((part) => this.parseParam(part, shortcode.params));
}
} else {
shortcode.id = content.trim();
}
- if (shortcode.params.position === undefined || shortcode.params.position === 'static') {
- shortcode.params.embed = shortcode.params.embed ?? 'true';
+ if (shortcode.params.position === undefined || shortcode.params.position === "static") {
+ shortcode.params.embed = shortcode.params.embed ?? "true";
} else if (shortcode.params.embed === undefined) {
- shortcode.params.embed = 'false';
+ shortcode.params.embed = "false";
}
}
parseParam(paramStr, params) {
- const [key, value] = paramStr.split('=');
+ const [key, value] = paramStr.split("=");
if (!key || !value) return;
const cleanKey = key.trim().toLowerCase();
const cleanValue = value.trim().toLowerCase();
- if (cleanKey === 'song-id') {
+ if (cleanKey === "song-id") {
params.songId = cleanValue;
- } else if (cleanKey === 'playlist-id') {
+ } else if (cleanKey === "playlist-id") {
params.playlistId = cleanValue;
- params.type = 'playlist';
- } else if (cleanKey === 'minimized') {
- params.defaultMinimized = cleanValue === 'true' ? 'true' : 'false';
+ params.type = "playlist";
+ } else if (cleanKey === "minimized") {
+ params.defaultMinimized = cleanValue === "true" ? "true" : "false";
} else {
const mapping = this.paramMappings[cleanKey] || `data-${cleanKey}`;
params[cleanKey] = cleanValue;
@@ -1462,22 +1653,22 @@ class NMPv2ShortcodeParser {
}
createPlayerElement(shortcode) {
- const div = document.createElement('div');
- div.className = 'netease-mini-player';
- div.setAttribute('data-shortcode-processed', 'true');
+ const div = document.createElement("div");
+ div.className = "netease-mini-player";
+ div.setAttribute("data-shortcode-processed", "true");
- if (shortcode.type === 'playlist' && shortcode.id) {
- div.setAttribute('data-playlist-id', shortcode.id);
+ if (shortcode.type === "playlist" && shortcode.id) {
+ div.setAttribute("data-playlist-id", shortcode.id);
} else if (shortcode.id) {
- div.setAttribute('data-song-id', shortcode.id);
+ div.setAttribute("data-song-id", shortcode.id);
}
Object.entries(shortcode.params).forEach(([key, value]) => {
- if (key === 'songId') {
- div.setAttribute('data-song-id', value);
- } else if (key === 'playlistId') {
- div.setAttribute('data-playlist-id', value);
- } else if (key === 'type') {
+ if (key === "songId") {
+ div.setAttribute("data-song-id", value);
+ } else if (key === "playlistId") {
+ div.setAttribute("data-playlist-id", value);
+ } else if (key === "type") {
} else {
const dataKey = this.paramMappings[key] || `data-${key}`;
div.setAttribute(dataKey, value);
@@ -1488,98 +1679,107 @@ class NMPv2ShortcodeParser {
}
static processDynamicContent(content) {
- const tempDiv = document.createElement('div');
+ const tempDiv = document.createElement("div");
tempDiv.innerHTML = content;
window.nmpv2ShortcodeParser.processContainer(tempDiv);
return tempDiv.innerHTML;
}
}
-if (typeof window !== 'undefined') {
+if (typeof window !== "undefined") {
window.nmpv2ShortcodeParser = new NMPv2ShortcodeParser();
-
- window.processNMPv2Shortcodes = function(container) {
+
+ window.processNMPv2Shortcodes = function (container) {
if (container instanceof Element) {
window.nmpv2ShortcodeParser.processContainer(container);
} else {
- console.warn('processNMPv2Shortcodes requires a DOM element');
+ console.warn("processNMPv2Shortcodes requires a DOM element");
}
};
}
-if (typeof module !== 'undefined' && module.exports) {
+if (typeof module !== "undefined" && module.exports) {
module.exports = {
- renderShortcodes: function(html) {
+ renderShortcodes: function (html) {
return html.replace(/\{nmpv2:([^}]*)\}/g, (match, content) => {
let shortcode = {
- type: 'song',
+ type: "song",
id: null,
- params: {}
+ params: {},
};
-
- if (content.startsWith('playlist=')) {
- shortcode.type = 'playlist';
+
+ if (content.startsWith("playlist=")) {
+ shortcode.type = "playlist";
const parts = content.split(/,\s*/);
- shortcode.id = parts[0].replace('playlist=', '').trim();
- parts.slice(1).forEach(part => {
- const [key, value] = part.split('=');
+ shortcode.id = parts[0].replace("playlist=", "").trim();
+ parts.slice(1).forEach((part) => {
+ const [key, value] = part.split("=");
if (key && value) shortcode.params[key.trim()] = value.trim();
});
} else {
const parts = content.split(/,\s*/);
- if (parts[0].includes('=')) {
- parts.forEach(part => {
- const [key, value] = part.split('=');
+ if (parts[0].includes("=")) {
+ parts.forEach((part) => {
+ const [key, value] = part.split("=");
if (key && value) shortcode.params[key.trim()] = value.trim();
});
} else {
shortcode.id = parts[0].trim();
- parts.slice(1).forEach(part => {
- const [key, value] = part.split('=');
+ parts.slice(1).forEach((part) => {
+ const [key, value] = part.split("=");
if (key && value) shortcode.params[key.trim()] = value.trim();
});
}
}
- if (!shortcode.params.position || shortcode.params.position === 'static') {
- shortcode.params.embed = shortcode.params.embed ?? 'true';
+ if (!shortcode.params.position || shortcode.params.position === "static") {
+ shortcode.params.embed = shortcode.params.embed ?? "true";
} else if (shortcode.params.embed === undefined) {
- shortcode.params.embed = 'false';
+ shortcode.params.embed = "false";
}
let html = '${(index + 1).toString().padStart(2, "0")}
+ ${song.name}
${song.artists}
{
- if (key === 'songId') {
+ if (key === "songId") {
html += ` data-song-id="${value}"`;
- } else if (key === 'playlistId') {
+ } else if (key === "playlistId") {
html += ` data-playlist-id="${value}"`;
} else {
- const dataKey = {
- 'position': 'data-position',
- 'theme': 'data-theme',
- 'lyric': 'data-lyric',
- 'embed': 'data-embed',
- 'minimized': 'data-default-minimized',
- 'autoplay': 'data-autoplay',
- 'idle-opacity': 'data-idle-opacity',
- 'auto-pause': 'data-auto-pause'
- }[key] || `data-${key}`;
+ const dataKey =
+ {
+ position: "data-position",
+ theme: "data-theme",
+ lyric: "data-lyric",
+ embed: "data-embed",
+ minimized: "data-default-minimized",
+ autoplay: "data-autoplay",
+ "idle-opacity": "data-idle-opacity",
+ "auto-pause": "data-auto-pause",
+ }[key] || `data-${key}`;
html += ` ${dataKey}="${value}"`;
}
});
- html += '>
';
+ html += ">