Vanessa 2023-03-04 11:45:36 +08:00
parent d8e74384a1
commit 885b1ffad3
8 changed files with 38 additions and 20 deletions

View file

@ -8,6 +8,7 @@
z-index: 210;
max-height: 80vh;
overflow: auto;
box-sizing: border-box;
&::-webkit-scrollbar {
display: none;

View file

@ -332,9 +332,13 @@
}
}
.b3-menu__accelerator {
.b3-menu {
width: 100%;
&__accelerator {
display: none;
}
}
#historyContainer {
& > div {

View file

@ -1,3 +1,5 @@
import {isMobile} from "./util/functions";
declare const SIYUAN_VERSION: string;
declare const NODE_ENV: string;
@ -36,7 +38,7 @@ export abstract class Constants {
public static readonly SIYUAN_EXPORT_PREVENT: string = "siyuan-export-prevent";
// size
public static readonly SIZE_TOOLBAR_HEIGHT: number = 32;
public static readonly SIZE_TOOLBAR_HEIGHT: number = isMobile() ? 0 : 32;
public static readonly SIZE_GET_MAX = 102400;
public static readonly SIZE_UNDO = 64;
public static readonly SIZE_TITLE = 512;

View file

@ -3,7 +3,8 @@ import {hasClosestBlock, hasClosestByClassName, hasClosestByMatchTag} from "../.
import {moveToDown, moveToUp} from "../../protyle/wysiwyg/move";
import {Constants} from "../../constants";
import {focusByRange, getSelectionPosition} from "../../protyle/util/selection";
import {getEventName} from "../../protyle/util/compatibility";
import {removeBlock} from "../../protyle/wysiwyg/remove";
import {hintSlash} from "../../protyle/hint/extend";
export const showKeyboardToolbar = (bottom = 0) => {
if (getSelection().rangeCount === 0 || window.siyuan.config.editor.readOnly || window.siyuan.config.readonly) {
@ -105,12 +106,12 @@ export const initKeyboardToolbar = () => {
<span class="keyboard__split"></span>
<button data-type="add"><svg><use xlink:href="#iconAdd"></use></svg></button>
<button data-type="goinline"><svg class="keyboard__svg--big"><use xlink:href="#iconBIU"></use></svg></button>
<button data-type="indent"><svg><use xlink:href="#iconTrashcan"></use></svg></button>
<button data-type="remove"><svg><use xlink:href="#iconTrashcan"></use></svg></button>
<span class="keyboard__split"></span>
<button data-type="undo"><svg><use xlink:href="#iconUndo"></use></svg></button>
<button data-type="redo"><svg><use xlink:href="#iconRedo"></use></svg></button>
<button data-type="appearance"><svg><use xlink:href="#iconFont"></use></svg></button>
<button data-type="block"><svg><use xlink:href="#iconMore"></use></svg></button>
<button data-type="block"><svg><use xlink:href="#iconParagraph"></use></svg></button>
<button data-type="more"><svg><use xlink:href="#iconMore"></use></svg></button>
<span class="keyboard__split"></span>
<button data-type="moveup"><svg><use xlink:href="#iconUp"></use></svg></button>
<button data-type="movedown"><svg><use xlink:href="#iconDown"></use></svg></button>
@ -182,7 +183,7 @@ export const initKeyboardToolbar = () => {
}
// inline element
if (["a", "block-ref", "inline-math", "inline-memo", "text"].includes(type)) {
protyle.toolbar.element.querySelector(`[data-type="${type}"]`).dispatchEvent(new CustomEvent("text" === type ? getEventName() : "click"));
protyle.toolbar.element.querySelector(`[data-type="${type}"]`).dispatchEvent(new CustomEvent("click"));
return;
} else if (["strong", "em", "s", "code", "mark", "tag", "u", "sup", "clear", "sub", "kbd"].includes(type)) {
protyle.toolbar.setInlineMark(protyle, type, "toolbar");
@ -196,16 +197,26 @@ export const initKeyboardToolbar = () => {
focusByRange(range);
return;
} else if (type === "remove") {
// TODO
nodeElement.classList.add("protyle-wysiwyg--select");
removeBlock(protyle, nodeElement, range);
return;
} else if (type === "add") {
// TODO
protyle.hint.splitChar = "/";
protyle.hint.lastIndex = -1;
protyle.hint.genHTML(hintSlash("", protyle), protyle);
focusByRange(range);
return;
} else if (type === "appearance") {
// TODO
} else if (type === "more") {
protyle.breadcrumb.showMenu(protyle, {
x: 0,
y: 0
});
focusByRange(range);
return;
} else if (type === "block") {
// TODO
protyle.gutter.renderMenu(protyle, nodeElement);
window.siyuan.menus.menu.popup({x: 0, y:0}, true);
focusByRange(range);
return;
} else if (type === "outdent") {
listOutdent(protyle, [nodeElement.parentElement], range);

View file

@ -147,7 +147,7 @@ export class Breadcrumb {
this.mediaRecorder.startRecordingNewWavFile();
}
private showMenu(protyle: IProtyle, position: { x: number, y: number }) {
public showMenu(protyle: IProtyle, position: { x: number, y: number }) {
let id;
const cursorNodeElement = hasClosestBlock(getEditorRange(protyle.element).startContainer);
if (cursorNodeElement) {

View file

@ -581,7 +581,7 @@ ${unicode2Emoji(emoji.unicode, true)}</button>`;
range.deleteContents();
focusByRange(range);
if (["a", "block-ref", "inline-math", "inline-memo", "text"].includes(value)) {
protyle.toolbar.element.querySelector(`[data-type="${value}"]`).dispatchEvent(new CustomEvent("block-ref" === value ? getEventName() : "click"));
protyle.toolbar.element.querySelector(`[data-type="${value}"]`).dispatchEvent(new CustomEvent("click"));
return;
}
protyle.toolbar.setInlineMark(protyle, value, "range");

View file

@ -1,4 +1,4 @@
import {getEventName, setStorageVal, updateHotkeyTip} from "../util/compatibility";
import {setStorageVal, updateHotkeyTip} from "../util/compatibility";
import {ToolbarItem} from "./ToolbarItem";
import {setPosition} from "../../util/setPosition";
import {focusByRange, getSelectionPosition} from "../util/selection";
@ -10,7 +10,7 @@ export class Font extends ToolbarItem {
constructor(protyle: IProtyle, menuItem: IMenuItem) {
super(protyle, menuItem);
this.element.addEventListener(getEventName(), () => {
this.element.addEventListener("click", () => {
if (protyle.toolbar.range.toString() === "") {
return;
}
@ -115,7 +115,7 @@ const fontMenu = (protyle: IProtyle) => {
</div>
<div class="fn__hr"></div>
<button class="b3-button b3-button--cancel" data-type="clear"><svg><use xlink:href="#iconTrashcan"></use></svg>${window.siyuan.languages.clearFontStyle}</button>`;
element.addEventListener(getEventName(), function (event: Event) {
element.addEventListener("click", function (event: Event) {
let target = event.target as HTMLElement;
while (target && !target.isEqualNode(element)) {
const dataType = target.getAttribute("data-type");

View file

@ -1295,7 +1295,7 @@ export const keydown = (protyle: IProtyle, editorElement: HTMLElement) => {
if (matchHotKey(menuItem.hotkey, event)) {
protyle.toolbar.range = getEditorRange(protyle.wysiwyg.element);
if (["a", "block-ref", "inline-math", "inline-memo", "text"].includes(menuItem.name)) {
protyle.toolbar.element.querySelector(`[data-type="${menuItem.name}"]`).dispatchEvent(new CustomEvent("block-ref" === menuItem.name ? getEventName() : "click"));
protyle.toolbar.element.querySelector(`[data-type="${menuItem.name}"]`).dispatchEvent(new CustomEvent("click"));
return true;
}
protyle.toolbar.setInlineMark(protyle, menuItem.name, "range");