mirror of
https://github.com/siyuan-note/siyuan.git
synced 2025-12-24 02:20:13 +01:00
This commit is contained in:
parent
d8e74384a1
commit
885b1ffad3
8 changed files with 38 additions and 20 deletions
|
|
@ -8,6 +8,7 @@
|
|||
z-index: 210;
|
||||
max-height: 80vh;
|
||||
overflow: auto;
|
||||
box-sizing: border-box;
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
display: none;
|
||||
|
|
|
|||
|
|
@ -332,9 +332,13 @@
|
|||
}
|
||||
}
|
||||
|
||||
.b3-menu__accelerator {
|
||||
.b3-menu {
|
||||
width: 100%;
|
||||
|
||||
&__accelerator {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
#historyContainer {
|
||||
& > div {
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
|
|
|
|||
|
|
@ -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);
|
||||
|
|
|
|||
|
|
@ -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) {
|
||||
|
|
|
|||
|
|
@ -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");
|
||||
|
|
|
|||
|
|
@ -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");
|
||||
|
|
|
|||
|
|
@ -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");
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue