[js] 希望可以图片左上方有一个复制按钮

// 图片复制到png按钮放到外层右上角
(()=>{
    let isOn = false;
    document.addEventListener('mouseover', (e)=>{
        const img = e.target.closest('[data-type="img"]');
        if(!img) return; if(isOn) return;
        isOn = true; setTimeout(()=>isOn=false, 100);
        if(img.querySelector('.cst-copy-png')) return;
        const action = img.querySelector('.protyle-action');
        if(!action) return;
        const actionIcon = img.querySelector('.protyle-action .protyle-icon');
        if(actionIcon) {
            actionIcon.style.borderTopLeftRadius = '0';
            actionIcon.style.borderBottomLeftRadius = '0';
        }
        const copyPngHtml = `<span class="protyle-icon protyle-icon--only protyle-custom cst-copy-png" style="border-top-right-radius:0;border-bottom-right-radius:0"><svg class="svg"><use xlink:href="#iconImage"></use></svg></span>`;
        action.insertAdjacentHTML('afterbegin', copyPngHtml);
        const copyPngBtn = img.querySelector('.cst-copy-png');
        copyPngBtn.addEventListener('click', (e) => {
            e.stopPropagation();
            copyPNGByLink(img.querySelector('img')?.getAttribute("src")||'');
        });
    });
    // see https://github.com/siyuan-note/siyuan/blob/e47b8efc2f2611163beca9fad4ee5424001515ff/app/src/menus/util.ts#L175
    function copyPNGByLink(link) {
        if(!link) return;
        if (isInAndroid()) {
            window.JSAndroid.writeImageClipboard(link);
            return;
        } else {
            const canvas = document.createElement("canvas");
            const tempElement = document.createElement("img");
            tempElement.onload = (e) => {
                canvas.width = e.target.width;
                canvas.height = e.target.height;
                canvas.getContext("2d").drawImage(e.target, 0, 0, e.target.width, e.target.height);
                canvas.toBlob((blob) => {
                    navigator.clipboard.write([
                        new ClipboardItem({
                            // @ts-ignore
                            ["image/png"]: blob
                        })
                    ]);
                }, "image/png", 1);
            };
            tempElement.src = link;
        }
    }
    function isInAndroid() {
        return window.siyuan.config.system.container === "android" && window.JSAndroid;
    }
})();
​

代码备份地址 https://gitee.com/wish163/mysoft/blob/main/%E6%80%9D%E6%BA%90/%E5%9B%BE%E7%89%87%E5%A4%8D%E5%88%B6%E5%88%B0png%E6%8C%89%E9%92%AE%E6%94%BE%E5%88%B0%E5%A4%96%E5%B1%82%E5%8F%B3%E4%B8%8A%E8%A7%92.js