Andreas/siyuan
1
0
Fork 0
mirror of https://github.com/siyuan-note/siyuan.git synced 2025-09-22 08:30:42 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

✨ https://github.com/siyuan-note/siyuan/issues/3565 gutter hover

Browse source
This commit is contained in:
Vanessa 2022-10-03 12:35:11 +08:00
parent f16d5bd15f
commit df5dccf90c
1 changed files with 23 additions and 24 deletions
Download patch file Download diff file Expand all files Collapse all files

47
app/src/protyle/gutter/index.ts
View file

@ -65,6 +65,7 @@ export class Gutter {
window.siyuan.dragElement = undefined; window.siyuan.dragElement = undefined;
} }
}); });
// TODO:fold
this.element.addEventListener("click", (event: MouseEvent & { target: HTMLInputElement }) => { this.element.addEventListener("click", (event: MouseEvent & { target: HTMLInputElement }) => {
const buttonElement = hasClosestByTag(event.target, "BUTTON"); const buttonElement = hasClosestByTag(event.target, "BUTTON");
if (!buttonElement) { if (!buttonElement) {
@ -197,38 +198,35 @@ export class Gutter {
}); });
this.element.addEventListener("mouseover", (event: MouseEvent & { target: HTMLInputElement }) => { this.element.addEventListener("mouseover", (event: MouseEvent & { target: HTMLInputElement }) => {
const buttonElement = hasClosestByTag(event.target, "BUTTON"); const buttonElement = hasClosestByTag(event.target, "BUTTON");
if (!buttonElement || buttonElement?.getAttribute("data-type") === "fold") { if (!buttonElement) {
return;
}
if (buttonElement.getAttribute("data-type") === "fold") {
Array.from(protyle.wysiwyg.element.querySelectorAll(".protyle-wysiwyg--hl")).forEach(hlItem => {
hlItem.classList.remove("protyle-wysiwyg--hl");
});
return; return;
} }
let nodeElement: Element;
Array.from(protyle.wysiwyg.element.querySelectorAll(`[data-node-id="${buttonElement.getAttribute("data-node-id")}"]`)).find(item => { Array.from(protyle.wysiwyg.element.querySelectorAll(`[data-node-id="${buttonElement.getAttribute("data-node-id")}"]`)).find(item => {
if (!hasClosestByAttribute(item.parentElement, "data-type", "NodeBlockQueryEmbed")) { if (!hasClosestByAttribute(item.parentElement, "data-type", "NodeBlockQueryEmbed")) {
nodeElement = item; if (item.getBoundingClientRect().top === this.element.getBoundingClientRect().top) {
return true; Array.from(protyle.wysiwyg.element.querySelectorAll(".protyle-wysiwyg--hl")).forEach(hlItem => {
if (!item.isSameNode(hlItem)) {
hlItem.classList.remove("protyle-wysiwyg--hl");
}
});
item.classList.add("protyle-wysiwyg--hl");
return true;
}
} }
}); });
if (!nodeElement) {
return;
}
nodeElement.classList.add("protyle-wysiwyg--hl");
event.preventDefault(); event.preventDefault();
event.stopPropagation();
}); });
this.element.addEventListener("mouseout", (event: MouseEvent & { target: HTMLInputElement }) => { this.element.addEventListener("mouseleave", (event: MouseEvent & { target: HTMLInputElement }) => {
const buttonElement = hasClosestByTag(event.target, "BUTTON"); Array.from(protyle.wysiwyg.element.querySelectorAll(".protyle-wysiwyg--hl")).forEach(item => {
if (!buttonElement || buttonElement?.getAttribute("data-type") === "fold") { item.classList.remove("protyle-wysiwyg--hl");
return;
}
let nodeElement: Element;
Array.from(protyle.wysiwyg.element.querySelectorAll(`[data-node-id="${buttonElement.getAttribute("data-node-id")}"]`)).find(item => {
if (!hasClosestByAttribute(item.parentElement, "data-type", "NodeBlockQueryEmbed")) {
nodeElement = item;
return true;
}
}); });
if (!nodeElement) {
return;
}
nodeElement.classList.remove("protyle-wysiwyg--hl");
event.preventDefault(); event.preventDefault();
event.stopPropagation(); event.stopPropagation();
}); });
@ -645,7 +643,8 @@ export class Gutter {
let nodeElement: Element; let nodeElement: Element;
if (buttonElement.tagName === "BUTTON") { if (buttonElement.tagName === "BUTTON") {
Array.from(protyle.wysiwyg.element.querySelectorAll(`[data-node-id="${id}"]`)).find(item => { Array.from(protyle.wysiwyg.element.querySelectorAll(`[data-node-id="${id}"]`)).find(item => {
if (!hasClosestByAttribute(item.parentElement, "data-type", "NodeBlockQueryEmbed")) { if (!hasClosestByAttribute(item.parentElement, "data-type", "NodeBlockQueryEmbed") &&
buttonElement.parentElement.getBoundingClientRect().top === item.getBoundingClientRect().top) {
nodeElement = item; nodeElement = item;
return true; return true;
} }