mirror of
https://github.com/siyuan-note/siyuan.git
synced 2025-12-21 09:00:12 +01:00
🐛 back to the zoom in block
This commit is contained in:
parent
9383c943b3
commit
a974bbdece
5 changed files with 46 additions and 49 deletions
|
|
@ -338,7 +338,11 @@ const switchEditor = (editor: Editor, options: IOpenFileOptions, allModels: IMod
|
||||||
highlightById(editor.editor.protyle, options.id, true);
|
highlightById(editor.editor.protyle, options.id, true);
|
||||||
} else if (options.action.includes(Constants.CB_GET_FOCUS)) {
|
} else if (options.action.includes(Constants.CB_GET_FOCUS)) {
|
||||||
if (nodeElement) {
|
if (nodeElement) {
|
||||||
focusBlock(nodeElement);
|
const newRange = focusBlock(nodeElement);
|
||||||
|
if (newRange) {
|
||||||
|
// 需要更新 range,否则文档大纲点击导致切换页签时因为 resize 中 `保持光标位置不变` 会导致光标跳动
|
||||||
|
editor.editor.protyle.toolbar.range = newRange
|
||||||
|
}
|
||||||
scrollCenter(editor.editor.protyle, nodeElement, true);
|
scrollCenter(editor.editor.protyle, nodeElement, true);
|
||||||
} else if (editor.editor.protyle.block.rootID === options.id) {
|
} else if (editor.editor.protyle.block.rootID === options.id) {
|
||||||
// 由于 https://github.com/siyuan-note/siyuan/issues/5420,移除定位
|
// 由于 https://github.com/siyuan-note/siyuan/issues/5420,移除定位
|
||||||
|
|
@ -455,7 +459,7 @@ export const updatePanelByEditor = (options: {
|
||||||
if (options.resize) {
|
if (options.resize) {
|
||||||
resize(options.protyle);
|
resize(options.protyle);
|
||||||
}
|
}
|
||||||
if (focus) {
|
if (options.focus) {
|
||||||
if (options.protyle.toolbar.range) {
|
if (options.protyle.toolbar.range) {
|
||||||
focusByRange(options.protyle.toolbar.range);
|
focusByRange(options.protyle.toolbar.range);
|
||||||
countSelectWord(options.protyle.toolbar.range, options.protyle.block.rootID);
|
countSelectWord(options.protyle.toolbar.range, options.protyle.block.rootID);
|
||||||
|
|
|
||||||
|
|
@ -409,6 +409,10 @@ export class Wnd {
|
||||||
|
|
||||||
public switchTab(target: HTMLElement, pushBack = false, update = true) {
|
public switchTab(target: HTMLElement, pushBack = false, update = true) {
|
||||||
setPanelFocus(this.headersElement.parentElement.parentElement);
|
setPanelFocus(this.headersElement.parentElement.parentElement);
|
||||||
|
// https://github.com/siyuan-note/siyuan/issues/8233
|
||||||
|
if (target.classList.contains("item--focus")) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
let currentTab: Tab;
|
let currentTab: Tab;
|
||||||
this.children.forEach((item) => {
|
this.children.forEach((item) => {
|
||||||
if (target === item.headElement) {
|
if (target === item.headElement) {
|
||||||
|
|
|
||||||
|
|
@ -46,16 +46,21 @@ const focusStack = (backStack: IBackStack) => {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
if (backStack.isZoom) {
|
if (backStack.zoomId) {
|
||||||
fetchPost("/api/block/checkBlockExist", {id: backStack.id}, existResponse => {
|
if (backStack.zoomId !== protyle.block.id) {
|
||||||
if (existResponse.data) {
|
fetchPost("/api/block/checkBlockExist", {id: backStack.id}, existResponse => {
|
||||||
zoomOut(protyle, backStack.id, undefined, false, () => {
|
if (existResponse.data) {
|
||||||
protyle.contentElement.scrollTop = backStack.scrollTop;
|
zoomOut(protyle, backStack.id, undefined, false, () => {
|
||||||
});
|
protyle.contentElement.scrollTop = backStack.scrollTop;
|
||||||
}
|
});
|
||||||
});
|
}
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
protyle.contentElement.scrollTop = backStack.scrollTop;
|
||||||
|
}
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
fetchPost("/api/filetree/getDoc", {
|
fetchPost("/api/filetree/getDoc", {
|
||||||
id: backStack.id,
|
id: backStack.id,
|
||||||
startID: startEndId[0],
|
startID: startEndId[0],
|
||||||
|
|
@ -95,7 +100,7 @@ export const pushBack = () => {
|
||||||
endId: protyle.wysiwyg.element.firstElementChild.getAttribute("data-node-id") + Constants.ZWSP + protyle.wysiwyg.element.lastElementChild.getAttribute("data-node-id"),
|
endId: protyle.wysiwyg.element.firstElementChild.getAttribute("data-node-id") + Constants.ZWSP + protyle.wysiwyg.element.lastElementChild.getAttribute("data-node-id"),
|
||||||
scrollTop: protyle.contentElement.scrollTop,
|
scrollTop: protyle.contentElement.scrollTop,
|
||||||
callback: protyle.block.action,
|
callback: protyle.block.action,
|
||||||
isZoom: protyle.block.showAll
|
zoomId: protyle.block.showAll ? protyle.block.id : undefined
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -164,7 +169,7 @@ export const goBack = () => {
|
||||||
endId: protyle.wysiwyg.element.firstElementChild.getAttribute("data-node-id") + Constants.ZWSP + protyle.wysiwyg.element.lastElementChild.getAttribute("data-node-id"),
|
endId: protyle.wysiwyg.element.firstElementChild.getAttribute("data-node-id") + Constants.ZWSP + protyle.wysiwyg.element.lastElementChild.getAttribute("data-node-id"),
|
||||||
scrollTop: protyle.contentElement.scrollTop,
|
scrollTop: protyle.contentElement.scrollTop,
|
||||||
callback: protyle.block.action,
|
callback: protyle.block.action,
|
||||||
isZoom: protyle.block.showAll
|
zoomId: protyle.block.showAll ? protyle.block.id : undefined
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
const item = window.siyuan.backStack.pop();
|
const item = window.siyuan.backStack.pop();
|
||||||
|
|
|
||||||
2
app/src/types/index.d.ts
vendored
2
app/src/types/index.d.ts
vendored
|
|
@ -162,7 +162,7 @@ interface IBackStack {
|
||||||
callback?: string[],
|
callback?: string[],
|
||||||
position?: { start: number, end: number }
|
position?: { start: number, end: number }
|
||||||
protyle?: IProtyle,
|
protyle?: IProtyle,
|
||||||
isZoom?: boolean
|
zoomId?: string
|
||||||
}
|
}
|
||||||
|
|
||||||
interface IEmoji {
|
interface IEmoji {
|
||||||
|
|
|
||||||
|
|
@ -53,8 +53,8 @@ const focusStack = async (stack: IBackStack) => {
|
||||||
const editor = new Editor({
|
const editor = new Editor({
|
||||||
tab,
|
tab,
|
||||||
scrollAttr,
|
scrollAttr,
|
||||||
blockId: stack.isZoom ? stack.id : stack.protyle.block.rootID,
|
blockId: stack.zoomId || stack.protyle.block.rootID,
|
||||||
action: stack.isZoom ? [Constants.CB_GET_FOCUS, Constants.CB_GET_ALL] : [Constants.CB_GET_FOCUS]
|
action: stack.zoomId ? [Constants.CB_GET_FOCUS, Constants.CB_GET_ALL] : [Constants.CB_GET_FOCUS]
|
||||||
});
|
});
|
||||||
tab.addModel(editor);
|
tab.addModel(editor);
|
||||||
}
|
}
|
||||||
|
|
@ -110,6 +110,8 @@ const focusStack = async (stack: IBackStack) => {
|
||||||
if (stack.protyle.title.editElement.getBoundingClientRect().height === 0) {
|
if (stack.protyle.title.editElement.getBoundingClientRect().height === 0) {
|
||||||
// 切换 tab
|
// 切换 tab
|
||||||
stack.protyle.model.parent.parent.switchTab(stack.protyle.model.parent.headElement);
|
stack.protyle.model.parent.parent.switchTab(stack.protyle.model.parent.headElement);
|
||||||
|
// 需要更新 range,否则 resize 中 `保持光标位置不变` 会导致光标跳动
|
||||||
|
stack.protyle.toolbar.range = undefined;
|
||||||
}
|
}
|
||||||
focusByOffset(stack.protyle.title.editElement, stack.position.start, stack.position.end);
|
focusByOffset(stack.protyle.title.editElement, stack.position.start, stack.position.end);
|
||||||
return true;
|
return true;
|
||||||
|
|
@ -125,34 +127,15 @@ const focusStack = async (stack: IBackStack) => {
|
||||||
// 切换 tab
|
// 切换 tab
|
||||||
stack.protyle.model.parent.parent.switchTab(stack.protyle.model.parent.headElement);
|
stack.protyle.model.parent.parent.switchTab(stack.protyle.model.parent.headElement);
|
||||||
}
|
}
|
||||||
if (stack.isZoom) {
|
if (stack.zoomId && stack.zoomId !== stack.protyle.block.id) {
|
||||||
zoomOut(stack.protyle, stack.id, undefined, false);
|
zoomOut(stack.protyle, stack.zoomId, undefined, false, () => {
|
||||||
return true;
|
focusByOffset(getContenteditableElement(blockElement), stack.position.start, stack.position.end);
|
||||||
}
|
|
||||||
if (blockElement && !stack.protyle.block.showAll) {
|
|
||||||
focusByOffset(getContenteditableElement(blockElement), stack.position.start, stack.position.end);
|
|
||||||
scrollCenter(stack.protyle, blockElement, true);
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
// 缩放不一致
|
|
||||||
fetchPost("/api/filetree/getDoc", {
|
|
||||||
id: stack.id,
|
|
||||||
mode: stack.isZoom ? 0 : 3,
|
|
||||||
size: stack.isZoom ? Constants.SIZE_GET_MAX : window.siyuan.config.editor.dynamicLoadBlocks,
|
|
||||||
}, getResponse => {
|
|
||||||
onGet(getResponse, stack.protyle, [Constants.CB_GET_HTML]);
|
|
||||||
Array.from(stack.protyle.wysiwyg.element.querySelectorAll(`[data-node-id="${stack.id}"]`)).find(item => {
|
|
||||||
if (!hasClosestByAttribute(item, "data-type", "NodeBlockQueryEmbed")) {
|
|
||||||
blockElement = item;
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
focusByOffset(getContenteditableElement(blockElement), stack.position.start, stack.position.end);
|
|
||||||
setTimeout(() => {
|
|
||||||
// 图片、视频等加载完成后再定位
|
|
||||||
scrollCenter(stack.protyle, blockElement, true);
|
scrollCenter(stack.protyle, blockElement, true);
|
||||||
}, Constants.TIMEOUT_LOAD);
|
});
|
||||||
});
|
return true;
|
||||||
|
}
|
||||||
|
focusByOffset(getContenteditableElement(blockElement), stack.position.start, stack.position.end);
|
||||||
|
scrollCenter(stack.protyle, blockElement, true);
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
if (stack.protyle.element.parentElement) {
|
if (stack.protyle.element.parentElement) {
|
||||||
|
|
@ -165,11 +148,11 @@ const focusStack = async (stack: IBackStack) => {
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
fetchPost("/api/filetree/getDoc", {
|
fetchPost("/api/filetree/getDoc", {
|
||||||
id: stack.id,
|
id: stack.zoomId ? stack.zoomId : stack.id,
|
||||||
mode: stack.isZoom ? 0 : 3,
|
mode: stack.zoomId ? 0 : 3,
|
||||||
size: stack.isZoom ? Constants.SIZE_GET_MAX : window.siyuan.config.editor.dynamicLoadBlocks,
|
size: stack.zoomId ? Constants.SIZE_GET_MAX : window.siyuan.config.editor.dynamicLoadBlocks,
|
||||||
}, getResponse => {
|
}, getResponse => {
|
||||||
onGet(getResponse, stack.protyle, stack.isZoom ? [Constants.CB_GET_HTML, Constants.CB_GET_ALL] : [Constants.CB_GET_HTML]);
|
onGet(getResponse, stack.protyle, stack.zoomId ? [Constants.CB_GET_HTML, Constants.CB_GET_ALL] : [Constants.CB_GET_HTML]);
|
||||||
Array.from(stack.protyle.wysiwyg.element.querySelectorAll(`[data-node-id="${stack.id}"]`)).find(item => {
|
Array.from(stack.protyle.wysiwyg.element.querySelectorAll(`[data-node-id="${stack.id}"]`)).find(item => {
|
||||||
if (!hasClosestByAttribute(item, "data-type", "NodeBlockQueryEmbed")) {
|
if (!hasClosestByAttribute(item, "data-type", "NodeBlockQueryEmbed")) {
|
||||||
blockElement = item;
|
blockElement = item;
|
||||||
|
|
@ -262,8 +245,9 @@ export const pushBack = (protyle: IProtyle, range?: Range, blockElement?: Elemen
|
||||||
const position = getSelectionOffset(editElement, undefined, range);
|
const position = getSelectionOffset(editElement, undefined, range);
|
||||||
const id = blockElement.getAttribute("data-node-id") || protyle.block.rootID;
|
const id = blockElement.getAttribute("data-node-id") || protyle.block.rootID;
|
||||||
const lastStack = window.siyuan.backStack[window.siyuan.backStack.length - 1];
|
const lastStack = window.siyuan.backStack[window.siyuan.backStack.length - 1];
|
||||||
const isZoom = protyle.block.showAll;
|
if (lastStack && lastStack.id === id && (
|
||||||
if (lastStack && lastStack.id === id && lastStack.isZoom === isZoom) {
|
(protyle.block.showAll && lastStack.zoomId === protyle.block.id) || (!lastStack.zoomId && !protyle.block.showAll)
|
||||||
|
)) {
|
||||||
lastStack.position = position;
|
lastStack.position = position;
|
||||||
} else {
|
} else {
|
||||||
if (forwardStack.length > 0) {
|
if (forwardStack.length > 0) {
|
||||||
|
|
@ -277,7 +261,7 @@ export const pushBack = (protyle: IProtyle, range?: Range, blockElement?: Elemen
|
||||||
position,
|
position,
|
||||||
id,
|
id,
|
||||||
protyle,
|
protyle,
|
||||||
isZoom
|
zoomId: protyle.block.showAll ? protyle.block.id : undefined,
|
||||||
});
|
});
|
||||||
if (window.siyuan.backStack.length > Constants.SIZE_UNDO) {
|
if (window.siyuan.backStack.length > Constants.SIZE_UNDO) {
|
||||||
window.siyuan.backStack.shift();
|
window.siyuan.backStack.shift();
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue