Andreas/siyuan
1
0
Fork 0
mirror of https://github.com/siyuan-note/siyuan.git synced 2025-12-21 17:10:12 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

♻️ https://github.com/siyuan-note/siyuan/issues/9304

Browse source
This commit is contained in:
Vanessa 2023-10-04 21:02:49 +08:00
parent 29712f6f77
commit 61ee5676c4
10 changed files with 76 additions and 44 deletions
Download patch file Download diff file Expand all files Collapse all files

5
app/src/assets/scss/component/_menu.scss
View file

@ -317,11 +317,12 @@
.emojis {
word-break: break-all;
white-space: normal;
height: 50vh;
padding: 0;
display: flex;
flex-direction: column;
max-height: 386px;
padding: 8px 0;
height: 100%;
box-sizing: border-box;
&__item {
font-size: 24px;

2
app/src/assets/scss/protyle/_toolbar.scss
View file

@ -55,7 +55,7 @@
z-index: 5;
overflow: auto;
max-height: 402px;
box-sizing: border-box;
// 不能使用，否则 hint emoji 出现双滚动条 box-sizing: border-box;
padding: 8px 0;
display: flex;
flex-direction: column;

10
app/src/boot/globalEvent/keydown.ts
View file

@ -1210,9 +1210,15 @@ export const windowKeyDown = (app: App, event: KeyboardEvent) => {
return;
}
if (!window.siyuan.menus.menu.element.classList.contains("fn__none")) {
window.siyuan.menus.menu.remove();
return;
if (window.siyuan.dialogs.length > 0 &&
window.siyuan.menus.menu.element.style.zIndex < (window.siyuan.dialogs[0].element.querySelector(".b3-dialog") as HTMLElement).style.zIndex) {
// 窗口高于菜单时，先关闭窗口，如 av 修改列 icon 时
} else {
window.siyuan.menus.menu.remove();
return;
}
}
if (window.siyuan.dialogs.length > 0) {
hideElements(["dialog"]);
return;

7
app/src/dialog/index.ts
View file

@ -69,9 +69,12 @@ export class Dialog {
}
public destroy(options?: IObject) {
// av 修改列头emoji后点击关闭emoji图标
if ((this.element.querySelector(".b3-dialog") as HTMLElement).style.zIndex < window.siyuan.menus.menu.element.style.zIndex) {
// https://github.com/siyuan-note/siyuan/issues/6783
window.siyuan.menus.menu.remove();
}
this.element.remove();
// https://github.com/siyuan-note/siyuan/issues/6783
window.siyuan.menus.menu.remove();
if (this.destroyCallback) {
this.destroyCallback(options);
}

67
app/src/emoji/index.ts
View file

@ -8,6 +8,7 @@ import {getDockByType} from "../layout/util";
import {getAllModels} from "../layout/getAll";
/// #endif
import {setNoteBook} from "../util/pathName";
import {Dialog} from "../dialog";
export const getRandomEmoji = () => {
const emojis = window.siyuan.emojis[getRandom(0, window.siyuan.emojis.length - 1)];
@ -189,9 +190,12 @@ export const addEmoji = (unicode: string) => {
fetchPost("/api/setting/setEmoji", {emoji: window.siyuan.config.editor.emoji});
};
export const openEmojiPanel = (id: string, target: HTMLElement, isNotebook = false) => {
window.siyuan.menus.menu.remove();
window.siyuan.menus.menu.element.lastElementChild.innerHTML = `<div class="emojis" style="width: ${isMobile() ? "80vw" : "360px"}">
export const openEmojiPanel = (id: string, type: "doc" | "notebook" | "av", position: IPosition) => {
const dialog = new Dialog({
transparent: true,
width: isMobile() ? "80vw" : "360px",
height: "50vh",
content: `<div class="emojis" data-menu="true">
<div class="fn__flex">
<span class="fn__space"></span>
<label class="b3-form__icon fn__flex-1">
@ -217,12 +221,11 @@ export const openEmojiPanel = (id: string, target: HTMLElement, isNotebook = fal
<div data-type="8" class="emojis__type ariaLabel" aria-label="${window.siyuan.emojis[7][window.siyuan.config.lang === "zh_CN" ? "title_zh_cn" : "title"]}">${unicode2Emoji("267e")}</div>
<div data-type="9" class="emojis__type ariaLabel" aria-label="${window.siyuan.emojis[8][window.siyuan.config.lang === "zh_CN" ? "title_zh_cn" : "title"]}">${unicode2Emoji("1f6a9")}</div>
</div>
</div>`;
window.siyuan.menus.menu.element.querySelector(".emojis__item").classList.add("emojis__item--current");
const rect = target.getBoundingClientRect();
window.siyuan.menus.menu.popup({x: rect.left, y: rect.top + rect.height});
const inputElement = window.siyuan.menus.menu.element.querySelector(".b3-text-field") as HTMLInputElement;
const emojisContentElement = window.siyuan.menus.menu.element.querySelector(".emojis__panel");
</div>`
});
dialog.element.querySelector(".emojis__item").classList.add("emojis__item--current");
const inputElement = dialog.element.querySelector(".b3-text-field") as HTMLInputElement;
const emojisContentElement = dialog.element.querySelector(".emojis__panel");
inputElement.addEventListener("compositionend", () => {
emojisContentElement.innerHTML = filterEmoji(inputElement.value);
if (inputElement.value) {
@ -231,11 +234,11 @@ export const openEmojiPanel = (id: string, target: HTMLElement, isNotebook = fal
emojisContentElement.nextElementSibling.classList.remove("fn__none");
}
emojisContentElement.scrollTop = 0;
window.siyuan.menus.menu.element.querySelector(".emojis__item")?.classList.add("emojis__item--current");
dialog.element.querySelector(".emojis__item")?.classList.add("emojis__item--current");
if (inputElement.value === "") {
lazyLoadEmoji(window.siyuan.menus.menu.element);
lazyLoadEmoji(dialog.element);
}
lazyLoadEmojiImg(window.siyuan.menus.menu.element);
lazyLoadEmojiImg(dialog.element);
});
inputElement.addEventListener("input", (event: InputEvent) => {
if (event.isComposing) {
@ -248,11 +251,11 @@ export const openEmojiPanel = (id: string, target: HTMLElement, isNotebook = fal
emojisContentElement.nextElementSibling.classList.remove("fn__none");
}
emojisContentElement.scrollTop = 0;
window.siyuan.menus.menu.element.querySelector(".emojis__item")?.classList.add("emojis__item--current");
dialog.element.querySelector(".emojis__item")?.classList.add("emojis__item--current");
if (inputElement.value === "") {
lazyLoadEmoji(window.siyuan.menus.menu.element);
lazyLoadEmoji(dialog.element);
}
lazyLoadEmojiImg(window.siyuan.menus.menu.element);
lazyLoadEmojiImg(dialog.element);
});
inputElement.addEventListener("keydown", (event: KeyboardEvent) => {
if (event.isComposing) {
@ -261,31 +264,33 @@ export const openEmojiPanel = (id: string, target: HTMLElement, isNotebook = fal
if (event.key.indexOf("Arrow") === -1 && event.key !== "Enter") {
return;
}
const currentElement = window.siyuan.menus.menu.element.querySelector(".emojis__item--current");
const currentElement = dialog.element.querySelector(".emojis__item--current");
if (!currentElement) {
return;
}
if (event.key === "Enter") {
const unicode = currentElement.getAttribute("data-unicode");
if (isNotebook) {
if (type === "notebook") {
fetchPost("/api/notebook/setNotebookIcon", {
notebook: id,
icon: unicode
}, () => {
window.siyuan.menus.menu.remove();
dialog.destroy();
addEmoji(unicode);
updateFileTreeEmoji(unicode, id, "iconFilesRoot");
});
} else {
} else if (type === "doc") {
fetchPost("/api/attr/setBlockAttrs", {
id,
attrs: {"icon": unicode}
}, () => {
window.siyuan.menus.menu.remove();
dialog.destroy();
addEmoji(unicode);
updateFileTreeEmoji(unicode, id);
updateOutlineEmoji(unicode, id);
});
} else {
}
event.preventDefault();
event.stopPropagation();
@ -330,10 +335,10 @@ export const openEmojiPanel = (id: string, target: HTMLElement, isNotebook = fal
if (!isMobile()) {
inputElement.focus();
}
lazyLoadEmoji(window.siyuan.menus.menu.element);
lazyLoadEmojiImg(window.siyuan.menus.menu.element);
lazyLoadEmoji(dialog.element);
lazyLoadEmojiImg(dialog.element);
// 不能使用 getEventName 否则 https://github.com/siyuan-note/siyuan/issues/5472
window.siyuan.menus.menu.element.lastElementChild.firstElementChild.addEventListener("click", (event) => {
dialog.element.addEventListener("click", (event) => {
const eventTarget = event.target as HTMLElement;
const typeElement = hasClosestByClassName(eventTarget, "emojis__type");
if (typeElement) {
@ -359,23 +364,25 @@ ${unicode2Emoji(emoji.unicode)}</button>`;
}
const iconElement = hasClosestByClassName(eventTarget, "block__icon");
if (iconElement && iconElement.getAttribute("aria-label") === window.siyuan.languages.remove) {
if (isNotebook) {
if (type === "notebook") {
fetchPost("/api/notebook/setNotebookIcon", {
notebook: id,
icon: ""
}, () => {
window.siyuan.menus.menu.remove();
dialog.destroy();
updateFileTreeEmoji("", id, "iconFilesRoot");
});
} else {
} else if (type === "doc") {
fetchPost("/api/attr/setBlockAttrs", {
id: id,
attrs: {"icon": ""}
}, () => {
window.siyuan.menus.menu.remove();
dialog.destroy();
updateFileTreeEmoji("", id);
updateOutlineEmoji("", id);
});
} else {
}
return;
}
@ -388,7 +395,7 @@ ${unicode2Emoji(emoji.unicode)}</button>`;
} else {
unicode = getRandomEmoji();
}
if (isNotebook) {
if (type === "notebook") {
fetchPost("/api/notebook/setNotebookIcon", {
notebook: id,
icon: unicode
@ -396,7 +403,7 @@ ${unicode2Emoji(emoji.unicode)}</button>`;
addEmoji(unicode);
updateFileTreeEmoji(unicode, id, "iconFilesRoot");
});
} else {
} else if (type === "doc") {
fetchPost("/api/attr/setBlockAttrs", {
id,
attrs: {"icon": unicode}
@ -405,6 +412,8 @@ ${unicode2Emoji(emoji.unicode)}</button>`;
updateFileTreeEmoji(unicode, id);
updateOutlineEmoji(unicode, id);
});
} else {
}
return;
}

19
app/src/layout/dock/Files.ts
View file

@ -122,7 +122,11 @@ export class Files extends Model {
if (target.classList.contains("b3-list-item__icon")) {
event.preventDefault();
event.stopPropagation();
openEmojiPanel(target.parentElement.getAttribute("data-url"), target, true);
const rect = target.getBoundingClientRect();
openEmojiPanel(target.parentElement.getAttribute("data-url"), "notebook", {
x: rect.left,
y: rect.bottom
});
break;
} else if (type === "toggle") {
if (this.closeElement.classList.contains("fn__flex-1")) {
@ -239,10 +243,17 @@ export class Files extends Model {
if (!event.metaKey && !event.ctrlKey && target.classList.contains("b3-list-item__icon") && window.siyuan.config.system.container !== "ios") {
event.preventDefault();
event.stopPropagation();
const rect = target.getBoundingClientRect();
if (target.parentElement.getAttribute("data-type") === "navigation-file") {
openEmojiPanel(target.parentElement.getAttribute("data-node-id"), target);
openEmojiPanel(target.parentElement.getAttribute("data-node-id"), "doc", {
x: rect.left,
y: rect.bottom
});
} else {
openEmojiPanel(target.parentElement.parentElement.getAttribute("data-url"), target, true);
openEmojiPanel(target.parentElement.parentElement.getAttribute("data-url"), "notebook", {
x: rect.left,
y: rect.bottom
});
}
break;
} else if (!event.metaKey && !event.ctrlKey && target.classList.contains("b3-list-item__toggle")) {
@ -260,7 +271,7 @@ export class Files extends Model {
newFile({
app: options.app,
notebookId,
currentPath:pathString,
currentPath: pathString,
useSavePath: false
});
} else if (type === "more-root") {

3
app/src/protyle/header/Background.ts
View file

@ -177,7 +177,8 @@ export class Background {
event.stopPropagation();
break;
} else if (type === "open-emoji") {
openEmojiPanel(protyle.block.rootID, this.iconElement);
const rect = this.iconElement.getBoundingClientRect();
openEmojiPanel(protyle.block.rootID, "doc", {x: rect.left, y: rect.bottom});
event.preventDefault();
event.stopPropagation();
break;

2
app/src/protyle/hint/index.ts
View file

@ -368,7 +368,7 @@ ${genHintItemHTML(item)}
}
lazyLoadEmojiImg(panelElement);
} else {
this.element.innerHTML = `<div class="emojis">
this.element.innerHTML = `<div style="padding: 0" class="emojis">
<div class="emojis__panel">${filterEmoji(value, 256)}</div>
<div class="fn__flex${value ? " fn__none" : ""}">
<button data-type="0" class="emojis__type ariaLabel" aria-label="${window.siyuan.languages.recentEmoji}">${unicode2Emoji("2b50")}</button>

3
app/src/protyle/render/av/col.ts
View file

@ -387,7 +387,8 @@ export const showColMenu = (protyle: IProtyle, blockElement: Element, cellElemen
}]);
});
menu.addItem({
icon: getColIconByType(type),
iconHTML: `<span style="align-self: center;margin-right: 8px;" class="block__icon block__icon--show" data-type="update-icon"><svg><use xlink:href="#${getColIconByType(type)}"></use></svg></span>`,
type: "readonly",
label: `<input style="margin: 4px 0" class="b3-text-field" type="text" value="${cellElement.innerText.trim()}">`,
bind(element) {
element.querySelector("input").addEventListener("keydown", (event: KeyboardEvent) => {

2
app/src/protyle/util/insertHTML.ts
View file

@ -154,7 +154,7 @@ export const insertHTML = (html: string, protyle: IProtyle, isBlock = false,
if (editWbrElement && editableElement && !trimStartText.endsWith("\n")) {
// 数学公式后无换行，后期渲染后添加导致 rang 错误，中文输入错误 https://github.com/siyuan-note/siyuan/issues/9054
const previousElement = hasPreviousSibling(editWbrElement) as HTMLElement;
if (previousElement && previousElement.nodeType !== 3 && previousElement.dataset.type.indexOf("inline-math") > -1 &&
if (previousElement && previousElement.nodeType !== 3 && (previousElement.dataset.type || "").indexOf("inline-math") > -1 &&
!hasNextSibling(editWbrElement)) {
editWbrElement.insertAdjacentText("afterend", "\n");
}