renun/obsidian-excalidraw-plugin
1
0
Fork 0
mirror of https://github.com/zsviczian/obsidian-excalidraw-plugin.git synced 2025-08-06 05:46:28 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

DEGUGGING in dev build with process.env.NODE_ENV, + this.lastSceneSnapshot

Browse Source
This commit is contained in:
zsviczian
2024-05-22 20:08:49 +02:00
parent d05ccc0055
commit 32cd3a62b6
9 changed files with 285 additions and 105 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
package.json
View File

@@ -35,6 +35,7 @@
"js-yaml": "^4.1.0"
},
"devDependencies": {
"dotenv": "^16.4.5",
"@babel/core": "^7.22.9",
"@babel/preset-env": "^7.22.10",
"@babel/preset-react": "^7.22.5",

77
rollup.config.js
View File

@@ -1,19 +1,22 @@
import { nodeResolve } from '@rollup/plugin-node-resolve';
import commonjs from '@rollup/plugin-commonjs';
import { env } from "process";
import babel from '@rollup/plugin-babel';
import replace from "@rollup/plugin-replace";
import { terser } from "rollup-plugin-terser";
import copy from "rollup-plugin-copy";
import typescript2 from "rollup-plugin-typescript2";
import webWorker from "rollup-plugin-web-worker-loader";
import fs from'fs';
import fs from 'fs';
import LZString from 'lz-string';
import postprocess from 'rollup-plugin-postprocess';
import cssnano from 'cssnano';
// Load environment variables
import dotenv from 'dotenv';
dotenv.config();
const DIST_FOLDER = 'dist';
const isProd = (process.env.NODE_ENV === "production")
const isProd = (process.env.NODE_ENV === "production");
const isLib = (process.env.NODE_ENV === "lib");
console.log(`Running: ${process.env.NODE_ENV}`);
@@ -28,13 +31,13 @@ const reactdom_pkg = isLib ? "" : isProd
: fs.readFileSync("./node_modules/react-dom/umd/react-dom.development.js", "utf8");
const lzstring_pkg = isLib ? "" : fs.readFileSync("./node_modules/lz-string/libs/lz-string.min.js", "utf8");
if(!isLib) {
if (!isLib) {
const excalidraw_styles = isProd
? fs.readFileSync("./node_modules/@zsviczian/excalidraw/dist/styles.production.css", "utf8")
: fs.readFileSync("./node_modules/@zsviczian/excalidraw/dist/styles.development.css", "utf8");
const plugin_styles = fs.readFileSync("./styles.css", "utf8")
const plugin_styles = fs.readFileSync("./styles.css", "utf8");
const styles = plugin_styles + excalidraw_styles;
cssnano()
cssnano()
.process(styles) // Process the CSS
.then(result => {
fs.writeFileSync(`./${DIST_FOLDER}/styles.css`, result.css);
@@ -46,16 +49,16 @@ if(!isLib) {
const manifestStr = isLib ? "" : fs.readFileSync("manifest.json", "utf-8");
const manifest = isLib ? {} : JSON.parse(manifestStr);
!isLib && console.log(manifest.version);
if (!isLib) console.log(manifest.version);
const packageString = isLib
? ""
const packageString = isLib
? ""
: ';' + lzstring_pkg +
'\nconst EXCALIDRAW_PACKAGES = "' + LZString.compressToBase64(react_pkg + reactdom_pkg + excalidraw_pkg) + '";\n' +
'const {react, reactDOM, excalidrawLib} = window.eval.call(window, `(function() {' +
'${LZString.decompressFromBase64(EXCALIDRAW_PACKAGES)};' +
'return {react:React, reactDOM:ReactDOM, excalidrawLib: ExcalidrawLib};})();`);\n' +
'const PLUGIN_VERSION="'+manifest.version+'";';
'return {react: React, reactDOM: ReactDOM, excalidrawLib: ExcalidrawLib};})();`);\n' +
'const PLUGIN_VERSION="' + manifest.version + '";';
const BASE_CONFIG = {
input: 'src/main.ts',
@@ -76,33 +79,30 @@ const BASE_CONFIG = {
'react',
'react-dom'
],
}
};
const getRollupPlugins = (tsconfig, ...plugins) =>
[
typescript2(tsconfig),
nodeResolve({ browser: true }),
commonjs(),
webWorker({ inline: true, forceInline: true, targetPlatform: "browser" }),
].concat(plugins);
const getRollupPlugins = (tsconfig, ...plugins) => [
typescript2(tsconfig),
nodeResolve({ browser: true }),
commonjs(),
webWorker({ inline: true, forceInline: true, targetPlatform: "browser" }),
].concat(plugins);
const BUILD_CONFIG = {
...BASE_CONFIG,
output: {
dir: DIST_FOLDER,
entryFileNames: 'main.js',
//sourcemap: isProd?false:'inline',
format: 'cjs',
exports: 'default',
},
plugins: [
typescript2({
tsconfig: isProd ? "tsconfig.json" : "tsconfig.dev.json",
//inlineSources: !isProd
}),
replace({
preventAssignment: true,
"process.env.NODE_ENV": JSON.stringify(env.NODE_ENV),
"process.env.NODE_ENV": JSON.stringify(process.env.NODE_ENV),
}),
babel({
presets: [['@babel/preset-env', {
@@ -110,30 +110,27 @@ const BUILD_CONFIG = {
esmodules: true,
},
}]],
exclude: "node_modules/**"
exclude: "node_modules/**",
}),
commonjs(),
nodeResolve({ browser: true, preferBuiltins: false }),
...isProd
? [
...(isProd ? [
terser({
toplevel: false,
compress: {passes: 2}
compress: { passes: 2 },
}),
//!postprocess - the version available on npmjs does not work, need this update:
// npm install brettz9/rollup-plugin-postprocess#update --save-dev
// https://github.com/developit/rollup-plugin-postprocess/issues/10
postprocess([
//[/,React=require\("react"\);/, packageString],
[/React=require\("react"\),state=require\("@codemirror\/state"\),view=require\("@codemirror\/view"\)/,
`state=require("@codemirror/state"),view=require("@codemirror/view")` + packageString]
])
]
: [
`state=require("@codemirror/state"),view=require("@codemirror/view")` + packageString],
]),
] : [
postprocess([
[/var React = require\('react'\);/, packageString],
])
],
]),
]),
copy({
targets: [
{ src: 'manifest.json', dest: DIST_FOLDER },
@@ -141,7 +138,7 @@ const BUILD_CONFIG = {
verbose: true, // Optional: To display copied files in the console
}),
],
}
};
const LIB_CONFIG = {
...BASE_CONFIG,
@@ -153,16 +150,16 @@ const LIB_CONFIG = {
name: "Excalidraw (Library)",
},
plugins: getRollupPlugins(
{ tsconfig: "tsconfig-lib.json"},
copy({ targets: [{ src: "src/*.d.ts", dest: "lib/typings" }] })
),
}
{ tsconfig: "tsconfig-lib.json" },
copy({ targets: [{ src: "src/*.d.ts", dest: "lib/typings" }] })
),
};
let config = [];
if(process.env.NODE_ENV === "lib") {
if (process.env.NODE_ENV === "lib") {
config.push(LIB_CONFIG);
} else {
config.push(BUILD_CONFIG);
}
export default config;
export default config;

5
src/ExcalidrawData.ts
View File

@@ -11,10 +11,7 @@ import {
fileid,
DEVICE,
EMBEDDABLE_THEME_FRONTMATTER_VALUES,
getBoundTextMaxWidth,
getDefaultLineHeight,
getFontString,
wrapText,
ERROR_IFRAME_CONVERSION_CANCELED,
JSON_parse,
FRONTMATTER_KEYS,
@@ -992,7 +989,7 @@ export class ExcalidrawData {
te.width = width;
te.height = height;
} catch(e) {
DEBUGGING && debug(this.updateSceneTextElements, `ExcalidrawData.updateSceneTextElements, textElement:${te?.id}`, te, this.updateSceneTextElements);
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.updateSceneTextElements, `ExcalidrawData.updateSceneTextElements, textElement:${te?.id}`, te, this.updateSceneTextElements);
}
}
}

168
src/ExcalidrawView.ts
View File

@@ -181,6 +181,7 @@ export const addFiles = async (
view: ExcalidrawView,
isDark?: boolean,
) => {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(addFiles, "ExcalidrawView.addFiles", files, view, isDark);
if (!files || files.length === 0 || !view) {
return;
}
@@ -347,6 +348,7 @@ export default class ExcalidrawView extends TextFileView {
private viewModeEnabled:boolean = false;
private lastMouseEvent: any = null;
private editingTextElementId: string = null; //storing to handle on-screen keyboard hide events
private lastSceneSnapshot: any = null;
id: string = (this.leaf as any).id;
@@ -359,6 +361,7 @@ export default class ExcalidrawView extends TextFileView {
}
setHookServer(ea:ExcalidrawAutomate) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.setHookServer, "ExcalidrawView.setHookServer", ea);
if(ea) {
this.hookServer = ea;
} else {
@@ -369,11 +372,13 @@ export default class ExcalidrawView extends TextFileView {
getHookServer = () => this.hookServer ?? this.plugin.ea;
preventAutozoom() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.preventAutozoom, "ExcalidrawView.preventAutozoom");
this.semaphores.preventAutozoom = true;
setTimeout(() => (this.semaphores.preventAutozoom = false), 1500);
}
public saveExcalidraw(scene?: any) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.saveExcalidraw, "ExcalidrawView.saveExcalidraw", scene);
if (!scene) {
if(!this.excalidrawAPI) {
return;
@@ -393,6 +398,7 @@ export default class ExcalidrawView extends TextFileView {
}
public async exportExcalidraw(selectedOnly?: boolean) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.exportExcalidraw, "ExcalidrawView.exportExcalidraw", selectedOnly);
if (!this.excalidrawAPI || !this.file) {
return;
}
@@ -431,6 +437,7 @@ export default class ExcalidrawView extends TextFileView {
}
public async svg(scene: any, theme?:string, embedScene?: boolean): Promise<SVGSVGElement> {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.svg, "ExcalidrawView.svg", scene, theme, embedScene);
const ed = this.exportDialog;
const exportSettings: ExportSettings = {
@@ -463,6 +470,7 @@ export default class ExcalidrawView extends TextFileView {
}
public async saveSVG(scene?: any, embedScene?: boolean) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.saveSVG, "ExcalidrawView.saveSVG", scene, embedScene);
if (!scene) {
if (!this.excalidrawAPI) {
return false;
@@ -497,6 +505,7 @@ export default class ExcalidrawView extends TextFileView {
}
public async exportSVG(embedScene?: boolean, selectedOnly?: boolean):Promise<void> {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.exportSVG, "ExcalidrawView.exportSVG", embedScene, selectedOnly);
if (!this.excalidrawAPI || !this.file) {
return;
}
@@ -514,6 +523,7 @@ export default class ExcalidrawView extends TextFileView {
}
public async png(scene: any, theme?:string, embedScene?: boolean): Promise<Blob> {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.png, "ExcalidrawView.png", scene, theme, embedScene);
const ed = this.exportDialog;
const exportSettings: ExportSettings = {
@@ -546,6 +556,7 @@ export default class ExcalidrawView extends TextFileView {
}
public async savePNG(scene?: any, embedScene?: boolean) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.savePNG, "ExcalidrawView.savePNG", scene, embedScene);
if (!scene) {
if (!this.excalidrawAPI) {
return false;
@@ -576,6 +587,7 @@ export default class ExcalidrawView extends TextFileView {
}
public async exportPNGToClipboard(embedScene?:boolean, selectedOnly?: boolean) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.exportPNGToClipboard, "ExcalidrawView.exportPNGToClipboard", embedScene, selectedOnly);
if (!this.excalidrawAPI || !this.file) {
return;
}
@@ -600,6 +612,7 @@ export default class ExcalidrawView extends TextFileView {
}
public async exportPNG(embedScene?:boolean, selectedOnly?: boolean):Promise<void> {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.exportPNG, "ExcalidrawView.exportPNG", embedScene, selectedOnly);
if (!this.excalidrawAPI || !this.file) {
return;
}
@@ -620,12 +633,14 @@ export default class ExcalidrawView extends TextFileView {
private preventReloadResetTimer: NodeJS.Timeout = null;
public setPreventReload() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.setPreventReload, "ExcalidrawView.setPreventReload");
this.semaphores.preventReload = true;
const self = this;
this.preventReloadResetTimer = setTimeout(()=>self.semaphores.preventReload = false,PREVENT_RELOAD_TIMEOUT);
}
public clearPreventReloadTimer() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.clearPreventReloadTimer, "ExcalidrawView.clearPreventReloadTimer");
if(this.preventReloadResetTimer) {
clearTimeout(this.preventReloadResetTimer);
this.preventReloadResetTimer = null;
@@ -634,12 +649,14 @@ export default class ExcalidrawView extends TextFileView {
private editingSelfResetTimer: NodeJS.Timeout = null;
public async setEmbeddableIsEditingSelf() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.setEmbeddableIsEditingSelf, "ExcalidrawView.setEmbeddableIsEditingSelf");
this.clearEmbeddableIsEditingSelfTimer();
await this.forceSave(true);
this.semaphores.embeddableIsEditingSelf = true;
}
public clearEmbeddableIsEditingSelfTimer () {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.clearEmbeddableIsEditingSelfTimer, "ExcalidrawView.clearEmbeddableIsEditingSelfTimer");
if(this.editingSelfResetTimer) {
clearTimeout(this.editingSelfResetTimer);
this.editingSelfResetTimer = null;
@@ -647,12 +664,19 @@ export default class ExcalidrawView extends TextFileView {
}
public clearEmbeddableIsEditingSelf() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.clearEmbeddableIsEditingSelf, "ExcalidrawView.clearEmbeddableIsEditingSelf");
const self = this;
this.clearEmbeddableIsEditingSelfTimer();
this.editingSelfResetTimer = setTimeout(()=>self.semaphores.embeddableIsEditingSelf = false,EMBEDDABLE_SEMAPHORE_TIMEOUT);
}
async save(preventReload: boolean = true, forcesave: boolean = false) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.save, "ExcalidrawView.save, enter", preventReload, forcesave);
/*if(this.semaphores.viewunload && (this.ownerWindow !== window)) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.save, `ExcalidrawView.save, view is unloading, aborting save`);
return;
}*/
if(!this.isLoaded) {
return;
}
@@ -665,12 +689,13 @@ export default class ExcalidrawView extends TextFileView {
return;
}
this.semaphores.saving = true;
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.save, `ExcalidrawView.save, saving, dirty:${this.isDirty()}, preventReload:${preventReload}, forcesave:${forcesave}`);
//if there were no changes to the file super save will not save
//and consequently main.ts modifyEventHandler will not fire
//this.reload will not be called
//triggerReload is used to flag if there were no changes but file should be reloaded anyway
let triggerReload:boolean = false;
let triggerReload:boolean = false;
if (
!this.excalidrawAPI ||
@@ -684,7 +709,7 @@ export default class ExcalidrawView extends TextFileView {
try {
const allowSave = this.isDirty() || forcesave; //removed this.semaphores.autosaving
DEBUGGING && debug(this.save, `ExcalidrawView.save, allowSave:${allowSave}, isDirty:${this.isDirty()}, isAutosaving:${this.semaphores.autosaving}, isForceSaving:${forcesave}`);
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.save, `ExcalidrawView.save, try saving, allowSave:${allowSave}, isDirty:${this.isDirty()}, isAutosaving:${this.semaphores.autosaving}, isForceSaving:${forcesave}`);
if (allowSave) {
const scene = this.getScene();
@@ -769,6 +794,7 @@ export default class ExcalidrawView extends TextFileView {
// if drawing is in Text Element Edit Unlock, then everything is raw and parse and so an async function is not required here
getViewData() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.getViewData, "ExcalidrawView.getViewData");
if (!this.excalidrawAPI || !this.excalidrawData.loaded) {
return this.data;
}
@@ -822,6 +848,7 @@ export default class ExcalidrawView extends TextFileView {
private hiddenMobileLeaves:[WorkspaceLeaf,string][] = [];
restoreMobileLeaves() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.restoreMobileLeaves, "ExcalidrawView.restoreMobileLeaves");
if(this.hiddenMobileLeaves.length>0) {
this.hiddenMobileLeaves.forEach((x:[WorkspaceLeaf,string])=>{
//@ts-ignore
@@ -832,24 +859,28 @@ export default class ExcalidrawView extends TextFileView {
}
toggleDisableBinding() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.toggleDisableBinding, "ExcalidrawView.toggleDisableBinding");
const newState = !this.excalidrawAPI.getAppState().invertBindingBehaviour;
this.updateScene({appState: {invertBindingBehaviour:newState}});
new Notice(newState ? "Inverted Mode: Default arrow binding is now disabled. Use CTRL/CMD to temporarily enable binding when needed." : "Normal Mode: Arrow binding is now enabled. Use CTRL/CMD to temporarily disable binding when needed.");
}
toggleFrameRendering() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.toggleFrameRendering, "ExcalidrawView.toggleFrameRendering");
const frameRenderingSt = (this.excalidrawAPI as ExcalidrawImperativeAPI).getAppState().frameRendering;
this.updateScene({appState: {frameRendering: {...frameRenderingSt, enabled: !frameRenderingSt.enabled}}});
new Notice(frameRenderingSt.enabled ? "Frame Rendering: Enabled" : "Frame Rendering: Disabled");
}
toggleFrameClipping() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.toggleFrameClipping, "ExcalidrawView.toggleFrameClipping");
const frameRenderingSt = (this.excalidrawAPI as ExcalidrawImperativeAPI).getAppState().frameRendering;
this.updateScene({appState: {frameRendering: {...frameRenderingSt, clip: !frameRenderingSt.clip}}});
new Notice(frameRenderingSt.clip ? "Frame Clipping: Enabled" : "Frame Clipping: Disabled");
}
gotoFullscreen() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.gotoFullscreen, "ExcalidrawView.gotoFullscreen");
if(this.plugin.leafChangeTimeout) {
clearTimeout(this.plugin.leafChangeTimeout);
this.plugin.leafChangeTimeout = null;
@@ -900,10 +931,12 @@ export default class ExcalidrawView extends TextFileView {
isFullscreen(): boolean {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.isFullscreen, "ExcalidrawView.isFullscreen");
return Boolean(document.body.querySelector(".excalidraw-hidden"));
}
exitFullscreen() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.exitFullscreen, "ExcalidrawView.exitFullscreen");
if (this.toolsPanelRef && this.toolsPanelRef.current) {
this.toolsPanelRef.current.setFullscreen(false);
}
@@ -913,6 +946,7 @@ export default class ExcalidrawView extends TextFileView {
}
removeLinkTooltip() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.removeLinkTooltip, "ExcalidrawView.removeLinkTooltip");
//.classList.remove("excalidraw-tooltip--visible");document.querySelector(".excalidraw-tooltip",);
const tooltip = this.ownerDocument.body.querySelector(
"body>div.excalidraw-tooltip,div.excalidraw-tooltip--visible",
@@ -924,6 +958,7 @@ export default class ExcalidrawView extends TextFileView {
}
handleLinkHookCall(element:ExcalidrawElement,link:string, event:any):boolean {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.handleLinkHookCall, "ExcalidrawView.handleLinkHookCall", element, link, event);
if(this.getHookServer().onLinkClickHook) {
try {
if(!this.getHookServer().onLinkClickHook(
@@ -949,6 +984,7 @@ export default class ExcalidrawView extends TextFileView {
linkText: string,
selectedElement: ExcalidrawElement,
} {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.getLinkTextForElement, "ExcalidrawView.getLinkTextForElement", selectedText, selectedElementWithLink);
if (selectedText?.id || selectedElementWithLink?.id) {
const selectedTextElement: ExcalidrawTextElement = selectedText.id
? this.excalidrawAPI.getSceneElements().find((el:ExcalidrawElement)=>el.id === selectedText.id)
@@ -989,6 +1025,7 @@ export default class ExcalidrawView extends TextFileView {
selectedElementWithLink: SelectedElementWithLink,
keys?: ModifierKeys
) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.linkClick, "ExcalidrawView.linkClick", ev, selectedText, selectedImage, selectedElementWithLink, keys);
if(!selectedText) selectedText = {id:null, text: null};
if(!selectedImage) selectedImage = {id:null, fileId: null};
if(!selectedElementWithLink) selectedElementWithLink = {id:null, text:null};
@@ -1188,6 +1225,7 @@ export default class ExcalidrawView extends TextFileView {
}
async handleLinkClick(ev: MouseEvent | ModifierKeys) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.handleLinkClick, "ExcalidrawView.handleLinkClick", ev);
this.removeLinkTooltip();
const selectedText = this.getSelectedTextElement();
@@ -1208,6 +1246,7 @@ export default class ExcalidrawView extends TextFileView {
}
onResize() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.onResize, "ExcalidrawView.onResize");
if(this.plugin.leafChangeTimeout) return; //https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/723
const api = this.excalidrawAPI;
if (
@@ -1240,6 +1279,7 @@ export default class ExcalidrawView extends TextFileView {
wheelEvent: (ev:WheelEvent)=>void;
public async forceSave(silent:boolean=false) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.forceSave, "ExcalidrawView.forceSave");
if (this.semaphores.autosaving || this.semaphores.saving) {
if(!silent) new Notice("Force Save aborted because saving is in progress)")
return;
@@ -1258,6 +1298,7 @@ export default class ExcalidrawView extends TextFileView {
}
onload() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.onload, "ExcalidrawView.onload");
const apiMissing = Boolean(typeof this.containerEl.onWindowMigrated === "undefined")
//@ts-ignore
if(!DEVICE.isMobile && !apiMissing) this.containerEl.onWindowMigrated(()=>this.leaf.rebuildView());
@@ -1307,7 +1348,7 @@ export default class ExcalidrawView extends TextFileView {
const self = this;
this.app.workspace.onLayoutReady(async () => {
DEBUGGING && debug(self.onload,`ExcalidrawView.onload > app.workspace.onLayoutReady, file:${self.file?.name}, isActiveLeaf:${self.app.workspace.activeLeaf === self.leaf}, is activeExcalidrawView set:${Boolean(self.plugin.activeExcalidrawView)}`);
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(self.onload,`ExcalidrawView.onload > app.workspace.onLayoutReady, file:${self.file?.name}, isActiveLeaf:${self.app.workspace.activeLeaf === self.leaf}, is activeExcalidrawView set:${Boolean(self.plugin.activeExcalidrawView)}`);
//implemented to overcome issue that activeLeafChangeEventHandler is not called when view is initialized from a saved workspace, since Obsidian 1.6.0
let counter = 0;
while(counter++<50 && !Boolean(self.plugin.activeLeafChangeEventHandler)) {
@@ -1352,6 +1393,7 @@ export default class ExcalidrawView extends TextFileView {
//https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/9
private slidingPanesListner: ()=>void;
private async addSlidingPanesListner() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.addSlidingPanesListner, "ExcalidrawView.addSlidingPanesListner");
if(!this.plugin.settings.slidingPanesSupport) {
return;
}
@@ -1370,6 +1412,7 @@ export default class ExcalidrawView extends TextFileView {
}
private removeSlidingPanesListner() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.removeSlidingPanesListner, "ExcalidrawView.removeSlidingPanesListner");
if (this.slidingPanesListner) {
(
app.workspace.rootSplit as WorkspaceItem as WorkspaceItemExt
@@ -1381,6 +1424,7 @@ export default class ExcalidrawView extends TextFileView {
private offsetLeft: number = 0;
private offsetTop: number = 0;
private addParentMoveObserver() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.addParentMoveObserver, "ExcalidrawView.addParentMoveObserver");
const parent =
getParentOfClass(this.containerEl, "popover") ??
@@ -1395,7 +1439,7 @@ export default class ExcalidrawView extends TextFileView {
this.offsetTop = parent.offsetTop;
const self = this;
const observerFn = async (m: MutationRecord[]) => {
DEBUGGING && debug(observerFn, `ExcalidrawView.parentMoveObserver, file:${self.file?.name}`);
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(observerFn, `ExcalidrawView.parentMoveObserver, file:${self.file?.name}`);
const target = m[0].target;
if (!(target instanceof HTMLElement)) {
return;
@@ -1422,12 +1466,14 @@ export default class ExcalidrawView extends TextFileView {
}
private removeParentMoveObserver() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.removeParentMoveObserver, "ExcalidrawView.removeParentMoveObserver");
if (this.parentMoveObserver) {
this.parentMoveObserver.disconnect();
}
}
public setTheme(theme: string) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.setTheme, "ExcalidrawView.setTheme", theme);
const api = this.excalidrawAPI;
if (!api) {
return;
@@ -1453,6 +1499,7 @@ export default class ExcalidrawView extends TextFileView {
private prevTextMode: TextMode;
private blockTextModeChange: boolean = false;
public async changeTextMode(textMode: TextMode, reload: boolean = true) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.changeTextMode, "ExcalidrawView.changeTextMode", textMode, reload);
if(this.compatibilityMode) return;
if(this.blockTextModeChange) return;
this.blockTextModeChange = true;
@@ -1482,6 +1529,7 @@ export default class ExcalidrawView extends TextFileView {
public autosaveFunction: Function;
public setupAutosaveTimer() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.setupAutosaveTimer, "ExcalidrawView.setupAutosaveTimer");
const timer = async () => {
if(!this.isLoaded) {
this.autosaveTimer = setTimeout(
@@ -1541,6 +1589,7 @@ export default class ExcalidrawView extends TextFileView {
private resetAutosaveTimer() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.resetAutosaveTimer, "ExcalidrawView.resetAutosaveTimer");
if(!this.autosaveFunction) return;
if (this.autosaveTimer) {
@@ -1554,7 +1603,25 @@ export default class ExcalidrawView extends TextFileView {
}
//save current drawing when user closes workspace leaf
unload(): void {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.unload,`ExcalidrawView.unload, file:${this.file?.name}`);
this.lastSceneSnapshot = this.getScene();
super.unload();
}
onUnloadFile(): Promise<void> {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.onUnloadFile,`ExcalidrawView.onUnloadFile, file:${this.file?.name}`);
return;
}
//onClose happens after onunload
protected async onClose(): Promise<void> {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.onClose,`ExcalidrawView.onClose, file:${this.file?.name}`);
await super.onClose();
return;
}
//onunload is called first
onunload() {
this.restoreMobileLeaves();
this.semaphores.viewunload = true;
@@ -1586,11 +1653,11 @@ export default class ExcalidrawView extends TextFileView {
const plugin = this.plugin;
if (path) {
setTimeout(() => {
DEBUGGING && debug(this.onunload,`ExcalidrawView.onunload > timeout, calling triggerEmbedUpdates`);
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.onunload,`ExcalidrawView.onunload > timeout, calling triggerEmbedUpdates`);
plugin.triggerEmbedUpdates(path);
}, 300);
}
DEBUGGING && debug(this.onunload,`ExcalidrawView.onunload, completed`);
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.onunload,`ExcalidrawView.onunload, completed`);
}
/**
@@ -1604,6 +1671,7 @@ export default class ExcalidrawView extends TextFileView {
* @returns
*/
public async reload(fullreload: boolean = false, file?: TFile) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.reload,`ExcalidrawView.reload, file:${this.file?.name}, fullreload:${fullreload}, file:${file?.name}`);
const loadOnModifyTrigger = file && file === this.file;
//once you've finished editing the embeddable, the first time the file
@@ -1655,6 +1723,7 @@ export default class ExcalidrawView extends TextFileView {
}
async zoomToElementId(id: string, hasGroupref:boolean) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.zoomToElementId, "ExcalidrawView.zoomToElementId", id, hasGroupref);
let counter = 0;
while (!this.excalidrawAPI && counter++<100) await sleep(50); //https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/734
const api = this.excalidrawAPI;
@@ -1684,6 +1753,7 @@ export default class ExcalidrawView extends TextFileView {
}
setEphemeralState(state: any): void {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.setEphemeralState, "ExcalidrawView.setEphemeralState", state);
if (!state) {
return;
}
@@ -1727,7 +1797,7 @@ export default class ExcalidrawView extends TextFileView {
setTimeout(async () => {
await waitForExcalidraw();
if(filenameParts.blockref && !filenameParts.hasGroupref) {
if(!self.getScene()?.elements.find(el=>el.id === filenameParts.blockref)) {
if(!self.getScene()?.elements.find((el:ExcalidrawElement)=>el.id === filenameParts.blockref)) {
const cleanQuery = cleanSectionHeading(filenameParts.blockref).replaceAll(" ","");
const blocks = await self.getBackOfTheNoteBlocks();
if(blocks.includes(cleanQuery)) {
@@ -1802,6 +1872,7 @@ export default class ExcalidrawView extends TextFileView {
// clear the view content
clear() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.clear, "ExcalidrawView.clear");
this.canvasNodeFactory.purgeNodes();
this.embeddableRefs.clear();
this.embeddableLeafRefs.clear();
@@ -1822,6 +1893,7 @@ export default class ExcalidrawView extends TextFileView {
public isLoaded: boolean = false;
async setViewData(data: string, clear: boolean = false) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.setViewData, "ExcalidrawView.setViewData", data, clear);
//I am using last loaded file to control when the view reloads.
//It seems text file view gets the modified file event after sync before the modifyEventHandler in main.ts
//reload can only be triggered via reload()
@@ -1850,7 +1922,7 @@ export default class ExcalidrawView extends TextFileView {
data = this.data = data.replaceAll("\r\n", "\n").replaceAll("\r", "\n");
const self = this;
this.app.workspace.onLayoutReady(async () => {
DEBUGGING && debug(self.setViewData, `ExcalidrawView.setViewData > app.workspace.onLayoutReady, file:${self.file?.name}, isActiveLeaf:${self.app.workspace.activeLeaf === self.leaf}`);
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(self.setViewData, `ExcalidrawView.setViewData > app.workspace.onLayoutReady, file:${self.file?.name}, isActiveLeaf:${self.app.workspace.activeLeaf === self.leaf}`);
let counter = 0;
while (!self.file && counter++<50) await sleep(50);
if(!self.file) return;
@@ -1972,6 +2044,7 @@ export default class ExcalidrawView extends TextFileView {
}
private getGridColor(bgColor: string, st: AppState):{Bold: string, Regular: string, MajorGridFrequency: number} {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.getGridColor, "ExcalidrawView.getGridColor", bgColor, st);
const cm = this.plugin.ea.getCM(bgColor);
const isDark = cm.isDark();
const Regular = (isDark ? cm.lighterBy(7) : cm.darkerBy(7)).stringHEX();
@@ -1982,6 +2055,7 @@ export default class ExcalidrawView extends TextFileView {
public activeLoader: EmbeddedFilesLoader = null;
private nextLoader: EmbeddedFilesLoader = null;
public async loadSceneFiles(isThemeChange: boolean = false) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.loadSceneFiles, "ExcalidrawView.loadSceneFiles", isThemeChange);
if (!this.excalidrawAPI) {
return;
}
@@ -2028,6 +2102,7 @@ export default class ExcalidrawView extends TextFileView {
}
public async synchronizeWithData(inData: ExcalidrawData) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.synchronizeWithData, "ExcalidrawView.synchronizeWithData", inData);
if(this.semaphores.embeddableIsEditingSelf) {
return;
}
@@ -2173,7 +2248,8 @@ export default class ExcalidrawView extends TextFileView {
*
* @param justloaded - a flag to trigger zoom to fit after the drawing has been loaded
*/
private async loadDrawing(justloaded: boolean, deletedElements?: ExcalidrawElement[]) {
private async loadDrawing(justloaded: boolean, deletedElements?: ExcalidrawElement[]) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.loadDrawing, "ExcalidrawView.loadDrawing", justloaded, deletedElements);
const excalidrawData = this.excalidrawData.scene;
this.semaphores.justLoaded = justloaded;
this.initialContainerSizeUpdate = justloaded;
@@ -2269,6 +2345,7 @@ export default class ExcalidrawView extends TextFileView {
}
isEditedAsMarkdownInOtherView(): boolean {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.isEditedAsMarkdownInOtherView, "ExcalidrawView.isEditedAsMarkdownInOtherView");
//if the user is editing the same file in markdown mode, do not compress it
const leaves = app.workspace.getLeavesOfType("markdown");
return (
@@ -2278,6 +2355,7 @@ export default class ExcalidrawView extends TextFileView {
}
private onAfterLoadScene() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.onAfterLoadScene, "ExcalidrawView.onAfterLoadScene");
this.loadSceneFiles();
this.updateContainerSize(null, true);
this.initializeToolsIconPanelAfterLoading();
@@ -2285,7 +2363,7 @@ export default class ExcalidrawView extends TextFileView {
public setDirty(location?:number) {
if(this.semaphores.saving) return; //do not set dirty if saving
DEBUGGING && debug(this.setDirty,`ExcalidrawView.setDirty, location:${location}`);
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.setDirty,`ExcalidrawView.setDirty, location:${location}`);
this.semaphores.dirty = this.file?.path;
this.diskIcon.querySelector("svg").addClass("excalidraw-dirty");
if(!this.semaphores.viewunload && this.toolsPanelRef?.current) {
@@ -2304,6 +2382,7 @@ export default class ExcalidrawView extends TextFileView {
}
public clearDirty() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.clearDirty,`ExcalidrawView.clearDirty`);
if(this.semaphores.viewunload) return;
const api = this.excalidrawAPI;
if (!api) {
@@ -2327,6 +2406,7 @@ export default class ExcalidrawView extends TextFileView {
}
public async initializeToolsIconPanelAfterLoading() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.initializeToolsIconPanelAfterLoading,`ExcalidrawView.initializeToolsIconPanelAfterLoading`);
if(this.semaphores.viewunload) return;
const api = this.excalidrawAPI;
if (!api) {
@@ -2360,6 +2440,7 @@ export default class ExcalidrawView extends TextFileView {
// gets the title of the document
getDisplayText() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.getDisplayText, "ExcalidrawView.getDisplayText", this.file?.basename ?? "NOFILE");
if (this.file) {
return this.file.basename;
}
@@ -2377,11 +2458,13 @@ export default class ExcalidrawView extends TextFileView {
}
setMarkdownView(eState?: any) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.setMarkdownView, "ExcalidrawView.setMarkdownView", eState);
this.plugin.excalidrawFileModes[this.id || this.file.path] = "markdown";
this.plugin.setMarkdownView(this.leaf, eState);
}
public async openAsMarkdown(eState?: any) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.openAsMarkdown, "ExcalidrawView.openAsMarkdown", eState);
if (this.plugin.settings.compress && this.plugin.settings.decompressForMDView) {
this.excalidrawData.disableCompression = true;
await this.save(true, true);
@@ -2390,6 +2473,7 @@ export default class ExcalidrawView extends TextFileView {
}
public async convertExcalidrawToMD() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.convertExcalidrawToMD, "ExcalidrawView.convertExcalidrawToMD");
await this.save();
const file = await this.plugin.convertSingleExcalidrawToMD(this.file);
await sleep(250); //dirty hack to wait for Obsidian metadata to be updated
@@ -2401,6 +2485,7 @@ export default class ExcalidrawView extends TextFileView {
}
public convertTextElementToMarkdown(textElement: ExcalidrawTextElement, containerElement: ExcalidrawElement) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.convertTextElementToMarkdown, "ExcalidrawView.convertTextElementToMarkdown", textElement, containerElement);
if(!textElement) return;
const prompt = new Prompt(
this.app,
@@ -2449,6 +2534,7 @@ export default class ExcalidrawView extends TextFileView {
}
async addYouTubeThumbnail(link:string) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.addYouTubeThumbnail, "ExcalidrawView.addYouTubeThumbnail", link);
const thumbnailLink = await getYouTubeThumbnailLink(link);
const ea = getEA(this) as ExcalidrawAutomate;
const id = await ea.addImage(0,0,thumbnailLink);
@@ -2458,12 +2544,14 @@ export default class ExcalidrawView extends TextFileView {
}
async addImageWithURL(link:string) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.addImageWithURL, "ExcalidrawView.addImageWithURL", link);
const ea = getEA(this) as ExcalidrawAutomate;
await ea.addImage(0,0,link);
ea.addElementsToView(true,true,true);
}
async addImageSaveToVault(link:string) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.addImageSaveToVault, "ExcalidrawView.addImageSaveToVault", link);
const ea = getEA(this) as ExcalidrawAutomate;
const mimeType = getMimeType(getURLImageExtension(link));
const dataURL = await getDataURLFromURL(link,mimeType,3000);
@@ -2478,6 +2566,7 @@ export default class ExcalidrawView extends TextFileView {
}
async addTextWithIframely(text:string) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.addTextWithIframely, "ExcalidrawView.addTextWithIframely", text);
const id = await this.addText(text);
const url = `http://iframely.server.crestify.com/iframely?url=${text}`;
try {
@@ -2500,6 +2589,7 @@ export default class ExcalidrawView extends TextFileView {
}
onPaneMenu(menu: Menu, source: string): void {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.onPaneMenu, "ExcalidrawView.onPaneMenu", menu, source);
if(this.excalidrawAPI && this.getViewSelectedElements().some(el=>el.type==="text")) {
menu.addItem(item => {
item
@@ -2572,6 +2662,7 @@ export default class ExcalidrawView extends TextFileView {
private colorChangeTimer:NodeJS.Timeout = null;
public setCurrentPositionToCenter(){
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.setCurrentPositionToCenter, "ExcalidrawView.setCurrentPositionToCenter");
const api = this.excalidrawAPI as ExcalidrawImperativeAPI;
if (!api) {
return;
@@ -2588,6 +2679,7 @@ export default class ExcalidrawView extends TextFileView {
};
private getSelectedTextElement(): SelectedElementWithLink{
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.getSelectedTextElement, "ExcalidrawView.getSelectedTextElement");
const api = this.excalidrawAPI;
if (!api) {
return { id: null, text: null };
@@ -2649,6 +2741,7 @@ export default class ExcalidrawView extends TextFileView {
};
private getSelectedImageElement(): SelectedImage {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.getSelectedImageElement, "ExcalidrawView.getSelectedImageElement");
const api = this.excalidrawAPI;
if (!api) {
return { id: null, fileId: null };
@@ -2696,6 +2789,7 @@ export default class ExcalidrawView extends TextFileView {
};
private getSelectedElementWithLink(): { id: string; text: string } {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.getSelectedElementWithLink, "ExcalidrawView.getSelectedElementWithLink");
const api = this.excalidrawAPI;
if (!api) {
return { id: null, text: null };
@@ -2743,6 +2837,7 @@ export default class ExcalidrawView extends TextFileView {
path: string,
alias: string,
) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.addLink, "ExcalidrawView.addLink", markdownlink, path, alias);
const api = this.excalidrawAPI as ExcalidrawImperativeAPI;
const st = api.getAppState();
if(
@@ -2770,6 +2865,7 @@ export default class ExcalidrawView extends TextFileView {
fontFamily?: 1 | 2 | 3 | 4,
save: boolean = true
): Promise<string> {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.addText, "ExcalidrawView.addText", text, fontFamily, save);
const api = this.excalidrawAPI as ExcalidrawImperativeAPI;
if (!api) {
return;
@@ -2813,6 +2909,7 @@ export default class ExcalidrawView extends TextFileView {
newElementsOnTop: boolean = false,
shouldRestoreElements: boolean = false,
): Promise<boolean> {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.addElements, "ExcalidrawView.addElements", newElements, repositionToCursor, save, images, newElementsOnTop, shouldRestoreElements);
const api = this.excalidrawAPI as ExcalidrawImperativeAPI;
if (!api) {
return false;
@@ -2925,6 +3022,10 @@ export default class ExcalidrawView extends TextFileView {
};
public getScene (selectedOnly?: boolean) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.getScene, "ExcalidrawView.getScene", selectedOnly);
if (this.lastSceneSnapshot) {
return this.lastSceneSnapshot;
}
const api = this.excalidrawAPI;
if (!api) {
return null;
@@ -2985,6 +3086,7 @@ export default class ExcalidrawView extends TextFileView {
* @returns
*/
private refreshCanvasOffset() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.refreshCanvasOffset, "ExcalidrawView.refreshCanvasOffset");
if(this.contentEl.clientWidth === 0 || this.contentEl.clientHeight === 0) return;
const api = this.excalidrawAPI;
if (!api) {
@@ -3001,6 +3103,7 @@ export default class ExcalidrawView extends TextFileView {
private clearHoverPreview() {
if (this.hoverPreviewTarget) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.clearHoverPreview, "ExcalidrawView.clearHoverPreview", this);
const event = new MouseEvent("click", {
view: this.ownerWindow,
bubbles: true,
@@ -3012,6 +3115,7 @@ export default class ExcalidrawView extends TextFileView {
};
private dropAction(transfer: DataTransfer) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.dropAction, "ExcalidrawView.dropAction");
// Return a 'copy' or 'link' action according to the content types, or undefined if no recognized type
const files = (app as any).dragManager.draggable?.files;
if (files) {
@@ -3043,6 +3147,7 @@ export default class ExcalidrawView extends TextFileView {
* @returns
*/
private identifyElementClicked () {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.identifyElementClicked, "ExcalidrawView.identifyElementClicked");
this.selectedTextElement = getTextElementAtPointer(this.currentPosition, this);
if (this.selectedTextElement && this.selectedTextElement.id) {
const event = new MouseEvent("click", {
@@ -3083,6 +3188,7 @@ export default class ExcalidrawView extends TextFileView {
};
private showHoverPreview(linktext?: string, element?: ExcalidrawElement) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.showHoverPreview, "ExcalidrawView.showHoverPreview", linktext, element);
if(!this.lastMouseEvent) return;
const st = this.excalidrawAPI?.getAppState();
if(st?.editingElement || st?.draggingElement) return; //should not activate hover preview when element is being edited or dragged
@@ -3210,6 +3316,7 @@ export default class ExcalidrawView extends TextFileView {
);
private excalidrawDIVonKeyDown(event: KeyboardEvent) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.excalidrawDIVonKeyDown, "ExcalidrawView.excalidrawDIVonKeyDown", event);
if (event.target === this.excalidrawWrapperRef.current) {
return;
} //event should originate from the canvas
@@ -3334,6 +3441,7 @@ export default class ExcalidrawView extends TextFileView {
}
private canvasColorChangeHook(st: AppState) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.canvasColorChangeHook, "ExcalidrawView.canvasColorChangeHook", st);
const canvasColor = st.viewBackgroundColor === "transparent" ? "white" : st.viewBackgroundColor;
setTimeout(()=>this.updateScene({appState:{gridColor: this.getGridColor(canvasColor, st)}}));
setDynamicStyle(this.plugin.ea,this,canvasColor,this.plugin.settings.dynamicStyling);
@@ -3410,6 +3518,7 @@ export default class ExcalidrawView extends TextFileView {
}
private onLibraryChange(items: LibraryItems) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.onLibraryChange, "ExcalidrawView.onLibraryChange", items);
(async () => {
const lib = {
type: "excalidrawlib",
@@ -3423,6 +3532,7 @@ export default class ExcalidrawView extends TextFileView {
}
private onPaste (data: ClipboardData, event: ClipboardEvent | null) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.onPaste, "ExcalidrawView.onPaste", data, event);
const ea = this.getHookServer();
if(data && ea.onPasteHook) {
const res = ea.onPasteHook({
@@ -3443,7 +3553,7 @@ export default class ExcalidrawView extends TextFileView {
&& event !== null
&& DEVICE.isLinux
) {
DEBUGGING && debug(this.onPaste,`ExcalidrawView.onPaste, Prevented what is likely middle mouse button paste.`);
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.onPaste,`ExcalidrawView.onPaste, Prevented what is likely middle mouse button paste.`);
return false;
};
@@ -3487,6 +3597,7 @@ export default class ExcalidrawView extends TextFileView {
}
private async onThemeChange (newTheme: string) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.onThemeChange, "ExcalidrawView.onThemeChange", newTheme);
//debug({where:"ExcalidrawView.onThemeChange",file:this.file.name,before:"this.loadSceneFiles",newTheme});
this.excalidrawData.scene.appState.theme = newTheme;
this.loadSceneFiles(true);
@@ -3496,6 +3607,7 @@ export default class ExcalidrawView extends TextFileView {
}
private onDrop (event: React.DragEvent<HTMLDivElement>): boolean {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.onDrop, "ExcalidrawView.onDrop", event);
if(this.draginfoDiv) {
this.ownerDocument.body.removeChild(this.draginfoDiv);
delete this.draginfoDiv;
@@ -3907,6 +4019,7 @@ export default class ExcalidrawView extends TextFileView {
//returns the raw text of the element which is the original text without parsing
//in compatibility mode, returns the original text, and for backward compatibility the text if originalText is not available
private onBeforeTextEdit (textElement: ExcalidrawTextElement) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.onBeforeTextEdit, "ExcalidrawView.onBeforeTextEdit", textElement);
clearTimeout(this.isEditingTextResetTimer);
this.isEditingTextResetTimer = null;
this.semaphores.isEditingText = true; //to prevent autoresize on mobile when keyboard pops up
@@ -3927,6 +4040,7 @@ export default class ExcalidrawView extends TextFileView {
nextOriginalText: string,
isDeleted: boolean,
): {updatedNextOriginalText: string, nextLink: string} {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.onBeforeTextSubmit, "ExcalidrawView.onBeforeTextSubmit", textElement, nextText, nextOriginalText, isDeleted);
const api = this.excalidrawAPI;
if (!api) {
return {updatedNextOriginalText: null, nextLink: null};
@@ -4100,6 +4214,7 @@ export default class ExcalidrawView extends TextFileView {
}
private async onLinkOpen(element: ExcalidrawElement, e: any): Promise<void> {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.onLinkOpen, "ExcalidrawView.onLinkOpen", element, e);
e.preventDefault();
if (!element) {
return;
@@ -4138,6 +4253,7 @@ export default class ExcalidrawView extends TextFileView {
}
private onLinkHover(element: NonDeletedExcalidrawElement, event: React.PointerEvent<HTMLCanvasElement>): void {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.onLinkHover, "ExcalidrawView.onLinkHover", element, event);
if (
element &&
(this.plugin.settings.hoverPreviewWithoutCTRL ||
@@ -4162,6 +4278,7 @@ export default class ExcalidrawView extends TextFileView {
}
private onViewModeChange(isViewModeEnabled: boolean) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.onViewModeChange, "ExcalidrawView.onViewModeChange", isViewModeEnabled);
if(!this.semaphores.viewunload) {
this.toolsPanelRef?.current?.setExcalidrawViewMode(
isViewModeEnabled,
@@ -4178,6 +4295,7 @@ export default class ExcalidrawView extends TextFileView {
}
private async getBackOfTheNoteSections() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.getBackOfTheNoteSections, "ExcalidrawView.getBackOfTheNoteSections");
return (await this.app.metadataCache.blockCache.getForFile({ isCancelled: () => false },this.file))
.blocks.filter((b: any) => b.display && b.node?.type === "heading")
.filter((b: any) => !MD_EX_SECTIONS.includes(b.display))
@@ -4185,12 +4303,14 @@ export default class ExcalidrawView extends TextFileView {
}
private async getBackOfTheNoteBlocks() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.getBackOfTheNoteBlocks, "ExcalidrawView.getBackOfTheNoteBlocks");
return (await this.app.metadataCache.blockCache.getForFile({ isCancelled: () => false },this.file))
.blocks.filter((b:any) => b.display && b.node && b.node.hasOwnProperty("type") && b.node.hasOwnProperty("id"))
.map((b:any) => cleanBlockRef(b.node.id));
}
public getSingleSelectedImage(): {imageEl: ExcalidrawImageElement, embeddedFile: EmbeddedFile} {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.getSingleSelectedImage, "ExcalidrawView.getSingleSelectedImage");
if(!this.excalidrawAPI) return null;
const els = this.getViewSelectedElements().filter(el=>el.type==="image");
if(els.length !== 1) {
@@ -4202,12 +4322,14 @@ export default class ExcalidrawView extends TextFileView {
}
public async insertBackOfTheNoteCard() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.insertBackOfTheNoteCard, "ExcalidrawView.insertBackOfTheNoteCard");
const sections = await this.getBackOfTheNoteSections();
const selectCardDialog = new SelectCard(this.app,this,sections);
selectCardDialog.start();
}
public async convertImageElWithURLToLocalFile(data: {imageEl: ExcalidrawImageElement, embeddedFile: EmbeddedFile}) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.convertImageElWithURLToLocalFile, "ExcalidrawView.convertImageElWithURLToLocalFile", data);
const {imageEl, embeddedFile} = data;
const imageDataURL = embeddedFile.getImage(false);
if(!imageDataURL && !imageDataURL.startsWith("data:")) {
@@ -4249,6 +4371,7 @@ export default class ExcalidrawView extends TextFileView {
libraryItems: any
}
) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.instantiateExcalidraw, "ExcalidrawView.instantiateExcalidraw", initdata);
while(!this.semaphores.scriptsReady) {
await sleep(50);
}
@@ -4607,7 +4730,7 @@ export default class ExcalidrawView extends TextFileView {
}
const json = response.json;
DEBUGGING && debug(ttdDialog, `ExcalidrawView.ttdDialog > onTextSubmit, openAI response`, response);
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(ttdDialog, `ExcalidrawView.ttdDialog > onTextSubmit, openAI response`, response);
if (json?.error) {
log(response);
@@ -4946,6 +5069,7 @@ export default class ExcalidrawView extends TextFileView {
}
private updateContainerSize(containerId?: string, delay: boolean = false) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.updateContainerSize, "ExcalidrawView.updateContainerSize", containerId, delay);
//console.log("updateContainerSize", containerId);
const api = this.excalidrawAPI;
if (!api) {
@@ -4977,6 +5101,7 @@ export default class ExcalidrawView extends TextFileView {
}
public zoomToFit(delay: boolean = true, justLoaded: boolean = false) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.zoomToFit, "ExcalidrawView.zoomToFit", delay, justLoaded);
const modalContainer = document.body.querySelector("div.modal-container");
if(modalContainer) return; //do not autozoom when the command palette or other modal container is envoked on iPad
const api = this.excalidrawAPI;
@@ -5001,6 +5126,7 @@ export default class ExcalidrawView extends TextFileView {
}
public updatePinnedScripts() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.updatePinnedScripts, "ExcalidrawView.updatePinnedScripts");
const api = this.excalidrawAPI as ExcalidrawImperativeAPI;
if (!api) {
return false;
@@ -5011,6 +5137,7 @@ export default class ExcalidrawView extends TextFileView {
}
public updatePinnedCustomPens() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.updatePinnedCustomPens, "ExcalidrawView.updatePinnedCustomPens");
const api = this.excalidrawAPI as ExcalidrawImperativeAPI;
if (!api) {
return false;
@@ -5023,6 +5150,7 @@ export default class ExcalidrawView extends TextFileView {
}
public updatePinchZoom() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.updatePinchZoom, "ExcalidrawView.updatePinchZoom");
const api = this.excalidrawAPI as ExcalidrawImperativeAPI;
if (!api) {
return false;
@@ -5033,6 +5161,7 @@ export default class ExcalidrawView extends TextFileView {
}
public updateWheelZoom() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.updateWheelZoom, "ExcalidrawView.updateWheelZoom");
const api = this.excalidrawAPI as ExcalidrawImperativeAPI;
if (!api) {
return false;
@@ -5043,6 +5172,7 @@ export default class ExcalidrawView extends TextFileView {
}
public async toggleTrayMode() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.toggleTrayMode, "ExcalidrawView.toggleTrayMode");
const api = this.excalidrawAPI as ExcalidrawImperativeAPI;
if (!api) {
return false;
@@ -5075,6 +5205,7 @@ export default class ExcalidrawView extends TextFileView {
exactMatch: boolean = false, //https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/530
selectGroup: boolean = false,
):boolean {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.selectElementsMatchingQuery, "ExcalidrawView.selectElementsMatchingQuery", query, selectResult, exactMatch, selectGroup);
let match = getTextElementsMatchingQuery(
elements.filter((el: ExcalidrawElement) => el.type === "text"),
query,
@@ -5105,6 +5236,7 @@ export default class ExcalidrawView extends TextFileView {
selectResult: boolean,
elements: ExcalidrawElement[]
) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.zoomToElements, "ExcalidrawView.zoomToElements", selectResult, elements);
const api = this.excalidrawAPI;
if (!api) return;
@@ -5116,6 +5248,7 @@ export default class ExcalidrawView extends TextFileView {
}
public getViewElements(): ExcalidrawElement[] {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.getViewElements, "ExcalidrawView.getViewElements");
const api = this.excalidrawAPI;
if (!api) {
return [];
@@ -5124,6 +5257,7 @@ export default class ExcalidrawView extends TextFileView {
}
public getViewSelectedElements(): ExcalidrawElement[] {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.getViewSelectedElements, "ExcalidrawView.getViewSelectedElements");
const api = this.excalidrawAPI;
if (!api) {
return [];
@@ -5163,6 +5297,7 @@ export default class ExcalidrawView extends TextFileView {
}
public async copyLinkToSelectedElementToClipboard(prefix:string) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.copyLinkToSelectedElementToClipboard, "ExcalidrawView.copyLinkToSelectedElementToClipboard", prefix);
const elements = this.getViewSelectedElements();
if (elements.length < 1) {
new Notice(t("INSERT_LINK_TO_ELEMENT_ERROR"));
@@ -5256,6 +5391,7 @@ export default class ExcalidrawView extends TextFileView {
},
shouldRestore: boolean = false,
) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.updateScene, "ExcalidrawView.updateScene", scene, shouldRestore);
const api = this.excalidrawAPI;
if (!api) {
return;
@@ -5295,22 +5431,26 @@ export default class ExcalidrawView extends TextFileView {
}
public updateEmbeddableRef(id: string, ref: HTMLIFrameElement | HTMLWebViewElement | null) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.updateEmbeddableRef, "ExcalidrawView.updateEmbeddableRef", id, ref);
if (ref) {
this.embeddableRefs.set(id, ref);
}
}
public getEmbeddableElementById(id: string): HTMLIFrameElement | HTMLWebViewElement | undefined {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.getEmbeddableElementById, "ExcalidrawView.getEmbeddableElementById", id);
return this.embeddableRefs.get(id);
}
public updateEmbeddableLeafRef(id: string, ref: any) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.updateEmbeddableLeafRef, "ExcalidrawView.updateEmbeddableLeafRef", id, ref);
if(ref) {
this.embeddableLeafRefs.set(id, ref);
}
}
public getEmbeddableLeafElementById(id: string): {leaf: WorkspaceLeaf; node?: ObsidianCanvasNode; editNode?: Function} | null {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.getEmbeddableLeafElementById, "ExcalidrawView.getEmbeddableLeafElementById", id);
const ref = this.embeddableLeafRefs.get(id);
if(!ref) {
return null;
@@ -5319,6 +5459,7 @@ export default class ExcalidrawView extends TextFileView {
}
getActiveEmbeddable = ():{leaf: WorkspaceLeaf; node?: ObsidianCanvasNode; editNode?: Function}|null => {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.getActiveEmbeddable, "ExcalidrawView.getActiveEmbeddable");
if(!this.excalidrawAPI) return null;
const api = this.excalidrawAPI as ExcalidrawImperativeAPI;
const st = api.getAppState();
@@ -5341,6 +5482,7 @@ export default class ExcalidrawView extends TextFileView {
}
export function getTextMode(data: string): TextMode {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(getTextMode, "ExcalidrawView.getTextMode", data);
const parsed =
data.search("excalidraw-plugin: parsed\n") > -1 ||
data.search("excalidraw-plugin: locked\n") > -1; //locked for backward compatibility

95
src/main.ts
View File

@@ -213,6 +213,7 @@ export default class ExcalidrawPlugin extends Plugin {
};
public getPackage(win:Window):Packages {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.getPackage, `ExcalidrawPlugin.getPackage`, win);
if(win===window) {
return {react, reactDOM, excalidrawLib};
}
@@ -231,35 +232,39 @@ export default class ExcalidrawPlugin extends Plugin {
}
public registerEvent(event: any) {
if(!this.settings.isDebugMode) {
if (process.env.NODE_ENV !== 'development') {
super.registerEvent(event);
return;
}
} else {
if(!DEBUGGING) {
super.registerEvent(event);
return;
}
const originalHandler = event.fn;
const originalHandler = event.fn;
// Wrap the original event handler
const wrappedHandler = async (...args: any[]) => {
const startTime = performance.now(); // Get start time
// Invoke the original event handler
const result = await originalHandler(...args);
const endTime = performance.now(); // Get end time
const executionTime = endTime - startTime;
if(executionTime > durationTreshold) {
console.log(`Excalidraw Event '${event.name}' took ${executionTime}ms to execute`);
// Wrap the original event handler
const wrappedHandler = async (...args: any[]) => {
const startTime = performance.now(); // Get start time
// Invoke the original event handler
const result = await originalHandler(...args);
const endTime = performance.now(); // Get end time
const executionTime = endTime - startTime;
if(executionTime > durationTreshold) {
console.log(`Excalidraw Event '${event.name}' took ${executionTime}ms to execute`);
}
return result;
}
return result;
// Replace the original event handler with the wrapped one
event.fn = wrappedHandler;
// Register the modified event
super.registerEvent(event);
};
// Replace the original event handler with the wrapped one
event.fn = wrappedHandler;
// Register the modified event
super.registerEvent(event);
}
async onload() {
@@ -327,7 +332,7 @@ export default class ExcalidrawPlugin extends Plugin {
const self = this;
this.app.workspace.onLayoutReady(() => {
DEBUGGING && debug(self.onload,"ExcalidrawPlugin.onload > app.workspace.onLayoutReady");
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(self.onload,"ExcalidrawPlugin.onload > app.workspace.onLayoutReady");
this.scriptEngine = new ScriptEngine(self);
imageCache.initializeDB(self);
});
@@ -338,7 +343,7 @@ export default class ExcalidrawPlugin extends Plugin {
const app = this.app;
const self = this;
this.app.workspace.onLayoutReady(() => {
DEBUGGING && debug(self.setPropertyTypes, `ExcalidrawPlugin.setPropertyTypes > app.workspace.onLayoutReady`);
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(self.setPropertyTypes, `ExcalidrawPlugin.setPropertyTypes > app.workspace.onLayoutReady`);
Object.keys(FRONTMATTER_KEYS).forEach((key) => {
if(FRONTMATTER_KEYS[key].depricated === true) return;
const {name, type} = FRONTMATTER_KEYS[key];
@@ -350,7 +355,7 @@ export default class ExcalidrawPlugin extends Plugin {
public initializeFonts() {
const self = this;
this.app.workspace.onLayoutReady(async () => {
DEBUGGING && debug(self.initializeFonts,`ExcalidrawPlugin.initializeFonts > app.workspace.onLayoutReady`);
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(self.initializeFonts,`ExcalidrawPlugin.initializeFonts > app.workspace.onLayoutReady`);
const font = await getFontDataURL(
this.app,
this.settings.experimantalFourthFont,
@@ -392,6 +397,7 @@ export default class ExcalidrawPlugin extends Plugin {
}
private getOpenObsidianDocuments(): Document[] {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.getOpenObsidianDocuments,`ExcalidrawPlugin.getOpenObsidianDocuments`);
const visitedDocs = new Set<Document>();
this.app.workspace.iterateAllLeaves((leaf)=>{
const ownerDocument = DEVICE.isMobile?document:leaf.view.containerEl.ownerDocument;
@@ -405,7 +411,7 @@ export default class ExcalidrawPlugin extends Plugin {
private switchToExcalidarwAfterLoad() {
const self = this;
this.app.workspace.onLayoutReady(() => {
DEBUGGING && debug(self.switchToExcalidarwAfterLoad, `ExcalidrawPlugin.switchToExcalidarwAfterLoad > app.workspace.onLayoutReady`);
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(self.switchToExcalidarwAfterLoad, `ExcalidrawPlugin.switchToExcalidarwAfterLoad > app.workspace.onLayoutReady`);
let leaf: WorkspaceLeaf;
for (leaf of this.app.workspace.getLeavesOfType("markdown")) {
if ( leaf.view instanceof MarkdownView && self.isExcalidrawFile(leaf.view.file)) {
@@ -639,7 +645,7 @@ export default class ExcalidrawPlugin extends Plugin {
const self = this;
this.app.workspace.onLayoutReady(() => {
DEBUGGING && debug(self.addMarkdownPostProcessor, `ExcalidrawPlugin.addMarkdownPostProcessor > app.workspace.onLayoutReady`);
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(self.addMarkdownPostProcessor, `ExcalidrawPlugin.addMarkdownPostProcessor > app.workspace.onLayoutReady`);
// internal-link quick preview
self.registerEvent(self.app.workspace.on("hover-link", hoverEvent));
@@ -653,6 +659,7 @@ export default class ExcalidrawPlugin extends Plugin {
public enableLegacyFilePopoverObserver() {
if(!this.legacyExcalidrawPopoverObserver) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.enableLegacyFilePopoverObserver, `ExcalidrawPlugin.enableLegacyFilePopoverObserver > enabling`)
//monitoring for div.popover.hover-popover.file-embed.is-loaded to be added to the DOM tree
this.legacyExcalidrawPopoverObserver = legacyExcalidrawPopoverObserver;
this.legacyExcalidrawPopoverObserver.observe(document.body, { childList: true, subtree: false });
@@ -665,6 +672,7 @@ export default class ExcalidrawPlugin extends Plugin {
if (!matchThemeTrigger) return;
const themeObserverFn:MutationCallback = async (mutations: MutationRecord[]) => {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(themeObserverFn, `ExcalidrawPlugin.addThemeObserver`, mutations);
const { matchThemeTrigger } = this.settings;
if (!matchThemeTrigger) return;
@@ -719,6 +727,7 @@ export default class ExcalidrawPlugin extends Plugin {
* Display characters configured in settings, in front of the filename, if the markdown file is an excalidraw drawing
*/
private experimentalFileTypeDisplay() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.experimentalFileTypeDisplay, `ExcalidrawPlugin.experimentalFileTypeDisplay`);
const insertFiletype = (el: HTMLElement) => {
if (el.childElementCount !== 1) {
return;
@@ -743,6 +752,7 @@ export default class ExcalidrawPlugin extends Plugin {
};
const fileExplorerObserverFn:MutationCallback = (mutationsList) => {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(fileExplorerObserverFn, `ExcalidrawPlugin.experimentalFileTypeDisplay > fileExplorerObserverFn`, mutationsList);
const mutationsWithNodes = mutationsList.filter((mutation) => mutation.addedNodes.length > 0);
mutationsWithNodes.forEach((mutationNode) => {
mutationNode.addedNodes.forEach((node) => {
@@ -760,7 +770,7 @@ export default class ExcalidrawPlugin extends Plugin {
const self = this;
this.app.workspace.onLayoutReady(() => {
DEBUGGING && debug(self.experimentalFileTypeDisplay, `ExcalidrawPlugin.experimentalFileTypeDisplay > app.workspace.onLayoutReady`);
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(self.experimentalFileTypeDisplay, `ExcalidrawPlugin.experimentalFileTypeDisplay > app.workspace.onLayoutReady`);
document.querySelectorAll(".nav-file-title").forEach(insertFiletype); //apply filetype to files already displayed
const container = document.querySelector(".nav-files-container");
if (container) {
@@ -2325,7 +2335,8 @@ export default class ExcalidrawPlugin extends Plugin {
this.register(
around(Workspace.prototype, {
getActiveViewOfType(old) {
return dedupe(key, old, function(...args) {
return dedupe(key, old, function(...args) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.registerMonkeyPatches, `ExcalidrawPlugin.MonkeyPatch >getActiveViewOfType`, key, old, ...args);
const result = old && old.apply(this, args);
const maybeEAView = self.app?.workspace?.activeLeaf?.view;
if(!maybeEAView || !(maybeEAView instanceof ExcalidrawView)) return result;
@@ -2344,7 +2355,7 @@ export default class ExcalidrawPlugin extends Plugin {
})
);
//@ts-ignore
if(!app.plugins?.plugins?.["obsidian-hover-editor"]) {
if(!this.app.plugins?.plugins?.["obsidian-hover-editor"]) {
this.register( //stolen from hover editor
around(WorkspaceLeaf.prototype, {
getRoot(old) {
@@ -2380,6 +2391,7 @@ export default class ExcalidrawPlugin extends Plugin {
this.registerEvent(
app.workspace.on("file-menu", (menu, file, source, leaf) => {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.registerMonkeyPatches, `ExcalidrawPlugin.MonkeyPatch > file-menu`, file, source, leaf);
if (!leaf) return;
const view = leaf.view;
if(!view || !(view instanceof MarkdownView)) return;
@@ -2427,6 +2439,7 @@ export default class ExcalidrawPlugin extends Plugin {
setViewState(next) {
return function (state: ViewState, ...rest: any[]) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.registerMonkeyPatches, `ExcalidrawPlugin.MonkeyPatch > setViewState`, next);
const markdownViewLoaded =
self._loaded && // Don't force excalidraw mode during shutdown
state.type === "markdown" && // If we have a markdown file
@@ -2469,12 +2482,13 @@ export default class ExcalidrawPlugin extends Plugin {
}
private runStartupScript() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.runStartupScript, `ExcalidrawPlugin.runStartupScript`);
if(!this.settings.startupScriptPath || this.settings.startupScriptPath === "") {
return;
}
const self = this;
this.app.workspace.onLayoutReady(async () => {
DEBUGGING && debug(self.runStartupScript, `ExcalidrawPlugin.runStartupScript > app.workspace.onLayoutReady, scriptPath:${self.settings?.startupScriptPath}`);
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(self.runStartupScript, `ExcalidrawPlugin.runStartupScript > app.workspace.onLayoutReady, scriptPath:${self.settings?.startupScriptPath}`);
const path = self.settings.startupScriptPath.endsWith(".md")
? self.settings.startupScriptPath
: `${self.settings.startupScriptPath}.md`;
@@ -2497,7 +2511,7 @@ export default class ExcalidrawPlugin extends Plugin {
private registerEventListeners() {
const self: ExcalidrawPlugin = this;
this.app.workspace.onLayoutReady(async () => {
DEBUGGING && debug(self.registerEventListeners,`ExcalidrawPlugin.registerEventListeners > app.workspace.onLayoutReady`);
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(self.registerEventListeners,`ExcalidrawPlugin.registerEventListeners > app.workspace.onLayoutReady`);
const onPasteHandler = (
evt: ClipboardEvent,
editor: Editor,
@@ -2549,6 +2563,7 @@ export default class ExcalidrawPlugin extends Plugin {
file: TAbstractFile,
oldPath: string,
) => {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(renameEventHandler,`ExcalidrawPlugin.renameEventHandler`, file, oldPath);
if (!(file instanceof TFile)) {
return;
}
@@ -2572,6 +2587,7 @@ export default class ExcalidrawPlugin extends Plugin {
self.registerEvent(app.vault.on("rename", renameEventHandler));
const modifyEventHandler = async (file: TFile) => {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(modifyEventHandler,`ExcalidrawPlugin.modifyEventHandler`, file);
const leaves = this.app.workspace.getLeavesOfType(VIEW_TYPE_EXCALIDRAW);
leaves.forEach(async (leaf: WorkspaceLeaf) => {
const excalidrawView = leaf.view as ExcalidrawView;
@@ -2618,6 +2634,7 @@ export default class ExcalidrawPlugin extends Plugin {
//watch file delete and delete corresponding .svg and .png
const deleteEventHandler = async (file: TFile) => {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(deleteEventHandler,`ExcalidrawPlugin.deleteEventHandler`, file);
if (!(file instanceof TFile)) {
return;
}
@@ -2668,6 +2685,7 @@ export default class ExcalidrawPlugin extends Plugin {
//save Excalidraw leaf and update embeds when switching to another leaf
const activeLeafChangeEventHandler = async (leaf: WorkspaceLeaf) => {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(activeLeafChangeEventHandler,`ExcalidrawPlugin.activeLeafChangeEventHandler`, leaf);
//https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/723
if(self.leafChangeTimeout) {
clearTimeout(self.leafChangeTimeout);
@@ -2848,6 +2866,7 @@ export default class ExcalidrawPlugin extends Plugin {
});
const onFileMenuEventSaveActiveDrawing = () => {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(onFileMenuEventSaveActiveDrawing,`ExcalidrawPlugin.onFileMenuEventSaveActiveDrawing`);
if (
!this.activeExcalidrawView ||
!this.activeExcalidrawView.semaphores.dirty
@@ -2915,6 +2934,7 @@ export default class ExcalidrawPlugin extends Plugin {
}
//The user clicks settings, or "open another vault", or the command palette
const modalContainerObserverFn: MutationCallback = async (m: MutationRecord[]) => {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(modalContainerObserverFn,`ExcalidrawPlugin.modalContainerObserverFn`, m);
if (
(m.length !== 1) ||
(m[0].type !== "childList") ||
@@ -2950,6 +2970,7 @@ export default class ExcalidrawPlugin extends Plugin {
frontmatter?: FrontMatterCache,
deleted: boolean = false,
) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.updateFileCache,`ExcalidrawPlugin.updateFileCache`, file, frontmatter, deleted);
if (frontmatter && typeof frontmatter[FRONTMATTER_KEYS["plugin"].name] !== "undefined") {
this.excalidrawFiles.add(file);
return;
@@ -3086,6 +3107,7 @@ export default class ExcalidrawPlugin extends Plugin {
reEnableAutosave?: boolean
} = {applyLefthandedMode: true, reEnableAutosave: false}
) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.loadSettings,`ExcalidrawPlugin.loadSettings`, opts);
if(typeof opts.applyLefthandedMode === "undefined") opts.applyLefthandedMode = true;
if(typeof opts.reEnableAutosave === "undefined") opts.reEnableAutosave = false;
this.settings = Object.assign({}, DEFAULT_SETTINGS, await this.loadData());
@@ -3107,10 +3129,12 @@ export default class ExcalidrawPlugin extends Plugin {
}
async saveSettings() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.saveSettings,`ExcalidrawPlugin.saveSettings`);
await this.saveData(this.settings);
}
public getStencilLibrary(): {} {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.getStencilLibrary,`ExcalidrawPlugin.getStencilLibrary`);
if (
this.settings.library === "" ||
this.settings.library === "deprecated"
@@ -3121,13 +3145,15 @@ export default class ExcalidrawPlugin extends Plugin {
}
public setStencilLibrary(library: {}) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.setStencilLibrary,`ExcalidrawPlugin.setStencilLibrary`, library);
this.settings.library = "deprecated";
this.settings.library2 = library;
}
public triggerEmbedUpdates(filepath?: string) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.triggerEmbedUpdates,`ExcalidrawPlugin.triggerEmbedUpdates`, filepath);
const visitedDocs = new Set<Document>();
app.workspace.iterateAllLeaves((leaf)=>{
this.app.workspace.iterateAllLeaves((leaf)=>{
const ownerDocument = DEVICE.isMobile?document:leaf.view.containerEl.ownerDocument;
if(!ownerDocument) return;
if(visitedDocs.has(ownerDocument)) return;
@@ -3332,6 +3358,7 @@ export default class ExcalidrawPlugin extends Plugin {
}
public async setExcalidrawView(leaf: WorkspaceLeaf) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.setExcalidrawView,`ExcalidrawPlugin.setExcalidrawView`, leaf);
await leaf.setViewState({
type: VIEW_TYPE_EXCALIDRAW,
state: leaf.view.getState(),

12
src/menu/ToolsPanel.tsx
View File

@@ -16,6 +16,7 @@ import { InsertPDFModal } from "src/dialogs/InsertPDFModal";
import { ExportDialog } from "src/dialogs/ExportDialog";
import { openExternalLink } from "src/utils/ExcalidrawViewUtils";
import { UniversalInsertFileModal } from "src/dialogs/UniversalInsertFileModal";
import { DEBUGGING, debug } from "src/utils/DebugHelper";
declare const PLUGIN_VERSION:string;
const dark = '<svg style="stroke:#ced4da;#212529;color:#ced4da;fill:#ced4da" ';
@@ -74,12 +75,14 @@ export class ToolsPanel extends React.Component<PanelProps, PanelState> {
}
updateScriptIconMap(scriptIconMap: ScriptIconMap) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.updateScriptIconMap,"ToolsPanel.updateScriptIconMap()");
this.setState(() => {
return { scriptIconMap };
});
}
setPreviewMode(isPreviewMode: boolean) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.setPreviewMode,"ToolsPanel.setPreviewMode()");
this.setState(() => {
return {
isPreviewMode,
@@ -88,6 +91,7 @@ export class ToolsPanel extends React.Component<PanelProps, PanelState> {
}
setFullscreen(isFullscreen: boolean) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.setFullscreen,"ToolsPanel.setFullscreen()");
this.setState(() => {
return {
isFullscreen,
@@ -96,6 +100,7 @@ export class ToolsPanel extends React.Component<PanelProps, PanelState> {
}
setDirty(isDirty: boolean) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.setDirty,"ToolsPanel.setDirty()");
this.setState(()=> {
return {
isDirty,
@@ -104,6 +109,7 @@ export class ToolsPanel extends React.Component<PanelProps, PanelState> {
}
setExcalidrawViewMode(isViewModeEnabled: boolean) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.setExcalidrawViewMode,"ToolsPanel.setExcalidrawViewMode()");
this.setState(() => {
return {
excalidrawViewMode: isViewModeEnabled,
@@ -112,6 +118,7 @@ export class ToolsPanel extends React.Component<PanelProps, PanelState> {
}
toggleVisibility(isMobileOrZen: boolean) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.toggleVisibility,"ToolsPanel.toggleVisibility()");
this.setTopCenter(isMobileOrZen);
this.setState((prevState: PanelState) => {
return {
@@ -121,6 +128,7 @@ export class ToolsPanel extends React.Component<PanelProps, PanelState> {
}
setTheme(theme: "dark" | "light") {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.setTheme,"ToolsPanel.setTheme()");
this.setState((prevState: PanelState) => {
return {
theme,
@@ -129,6 +137,7 @@ export class ToolsPanel extends React.Component<PanelProps, PanelState> {
}
setTopCenter(isMobileOrZen: boolean) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.setTopCenter,"ToolsPanel.setTopCenter()");
this.setState(() => {
return {
left:
@@ -144,6 +153,7 @@ export class ToolsPanel extends React.Component<PanelProps, PanelState> {
}
updatePosition(deltaY: number = 0, deltaX: number = 0) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.updatePosition,"ToolsPanel.updatePosition()");
this.setState(() => {
const {
offsetTop,
@@ -185,6 +195,7 @@ export class ToolsPanel extends React.Component<PanelProps, PanelState> {
}
render() {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.render,"ToolsPanel.render()");
return (
<div
ref={this.containerRef}
@@ -596,6 +607,7 @@ export class ToolsPanel extends React.Component<PanelProps, PanelState> {
}
private renderScriptButtons(isDownloaded: boolean) {
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.renderScriptButtons,"ToolsPanel.renderScriptButtons()");
if (Object.keys(this.state.scriptIconMap).length === 0) {
return "";
}

26
src/settings.ts
View File

@@ -2497,18 +2497,20 @@ export class ExcalidrawSettingTab extends PluginSettingTab {
cls: "excalidraw-setting-h1",
});
new Setting(detailsEl)
.setName(t("DEBUGMODE_NAME"))
.setDesc(fragWithHTML(t("DEBUGMODE_DESC")))
.addToggle((toggle) =>
toggle
.setValue(this.plugin.settings.isDebugMode)
.onChange((value) => {
this.plugin.settings.isDebugMode = value;
setDebugging(value);
this.applySettingsUpdate();
}),
);
if (process.env.NODE_ENV === 'development') {
new Setting(detailsEl)
.setName(t("DEBUGMODE_NAME"))
.setDesc(fragWithHTML(t("DEBUGMODE_DESC")))
.addToggle((toggle) =>
toggle
.setValue(this.plugin.settings.isDebugMode)
.onChange((value) => {
this.plugin.settings.isDebugMode = value;
setDebugging(value);
this.applySettingsUpdate();
}),
);
}
new Setting(detailsEl)

4
src/utils/DebugHelper.ts
View File

@@ -1,7 +1,9 @@
export const durationTreshold = 0; //0.05; //ms
export function setDebugging(value: boolean) {
DEBUGGING = value;
DEBUGGING = (process.env.NODE_ENV === 'development')
? value
: false;
}
export let DEBUGGING = false;

2
src/utils/StylesManager.ts
View File

@@ -16,7 +16,7 @@ export class StylesManager {
this.plugin = plugin;
const self = this;
plugin.app.workspace.onLayoutReady(async () => {
DEBUGGING && debug(undefined, "StylesManager.constructor > app.workspace.onLayoutReady", self);
(process.env.NODE_ENV === 'development') && DEBUGGING && debug(undefined, "StylesManager.constructor > app.workspace.onLayoutReady", self);
await this.harvestStyles();
getAllWindowDocuments(plugin.app).forEach(doc => {
this.copyPropertiesToTheme(doc);