fix hamburger icon in canvas

This commit is contained in:
zadam 2023-05-07 11:54:04 +02:00
parent 4d5612e845
commit 9f5f0aeddd

View File

@ -11,6 +11,13 @@ const TPL = `
.excalidraw .App-menu_top .buttonList { .excalidraw .App-menu_top .buttonList {
display: flex; display: flex;
} }
/* Conflict between excalidraw and bootstrap classes keeps the menu hidden */
/* https://github.com/zadam/trilium/issues/3780 */
/* https://github.com/excalidraw/excalidraw/issues/6567 */
.excalidraw .dropdown-menu {
display: block;
}
.excalidraw-wrapper { .excalidraw-wrapper {
height: 100%; height: 100%;
@ -39,7 +46,7 @@ const TPL = `
* @author thfrei 2022-05-11 * @author thfrei 2022-05-11
* *
* Background: * Background:
* excalidraw gives great support for hand drawn notes. It also allows to include images and support * excalidraw gives great support for hand-drawn notes. It also allows including images and support
* for sketching. Excalidraw has a vibrant and active community. * for sketching. Excalidraw has a vibrant and active community.
* *
* Functionality: * Functionality:
@ -50,17 +57,17 @@ const TPL = `
* Paths not taken. * Paths not taken.
* - excalidraw-to-svg (node.js) could be used to avoid storing the svg in the backend. * - excalidraw-to-svg (node.js) could be used to avoid storing the svg in the backend.
* We could render the SVG on the fly. However, as of now, it does not render any hand drawn * We could render the SVG on the fly. However, as of now, it does not render any hand drawn
* (freedraw) paths. There is an issue with Path2D object not present in node-canvas library * (freedraw) paths. There is an issue with Path2D object not present in the node-canvas library
* used by jsdom. (See Trilium PR for samples and other issues in respective library. * used by jsdom. (See Trilium PR for samples and other issues in the respective library.
* Link will be added later). Related links: * Link will be added later). Related links:
* - https://github.com/Automattic/node-canvas/pull/2013 * - https://github.com/Automattic/node-canvas/pull/2013
* - https://github.com/google/canvas-5-polyfill * - https://github.com/google/canvas-5-polyfill
* - https://github.com/Automattic/node-canvas/issues/1116 * - https://github.com/Automattic/node-canvas/issues/1116
* - https://www.npmjs.com/package/path2d-polyfill * - https://www.npmjs.com/package/path2d-polyfill
* - excalidraw-to-svg (node.js) takes quite some time to load an image (1-2s) * - excalidraw-to-svg (node.js) takes quite some time to load an image (1-2s)
* - excalidraw-utils (browser) does render freedraw, however NOT freedraw with background. It is not * - excalidraw-utils (browser) does render freedraw, however NOT freedraw with a background. It is not
* used, since it is a big dependency, and has the same functionality as react + excalidraw. * used, since it is a big dependency, and has the same functionality as react + excalidraw.
* - infinite-drawing-canvas with fabric.js. This library lacked a lot of feature, excalidraw already * - infinite-drawing-canvas with fabric.js. This library lacked a lot of features, excalidraw already
* has. * has.
* *
* Known issues: * Known issues:
@ -83,7 +90,7 @@ export default class ExcalidrawTypeWidget extends TypeWidget {
super(); super();
// constants // constants
this.SCENE_VERSION_INITIAL = -1; // -1 indicates, that it is fresh. excalidraw scene version is always >0 this.SCENE_VERSION_INITIAL = -1; // -1 indicates that it is fresh. excalidraw scene version is always >0
this.SCENE_VERSION_ERROR = -2; // -2 indicates error this.SCENE_VERSION_ERROR = -2; // -2 indicates error
// config // config
@ -146,10 +153,10 @@ export default class ExcalidrawTypeWidget extends TypeWidget {
* @param {FNote} note * @param {FNote} note
*/ */
async doRefresh(note) { async doRefresh(note) {
// see if note changed, since we do not get a new class for a new note // see if the note changed, since we do not get a new class for a new note
const noteChanged = this.currentNoteId !== note.noteId; const noteChanged = this.currentNoteId !== note.noteId;
if (noteChanged) { if (noteChanged) {
// reset scene to omit unnecessary onchange handler // reset the scene to omit unnecessary onchange handler
this.currentSceneVersion = this.SCENE_VERSION_INITIAL; this.currentSceneVersion = this.SCENE_VERSION_INITIAL;
} }
this.currentNoteId = note.noteId; this.currentNoteId = note.noteId;
@ -250,14 +257,14 @@ export default class ExcalidrawTypeWidget extends TypeWidget {
const appState = this.excalidrawRef.current.getAppState(); const appState = this.excalidrawRef.current.getAppState();
/** /**
* A file is not deleted, even though removed from canvas. therefore we only keep * A file is not deleted, even though removed from canvas. Therefore, we only keep
* files that are referenced by an element. Maybe this will change with new excalidraw version? * files that are referenced by an element. Maybe this will change with a new excalidraw version?
*/ */
const files = this.excalidrawRef.current.getFiles(); const files = this.excalidrawRef.current.getFiles();
/** /**
* parallel svg export to combat bitrot and enable rendering image for note inclusion, * parallel svg export to combat bitrot and enable rendering image for note inclusion,
* preview and share. * preview, and share.
*/ */
const svg = await window.ExcalidrawLib.exportToSvg({ const svg = await window.ExcalidrawLib.exportToSvg({
elements, elements,
@ -369,7 +376,7 @@ export default class ExcalidrawTypeWidget extends TypeWidget {
// do a custom redirect, such as passing to react-router // do a custom redirect, such as passing to react-router
// ... // ...
} else { } else {
// open in same tab // open in the same tab
} }
}, []); }, []);