回帖 - xml2008

依然请求把日记按钮加到任务顶栏中

2023-01-29 19:37

已经用上了，很棒

思源 2.6.1 至 2.7.0 重要更新一览（带图）

2023-01-27 06:12

学习了~~~

自定义文件树提示框样式

2022-12-22 18:21

改进后的代码，鼠标移到关键字上才会显示


var oldTitle = null; //判断是否有title属性
var cls = null; //用于判断是否需要弹出提示框
var txt = null;
document.addEventListener('mouseover', function(event) {
    let f1 = event.target.parentNode; //一级父节点
    let f2 = event.target.parentNode.parentNode; //二级父节点
	let f1class=f1.getAttribute("class");
    let m = event.target //自身
    txt = ""
        // console.log(m.tagName);
    if (m.tagName == "MARK" && f1class.indexOf("b3-list-item" != -1)) {
        txt = f1.innerHTML
    } else if (m.tagName == "SPAN" && f1class!=null && f1class.indexOf("b3-list-item" != -1)) {
        let title = f1.getAttribute("title");
        if (title !== null) {
            oldTitle = title;
            f1.title = "";
            let txts = title.split("\n");
            txt = txts[0];
            if (txts.length > 1 && txts[1].indexOf("命名") !== -1) {
                txt = txts[1].replace("命名 ", "");
                //如果命名里包含 | 则换行显示 空格会被忽略
                txts = txt.split("|");
                if (txts.length > 1) {
                    txt = ""
                    for (let index = 0; index < txts.length; index++) {
                        txt += "<p style='border-bottom: 1px dashed rgb(6, 196, 209);'>" + txts[index] + "</p>";

                    }
                }
            }
        }
    }
    setTimeout(function() {
        swsshowTooltip(txt, m);
    }, 0);
})
document.addEventListener('mouseout', function(event) {
    if (oldTitle !== null) {
        event.target.parentNode.title = oldTitle;
        oldTitle = null;
    }
    swshideTooltip();
})

function swsshowTooltip(message, target) {
    const targetRect = target.getBoundingClientRect();
    if (targetRect.height === 0 || !message) {
        swshideTooltip();
        return;
    }
    let messageElement = document.getElementById("swstooltip");
    if (!messageElement) {
        document.body.insertAdjacentHTML("beforeend", `<div class="tooltip" id="swstooltip">${message}</div>`);
        messageElement = document.getElementById("swstooltip");
    } else {
        messageElement.innerHTML = message;
    }
    if (target.getAttribute("data-inline-memo-content")) {
        messageElement.classList.add("tooltip--memo"); //  class https://github.com/siyuan-note/siyuan/issues/6161
    }
    let left = targetRect.left;
    const position = target.getAttribute("data-position");
    if (position === "right") {
        left = targetRect.right - messageElement.clientWidth;
    } else if (position === "center") {
        left = targetRect.left + (targetRect.width - messageElement.clientWidth) / 2;
    }
    swssetPosition(messageElement, left, targetRect.top + targetRect.height + 8, targetRect.height * 2 + 8);
};

function swshideTooltip() {
    const messageElement = document.getElementById("swstooltip");
    if (messageElement) {
        messageElement.remove();
    }
};

function swssetPosition(element, x, y, targetHeight = 0, targetLeft = 0) {
    element.style.top = y + "px";
    element.style.left = x + "px";
    const rect = element.getBoundingClientRect();
    // windows 下悬浮菜单在 drag 位置时无法点击
    let dragBarHeight = 0;
    /// #if !BROWSER

    dragBarHeight = document.getElementById("drag").clientHeight;

    /// #endif
    // 上下超出屏幕
    if (rect.bottom > window.innerHeight || rect.top < dragBarHeight) {
        const top = y - rect.height - targetHeight;
        if (top > dragBarHeight && (top + rect.height) < window.innerHeight - dragBarHeight) {
            // 上部
            element.style.top = top + "px";
        } else if (top <= dragBarHeight) {
            // 位置超越到屏幕上方外时，需移动到屏幕顶部。eg：光标在第一个块，然后滚动到上方看不见的位置，按 ctrl+a
            element.style.top = dragBarHeight + "px";
        }
    }
    if (rect.right > window.innerWidth) {
        // 展现在左侧
        element.style.left = `${window.innerWidth - rect.width - targetLeft}px`;
    } else if (rect.left < 0) {
        // 依旧展现在左侧，只是位置右移
        element.style.left = "0";
    }
}