Now Playing Copy Button

For personal use.

Vous devrez installer une extension telle que Tampermonkey, Greasemonkey ou Violentmonkey pour installer ce script.

Vous devrez installer une extension telle que Tampermonkey pour installer ce script.

Vous devrez installer une extension telle que Tampermonkey ou Violentmonkey pour installer ce script.

Vous devrez installer une extension telle que Tampermonkey ou Userscripts pour installer ce script.

Vous devrez installer une extension telle que Tampermonkey pour installer ce script.

Vous devrez installer une extension de gestionnaire de script utilisateur pour installer ce script.

(J'ai déjà un gestionnaire de scripts utilisateur, laissez-moi l'installer !)

Vous devrez installer une extension telle que Stylus pour installer ce style.

Vous devrez installer une extension telle que Stylus pour installer ce style.

Vous devrez installer une extension telle que Stylus pour installer ce style.

Vous devrez installer une extension du gestionnaire de style pour utilisateur pour installer ce style.

Vous devrez installer une extension du gestionnaire de style pour utilisateur pour installer ce style.

Vous devrez installer une extension du gestionnaire de style pour utilisateur pour installer ce style.

(J'ai déjà un gestionnaire de style utilisateur, laissez-moi l'installer!)

// ==UserScript==
// @name         Now Playing Copy Button
// @namespace    http://tampermonkey.net/
// @version      v1.1
// @description  For personal use.
// @author       MeteorVE
// @match        https://open.spotify.com/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=spotify.com
// @grant        GM_setClipboard
// @license      MIT
// ==/UserScript==

(function() {
    'use strict';

    function renderCopyButton() {
        try {
            const nowPlayingWidget = document.querySelector('[data-testid="now-playing-widget"]');
            if (!nowPlayingWidget) {
                // 只在 debug 時開啟,避免刷屏:console.log("[CopyBtn] 找不到 now-playing-widget");
                return;
            }

            const mainDivs = nowPlayingWidget.querySelectorAll(':scope > div');
            if (mainDivs.length < 3) {
                // console.log("[CopyBtn] 找不到第三個主要 div");
                return;
            }

            const thirdDiv = mainDivs[2];
            if (thirdDiv.querySelector('.my-copy-button')) {
                // console.log("[CopyBtn] 按鈕已存在");
                return;
            }

            // 直接插入「兩張紙」SVG icon
            const btn = document.createElement('button');
            btn.className = 'my-copy-button';
            btn.style.background = 'none';
            btn.style.border = 'none';
            btn.style.cursor = 'pointer';
            btn.style.padding = '0 0 0 8px';
            btn.title = "Copy song name";
            btn.innerHTML = `
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" fill="currentColor" viewBox="0 0 20 20">
  <rect x="7" y="7" width="9" height="9" rx="2" fill="#888"/>
  <rect x="4" y="4" width="9" height="9" rx="2" stroke="#888" stroke-width="2" fill="none"/>
</svg>
            `;

            btn.addEventListener('click', function(e) {
                e.stopPropagation();
                try {
                    // 動態取得歌名
                    const songTitle = nowPlayingWidget.querySelector('[data-testid="context-item-info-title"]')?.textContent.trim() || '';
                    console.log('[CopyBtn] 提取歌曲名稱:' + songTitle);

                    if (songTitle) {
                        if (typeof GM_setClipboard === 'function') {
                            GM_setClipboard(songTitle);
                        } else if (navigator.clipboard) {
                            navigator.clipboard.writeText(songTitle);
                        } else {
                            const textarea = document.createElement('textarea');
                            textarea.value = songTitle;
                            document.body.appendChild(textarea);
                            textarea.select();
                            document.execCommand('copy');
                            textarea.remove();
                        }
                        btn.title = "已複製!";
                        setTimeout(() => btn.title = "Copy song name", 1000);
                    } else {
                        btn.title = "找不到歌名";
                        setTimeout(() => btn.title = "Copy song name", 1000);
                        console.warn('[CopyBtn] 歌名為空');
                    }
                } catch (err) {
                    console.error('[CopyBtn] 複製按鈕點擊時發生錯誤:', err);
                }
            });

            thirdDiv.appendChild(btn);
            console.log('[CopyBtn] 複製按鈕已渲染');
        } catch (err) {
            console.error('[CopyBtn] renderCopyButton 發生錯誤:', err);
        }
    }

    window.addEventListener('load', renderCopyButton);

    const observer = new MutationObserver(() => {
        renderCopyButton();
    });
    observer.observe(document.body, { childList: true, subtree: true });
})();