gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-03-01 14:22:32 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

Merge pull request #2994 from thfrei/excalidraw-v012

Browse Source 
wip: Excalidraw Upgrade v0.11-v0.12
This commit is contained in:
zadam 2022-07-17 21:09:27 +02:00 committed by GitHub
commit 82d71797a7
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 51 additions and 81 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

78
package-lock.json generated
View File

@ -1,17 +1,17 @@
{
"name": "trilium",
"version": "0.53.0-beta",
"version": "0.53.2",
"lockfileVersion": 2,
"requires": true,
"packages": {
"": {
"name": "trilium",
"version": "0.53.0-beta",
"version": "0.53.2",
"hasInstallScript": true,
"license": "AGPL-3.0-only",
"dependencies": {
"@electron/remote": "2.0.8",
"@excalidraw/excalidraw": "0.11.0",
"@excalidraw/excalidraw": "0.12.0",
"archiver": "5.3.1",
"async-mutex": "0.3.2",
"axios": "0.27.2",
@ -51,8 +51,8 @@
"open": "8.4.0",
"portscanner": "2.2.0",
"rand-token": "1.0.1",
"react": "17.0.2",
"react-dom": "17.0.2",
"react": "18.2.0",
"react-dom": "18.2.0",
"request": "2.88.2",
"rimraf": "3.0.2",
"sanitize-filename": "1.6.3",
@ -246,9 +246,9 @@
}
},
"node_modules/@excalidraw/excalidraw": {
"version": "0.11.0",
"resolved": "https://registry.npmjs.org/@excalidraw/excalidraw/-/excalidraw-0.11.0.tgz",
"integrity": "sha512-wY0UdnN9JAcBKLzkGlVXiPSKgTO06YeeBhoIy/ezIiMJtfFtWBPjRjJROkdIGqnUmBz5L16MkuXE7b8j1b1ouw==",
"version": "0.12.0",
"resolved": "https://registry.npmjs.org/@excalidraw/excalidraw/-/excalidraw-0.12.0.tgz",
"integrity": "sha512-xMPmKmOEgKij43k5m6Koaevb+SBw6La7MT9UDY8Iq7nQCMhA1HQwcUURfSkZ3ERibdQmMsAGtjSLbkX7hrA3+A==",
"dependencies": {
"dotenv": "10.0.0"
},
@ -8524,28 +8524,26 @@
}
},
"node_modules/react": {
"version": "17.0.2",
"resolved": "https://registry.npmjs.org/react/-/react-17.0.2.tgz",
"integrity": "sha512-gnhPt75i/dq/z3/6q/0asP78D0u592D5L1pd7M8P+dck6Fu/jJeL6iVVK23fptSUZj8Vjf++7wXA8UNclGQcbA==",
"version": "18.2.0",
"resolved": "https://registry.npmjs.org/react/-/react-18.2.0.tgz",
"integrity": "sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ==",
"dependencies": {
"loose-envify": "^1.1.0",
"object-assign": "^4.1.1"
"loose-envify": "^1.1.0"
},
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/react-dom": {
"version": "17.0.2",
"resolved": "https://registry.npmjs.org/react-dom/-/react-dom-17.0.2.tgz",
"integrity": "sha512-s4h96KtLDUQlsENhMn1ar8t2bEa+q/YAtj8pPPdIjPDGBDIVNsrD9aXNWqspUe6AzKCIG0C1HZZLqLV7qpOBGA==",
"version": "18.2.0",
"resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.2.0.tgz",
"integrity": "sha512-6IMTriUmvsjHUjNtEDudZfuDQUoWXVxKHhlEGSk81n4YFS+r/Kl99wXiwlVXtPBtJenozv2P+hxDsw9eA7Xo6g==",
"dependencies": {
"loose-envify": "^1.1.0",
"object-assign": "^4.1.1",
"scheduler": "^0.20.2"
"scheduler": "^0.23.0"
},
"peerDependencies": {
"react": "17.0.2"
"react": "^18.2.0"
}
},
"node_modules/read-config-file": {
@ -8937,12 +8935,11 @@
}
},
"node_modules/scheduler": {
"version": "0.20.2",
"resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.20.2.tgz",
"integrity": "sha512-2eWfGgAqqWFGqtdMmcL5zCMK1U8KlXv8SQFGglL3CEtd0aDVDWgeF/YoCmvln55m5zSk3J/20hTaSBeSObsQDQ==",
"version": "0.23.0",
"resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.0.tgz",
"integrity": "sha512-CtuThmgHNg7zIZWAXi3AsyIzA3n4xx7aNyjwC2VJldO2LMVDhFK+63xGqq6CsJH4rTAt6/M+N4GhZiDYPx9eUw==",
"dependencies": {
"loose-envify": "^1.1.0",
"object-assign": "^4.1.1"
"loose-envify": "^1.1.0"
}
},
"node_modules/schema-utils": {
@ -11025,9 +11022,9 @@
}
},
"@excalidraw/excalidraw": {
"version": "0.11.0",
"resolved": "https://registry.npmjs.org/@excalidraw/excalidraw/-/excalidraw-0.11.0.tgz",
"integrity": "sha512-wY0UdnN9JAcBKLzkGlVXiPSKgTO06YeeBhoIy/ezIiMJtfFtWBPjRjJROkdIGqnUmBz5L16MkuXE7b8j1b1ouw==",
"version": "0.12.0",
"resolved": "https://registry.npmjs.org/@excalidraw/excalidraw/-/excalidraw-0.12.0.tgz",
"integrity": "sha512-xMPmKmOEgKij43k5m6Koaevb+SBw6La7MT9UDY8Iq7nQCMhA1HQwcUURfSkZ3ERibdQmMsAGtjSLbkX7hrA3+A==",
"requires": {
"dotenv": "10.0.0"
}
@ -17463,22 +17460,20 @@
}
},
"react": {
"version": "17.0.2",
"resolved": "https://registry.npmjs.org/react/-/react-17.0.2.tgz",
"integrity": "sha512-gnhPt75i/dq/z3/6q/0asP78D0u592D5L1pd7M8P+dck6Fu/jJeL6iVVK23fptSUZj8Vjf++7wXA8UNclGQcbA==",
"version": "18.2.0",
"resolved": "https://registry.npmjs.org/react/-/react-18.2.0.tgz",
"integrity": "sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ==",
"requires": {
"loose-envify": "^1.1.0",
"object-assign": "^4.1.1"
"loose-envify": "^1.1.0"
}
},
"react-dom": {
"version": "17.0.2",
"resolved": "https://registry.npmjs.org/react-dom/-/react-dom-17.0.2.tgz",
"integrity": "sha512-s4h96KtLDUQlsENhMn1ar8t2bEa+q/YAtj8pPPdIjPDGBDIVNsrD9aXNWqspUe6AzKCIG0C1HZZLqLV7qpOBGA==",
"version": "18.2.0",
"resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.2.0.tgz",
"integrity": "sha512-6IMTriUmvsjHUjNtEDudZfuDQUoWXVxKHhlEGSk81n4YFS+r/Kl99wXiwlVXtPBtJenozv2P+hxDsw9eA7Xo6g==",
"requires": {
"loose-envify": "^1.1.0",
"object-assign": "^4.1.1",
"scheduler": "^0.20.2"
"scheduler": "^0.23.0"
}
},
"read-config-file": {
@ -17804,12 +17799,11 @@
}
},
"scheduler": {
"version": "0.20.2",
"resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.20.2.tgz",
"integrity": "sha512-2eWfGgAqqWFGqtdMmcL5zCMK1U8KlXv8SQFGglL3CEtd0aDVDWgeF/YoCmvln55m5zSk3J/20hTaSBeSObsQDQ==",
"version": "0.23.0",
"resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.0.tgz",
"integrity": "sha512-CtuThmgHNg7zIZWAXi3AsyIzA3n4xx7aNyjwC2VJldO2LMVDhFK+63xGqq6CsJH4rTAt6/M+N4GhZiDYPx9eUw==",
"requires": {
"loose-envify": "^1.1.0",
"object-assign": "^4.1.1"
"loose-envify": "^1.1.0"
}
},
"schema-utils": {

6
package.json
View File

@ -26,7 +26,7 @@
},
"dependencies": {
"@electron/remote": "2.0.8",
"@excalidraw/excalidraw": "0.11.0",
"@excalidraw/excalidraw": "0.12.0",
"archiver": "5.3.1",
"async-mutex": "0.3.2",
"axios": "0.27.2",
@ -66,8 +66,8 @@
"open": "8.4.0",
"portscanner": "2.2.0",
"rand-token": "1.0.1",
"react": "17.0.2",
"react-dom": "17.0.2",
"react": "18.2.0",
"react-dom": "18.2.0",
"request": "2.88.2",
"rimraf": "3.0.2",
"sanitize-filename": "1.6.3",

41
src/public/app/widgets/type_widgets/canvas.js
View File

@ -45,8 +45,8 @@ const TPL = `
*
* Functionality:
* We store the excalidraw assets (elements, appState, files) in the note. In addition to that, we
* export the SVG from the canvas on every update. The SVG is also saved in the note. It is used
* for displaying any canvas note inside of a text note as an image.
* export the SVG from the canvas on every update. The SVG is also saved in the note. It is used when
* calling api/images and makes referencing very easy.
*
* Paths not taken.
* - excalidraw-to-svg (node.js) could be used to avoid storing the svg in the backend.
@ -65,7 +65,6 @@ const TPL = `
* has.
*
* Known issues:
* - v0.11.0 of excalidraw does not render freedraw backgrounds in the svg
* - the 3 excalidraw fonts should be included in the share and everywhere, so that it is shown
* when requiring svg.
*
@ -85,8 +84,8 @@ export default class ExcalidrawTypeWidget extends TypeWidget {
super();
// constants
this.SCENE_VERSION_INITIAL = -1;
this.SCENE_VERSION_ERROR = -2;
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
// config
this.DEBOUNCE_TIME_ONCHANGEHANDLER = 750; // ms
@ -103,6 +102,7 @@ export default class ExcalidrawTypeWidget extends TypeWidget {
this.$widget;
this.reactHandlers; // used to control react state
// binds
this.createExcalidrawReactApp = this.createExcalidrawReactApp.bind(this);
this.onChangeHandler = this.onChangeHandler.bind(this);
this.isNewSceneVersion = this.isNewSceneVersion.bind(this);
@ -253,7 +253,7 @@ export default class ExcalidrawTypeWidget extends TypeWidget {
* parallel svg export to combat bitrot and enable rendering image for note inclusion,
* preview and share.
*/
const svg = await window.Excalidraw.exportToSvg({
const svg = await window.ExcalidrawLib.exportToSvg({
elements,
appState,
exportPadding: 5, // 5 px padding
@ -262,11 +262,6 @@ export default class ExcalidrawTypeWidget extends TypeWidget {
});
const svgString = svg.outerHTML;
/**
* workaround until https://github.com/excalidraw/excalidraw/pull/5065 is merged and published
*/
const svgSafeString = this.replaceExternalAssets(svgString);
const activeFiles = {};
elements.forEach((element) => {
if (element.fileId) {
@ -279,7 +274,7 @@ export default class ExcalidrawTypeWidget extends TypeWidget {
elements, // excalidraw
appState, // excalidraw
files: activeFiles, // excalidraw
svg: svgSafeString, // not needed for excalidraw, used for note_short, content, and image api
svg: svgString, // not needed for excalidraw, used for note_short, content, and image api
};
return JSON.stringify(content);
@ -317,7 +312,7 @@ export default class ExcalidrawTypeWidget extends TypeWidget {
createExcalidrawReactApp() {
const React = window.React;
const Excalidraw = window.Excalidraw;
const { Excalidraw } = window.ExcalidrawLib;
const excalidrawRef = React.useRef(null);
this.excalidrawRef = excalidrawRef;
@ -379,7 +374,7 @@ export default class ExcalidrawTypeWidget extends TypeWidget {
className: "excalidraw-wrapper",
ref: excalidrawWrapperRef
},
React.createElement(Excalidraw.default, {
React.createElement(Excalidraw, {
// this makes sure that 1) manual theme switch button is hidden 2) theme stays as it should after opening menu
theme: this.themeStyle,
ref: excalidrawRef,
@ -420,7 +415,7 @@ export default class ExcalidrawTypeWidget extends TypeWidget {
getSceneVersion() {
if (this.excalidrawRef) {
const elements = this.excalidrawRef.current.getSceneElements();
return window.Excalidraw.getSceneVersion(elements);
return window.ExcalidrawLib.getSceneVersion(elements);
} else {
return this.SCENE_VERSION_ERROR;
}
@ -429,20 +424,4 @@ export default class ExcalidrawTypeWidget extends TypeWidget {
updateSceneVersion() {
this.currentSceneVersion = this.getSceneVersion();
}
/**
* replaces exlicraw.com with own assets
*
* workaround until https://github.com/excalidraw/excalidraw/pull/5065 is merged and published
* needed for v0.11.0
*
* @param {string} string
* @returns
*/
replaceExternalAssets = (string) => {
let result = string;
// exlidraw.com asset in react usage
result = result.replaceAll("https://excalidraw.com/", window.EXCALIDRAW_ASSET_PATH+"excalidraw-assets/");
return result;
}
}

7
src/share/canvas_share.js
View File

@ -37,10 +37,7 @@ const App = () => {
};
window.addEventListener("resize", onResize);
// ensure that resize is also called for split creation and deletion
// not really the problem. problem is saved appState!
// self.$renderElement.addEventListener("resize", onResize);
return () => window.removeEventListener("resize", onResize);
}, [excalidrawWrapperRef]);
@ -53,7 +50,7 @@ const App = () => {
className: "excalidraw-wrapper",
ref: excalidrawWrapperRef
},
React.createElement(Excalidraw.default, {
React.createElement(ExcalidrawLib.Excalidraw, {
ref: excalidrawRef,
width: dimensions.width,
height: dimensions.height,