🎨 resize

This commit is contained in:
Vanessa 2023-09-13 12:05:57 +08:00
parent da369e391a
commit 268b928267
14 changed files with 99 additions and 87 deletions

View file

@ -2,51 +2,60 @@ import {hideElements} from "../ui/hideElements";
import {setPadding} from "../ui/initUI";
import {hasClosestBlock} from "./hasClosest";
import {Constants} from "../../constants";
import {lineNumberRender} from "../render/highlightRender";
export const resize = (protyle: IProtyle) => {
hideElements(["gutter"], protyle);
if (setPadding(protyle)) {
return;
}
const abs = setPadding(protyle);
const MIN_ABS = 4;
// 不能 clearTimeout否则 split 时左侧无法 resize
window.setTimeout(() => {
if (typeof echarts !== "undefined") {
protyle.wysiwyg.element.querySelectorAll('[data-subtype="echarts"], [data-subtype="mindmap"]').forEach((chartItem: HTMLElement) => {
const chartInstance = echarts.getInstanceById(chartItem.firstElementChild.nextElementSibling.getAttribute("_echarts_instance_"));
if (chartInstance) {
chartInstance.resize();
setTimeout(() => {
if (abs.width > MIN_ABS || isNaN(abs.width)) {
if (typeof echarts !== "undefined") {
protyle.wysiwyg.element.querySelectorAll('[data-subtype="echarts"], [data-subtype="mindmap"]').forEach((chartItem: HTMLElement) => {
const chartInstance = echarts.getInstanceById(chartItem.firstElementChild.nextElementSibling.getAttribute("_echarts_instance_"));
if (chartInstance) {
chartInstance.resize();
}
});
}
if (window.siyuan.config.editor.codeSyntaxHighlightLineNum) {
protyle.wysiwyg.element.querySelectorAll('.code-block [contenteditable="true"]').forEach((block: HTMLElement) => {
lineNumberRender(block);
});
}
// 保持光标位置不变 https://ld246.com/article/1673704873983/comment/1673765814595#comments
if (!protyle.disabled && protyle.toolbar.range) {
let rangeRect = protyle.toolbar.range.getBoundingClientRect();
if (rangeRect.height === 0) {
const blockElement = hasClosestBlock(protyle.toolbar.range.startContainer);
if (blockElement) {
rangeRect = blockElement.getBoundingClientRect();
}
}
if (rangeRect.height === 0) {
return;
}
const protyleRect = protyle.element.getBoundingClientRect();
if (protyleRect.top + 30 > rangeRect.top || protyleRect.bottom < rangeRect.bottom) {
protyle.toolbar.range.startContainer.parentElement.scrollIntoView(protyleRect.top > rangeRect.top);
}
}
}
if (abs.padding > MIN_ABS || abs.width > MIN_ABS || isNaN(abs.padding)) {
protyle.wysiwyg.element.querySelectorAll(".av").forEach((item: HTMLElement) => {
item.style.width = item.parentElement.clientWidth + "px";
if (item.getAttribute("data-render") === "true") {
const paddingLeft = item.parentElement.style.paddingLeft;
const paddingRight = item.parentElement.style.paddingRight;
const avHeaderElement = item.firstElementChild.firstElementChild as HTMLElement;
avHeaderElement.style.paddingLeft = paddingLeft;
avHeaderElement.style.paddingRight = paddingRight;
const avBodyElement = item.querySelector(".av__scroll").firstElementChild as HTMLElement;
avBodyElement.style.paddingLeft = paddingLeft;
avBodyElement.style.paddingRight = paddingRight;
}
});
}
protyle.wysiwyg.element.querySelectorAll(".av").forEach((item: HTMLElement) => {
item.style.width = item.parentElement.clientWidth + "px";
if (item.getAttribute("data-render") === "true") {
const paddingLeft = item.parentElement.style.paddingLeft;
const paddingRight = item.parentElement.style.paddingRight;
const avHeaderElement = item.firstElementChild.firstElementChild as HTMLElement;
avHeaderElement.style.paddingLeft = paddingLeft;
avHeaderElement.style.paddingRight = paddingRight;
const avBodyElement = item.querySelector(".av__scroll").firstElementChild as HTMLElement;
avBodyElement.style.paddingLeft = paddingLeft;
avBodyElement.style.paddingRight = paddingRight;
}
});
// 保持光标位置不变 https://ld246.com/article/1673704873983/comment/1673765814595#comments
if (!protyle.disabled && protyle.toolbar.range) {
let rangeRect = protyle.toolbar.range.getBoundingClientRect();
if (rangeRect.height === 0) {
const blockElement = hasClosestBlock(protyle.toolbar.range.startContainer);
if (blockElement) {
rangeRect = blockElement.getBoundingClientRect();
}
}
if (rangeRect.height === 0) {
return;
}
const protyleRect = protyle.element.getBoundingClientRect();
if (protyleRect.top + 30 > rangeRect.top || protyleRect.bottom < rangeRect.bottom) {
protyle.toolbar.range.startContainer.parentElement.scrollIntoView(protyleRect.top > rangeRect.top);
}
}
}, Constants.TIMEOUT_TRANSITION); // 等待 setPadding 动画结束
};