mirror of
https://github.com/zadam/trilium.git
synced 2025-03-01 14:22:32 +01:00
refactor canvas-note to canvas
This commit is contained in:
parent
160bd0a790
commit
3df712b64f
@ -171,7 +171,7 @@ async function setContentPane() {
|
||||
|
||||
$content.html($table);
|
||||
}
|
||||
else if (revisionItem.type === 'canvas-note') {
|
||||
else if (revisionItem.type === 'canvas') {
|
||||
/**
|
||||
* FIXME: We load a font called Virgil.wof2, which originates from excalidraw.com
|
||||
* REMOVE external dependency!!!! This is defined in the svg in defs.style
|
||||
|
@ -17,7 +17,7 @@ const NOTE_TYPE_ICONS = {
|
||||
"book": "bx bx-book",
|
||||
"note-map": "bx bx-map-alt",
|
||||
"mermaid": "bx bx-selection",
|
||||
"canvas-note": "bx bx-pen"
|
||||
"canvas": "bx bx-pen"
|
||||
};
|
||||
|
||||
/**
|
||||
|
@ -7,7 +7,7 @@ import openService from "./open.js";
|
||||
import froca from "./froca.js";
|
||||
import utils from "./utils.js";
|
||||
import linkService from "./link.js";
|
||||
import errorSvg from "../widgets/type_widgets/canvas-note-utils/errorSvg.js";
|
||||
import errorSvg from "../widgets/type_widgets/canvas-utils/errorSvg.js";
|
||||
|
||||
let idCounter = 1;
|
||||
|
||||
@ -142,7 +142,7 @@ async function getRenderedContent(note, options = {}) {
|
||||
|
||||
$renderedContent.append($content);
|
||||
}
|
||||
else if (type === 'canvas-note') {
|
||||
else if (type === 'canvas') {
|
||||
// make sure surrounding container has size of what is visible. Then image is shrinked to its boundaries
|
||||
$renderedContent.css({height: "100%", width:"100%"});
|
||||
|
||||
|
@ -99,7 +99,7 @@ const TPL = `
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.note-book-content.type-image img, .note-book-content.type-canvas-note svg {
|
||||
.note-book-content.type-image img, .note-book-content.type-canvas svg {
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
object-fit: contain;
|
||||
@ -107,7 +107,7 @@ const TPL = `
|
||||
|
||||
.note-book-card.type-image .note-book-content img,
|
||||
.note-book-card.type-text .note-book-content img,
|
||||
.note-book-card.type-canvas-note .note-book-content img {
|
||||
.note-book-card.type-canvas .note-book-content img {
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
}
|
||||
|
@ -34,7 +34,7 @@ class TreeContextMenu {
|
||||
{ title: "Render HTML note", command: command, type: "render", uiIcon: "extension" },
|
||||
{ title: "Book", command: command, type: "book", uiIcon: "book" },
|
||||
{ title: "Mermaid diagram", command: command, type: "mermaid", uiIcon: "selection" },
|
||||
{ title: "Canvas Note", command: command, type: "canvas-note", uiIcon: "pen" },
|
||||
{ title: "Canvas", command: command, type: "canvas", uiIcon: "pen" },
|
||||
];
|
||||
}
|
||||
|
||||
|
@ -10,7 +10,7 @@ import FileTypeWidget from "./type_widgets/file.js";
|
||||
import ImageTypeWidget from "./type_widgets/image.js";
|
||||
import RenderTypeWidget from "./type_widgets/render.js";
|
||||
import RelationMapTypeWidget from "./type_widgets/relation_map.js";
|
||||
import CanvasNoteTypeWidget from "./type_widgets/canvas_note.js";
|
||||
import CanvasTypeWidget from "./type_widgets/canvas.js";
|
||||
import ProtectedSessionTypeWidget from "./type_widgets/protected_session.js";
|
||||
import BookTypeWidget from "./type_widgets/book.js";
|
||||
import appContext from "../services/app_context.js";
|
||||
@ -51,7 +51,7 @@ const typeWidgetClasses = {
|
||||
'search': NoneTypeWidget,
|
||||
'render': RenderTypeWidget,
|
||||
'relation-map': RelationMapTypeWidget,
|
||||
'canvas-note': CanvasNoteTypeWidget,
|
||||
'canvas': CanvasTypeWidget,
|
||||
'protected-session': ProtectedSessionTypeWidget,
|
||||
'book': BookTypeWidget,
|
||||
'note-map': NoteMapTypeWidget
|
||||
@ -154,7 +154,7 @@ export default class NoteDetailWidget extends NoteContextAwareWidget {
|
||||
// https://github.com/zadam/trilium/issues/2522
|
||||
this.$widget.toggleClass("full-height",
|
||||
!this.noteContext.hasNoteList()
|
||||
&& ['editable-text', 'editable-code', 'canvas-note'].includes(this.type)
|
||||
&& ['editable-text', 'editable-code', 'canvas'].includes(this.type)
|
||||
&& this.mime !== 'text/x-sqlite;schema=trilium');
|
||||
}
|
||||
|
||||
|
@ -11,7 +11,7 @@ const NOTE_TYPES = [
|
||||
{ type: "text", mime: "text/html", title: "Text", selectable: true },
|
||||
{ type: "relation-map", mime: "application/json", title: "Relation Map", selectable: true },
|
||||
{ type: "render", mime: '', title: "Render Note", selectable: true },
|
||||
{ type: "canvas-note", mime: 'application/json', title: "Canvas Note", selectable: true },
|
||||
{ type: "canvas", mime: 'application/json', title: "Canvas", selectable: true },
|
||||
{ type: "book", mime: '', title: "Book", selectable: true },
|
||||
{ type: "mermaid", mime: 'text/mermaid', title: "Mermaid Diagram", selectable: true },
|
||||
{ type: "code", mime: 'text/plain', title: "Code", selectable: true }
|
||||
|
@ -32,7 +32,7 @@ export default class NoteWrapperWidget extends FlexContainer {
|
||||
|
||||
refresh(noteContext) {
|
||||
this.$widget.toggleClass("full-content-width",
|
||||
['image', 'mermaid', 'book', 'render', 'canvas-note'].includes(noteContext?.note?.type)
|
||||
['image', 'mermaid', 'book', 'render', 'canvas'].includes(noteContext?.note?.type)
|
||||
|| !!noteContext?.note?.hasLabel('fullContentWidth')
|
||||
);
|
||||
}
|
||||
|
@ -1,16 +0,0 @@
|
||||
/**
|
||||
* replaces exlicraw.com and unpkg.com with own assets
|
||||
*
|
||||
* workaround until https://github.com/excalidraw/excalidraw/pull/5065 is merged and published
|
||||
*
|
||||
* @param {string} string
|
||||
* @returns
|
||||
*/
|
||||
const 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;
|
||||
}
|
||||
|
||||
export default replaceExternalAssets;
|
@ -7,7 +7,7 @@ import debounce from "../../../../../libraries/lodash.debounce.js";
|
||||
const {sleep} = utils;
|
||||
|
||||
const TPL = `
|
||||
<div class="canvas-note-widget note-detail-canvas-note note-detail-printable note-detail">
|
||||
<div class="canvas-widget note-detail-canvas note-detail-printable note-detail">
|
||||
<style type="text/css">
|
||||
.excalidraw .App-menu_top .buttonList {
|
||||
display: flex;
|
||||
@ -26,7 +26,7 @@ const TPL = `
|
||||
|
||||
</style>
|
||||
<!-- height here necessary. otherwise excalidraw not shown -->
|
||||
<div class="canvas-note-render" style="height: 100%"></div>
|
||||
<div class="canvas-render" style="height: 100%"></div>
|
||||
</div>
|
||||
`;
|
||||
|
||||
@ -85,10 +85,10 @@ export default class ExcalidrawTypeWidget extends TypeWidget {
|
||||
|
||||
/**
|
||||
* (trilium)
|
||||
* @returns {string} "canvas-note"
|
||||
* @returns {string} "canvas"
|
||||
*/
|
||||
static getType() {
|
||||
return "canvas-note";
|
||||
return "canvas";
|
||||
}
|
||||
|
||||
/**
|
||||
@ -99,7 +99,7 @@ export default class ExcalidrawTypeWidget extends TypeWidget {
|
||||
this.$widget = $(TPL);
|
||||
|
||||
this.$widget.toggleClass("full-height", true); // only add
|
||||
this.$render = this.$widget.find('.canvas-note-render');
|
||||
this.$render = this.$widget.find('.canvas-render');
|
||||
this.renderElement = this.$render.get(0);
|
||||
|
||||
libraryLoader
|
||||
@ -249,7 +249,7 @@ export default class ExcalidrawTypeWidget extends TypeWidget {
|
||||
})
|
||||
|
||||
const content = {
|
||||
_meta: "This note has type `canvas-note`. It uses excalidraw and stores an exported svg alongside.",
|
||||
_meta: "This note has type `canvas`. It uses excalidraw and stores an exported svg alongside.",
|
||||
elements, // excalidraw
|
||||
appState, // excalidraw
|
||||
files: activeFiles, // excalidraw
|
@ -11,7 +11,7 @@ function returnImage(req, res) {
|
||||
if (!image) {
|
||||
return res.sendStatus(404);
|
||||
}
|
||||
else if (!["image", "canvas-note"].includes(image.type)){
|
||||
else if (!["image", "canvas"].includes(image.type)){
|
||||
return res.sendStatus(400);
|
||||
}
|
||||
else if (image.isDeleted || image.data === null) {
|
||||
@ -20,10 +20,10 @@ function returnImage(req, res) {
|
||||
}
|
||||
|
||||
/**
|
||||
* special "image" type. the canvas-note is actually type application/json
|
||||
* special "image" type. the canvas is actually type application/json
|
||||
* to avoid bitrot and enable usage as referenced image the svg is included.
|
||||
*/
|
||||
if (image.type === 'canvas-note') {
|
||||
if (image.type === 'canvas') {
|
||||
const content = image.getContent();
|
||||
try {
|
||||
const data = JSON.parse(content);
|
||||
|
@ -210,7 +210,7 @@ function BackendScriptApi(currentNote, apiParams) {
|
||||
* @property {string} parentNoteId - MANDATORY
|
||||
* @property {string} title - MANDATORY
|
||||
* @property {string|buffer} content - MANDATORY
|
||||
* @property {string} type - text, code, file, image, search, book, relation-map, canvas-note - MANDATORY
|
||||
* @property {string} type - text, code, file, image, search, book, relation-map, canvas - MANDATORY
|
||||
* @property {string} mime - value is derived from default mimes for type
|
||||
* @property {boolean} isProtected - default is false
|
||||
* @property {boolean} isExpanded - default is false
|
||||
|
@ -41,7 +41,7 @@ function exportSingleNote(taskContext, branch, format, res) {
|
||||
extension = mimeTypes.extension(note.mime) || 'code';
|
||||
mime = note.mime;
|
||||
}
|
||||
else if (note.type === 'relation-map' || note.type === 'canvas-note' || note.type === 'search') {
|
||||
else if (note.type === 'relation-map' || note.type === 'canvas' || note.type === 'search') {
|
||||
payload = content;
|
||||
extension = 'json';
|
||||
mime = 'application/json';
|
||||
|
@ -9,5 +9,5 @@ module.exports = [
|
||||
'book',
|
||||
'note-map',
|
||||
'mermaid',
|
||||
'canvas-note'
|
||||
'canvas'
|
||||
];
|
@ -53,7 +53,7 @@ function deriveMime(type, mime) {
|
||||
mime = 'text/html';
|
||||
} else if (type === 'code' || type === 'mermaid') {
|
||||
mime = 'text/plain';
|
||||
} else if (['relation-map', 'search', 'canvas-note'].includes(type)) {
|
||||
} else if (['relation-map', 'search', 'canvas'].includes(type)) {
|
||||
mime = 'application/json';
|
||||
} else if (['render', 'book'].includes(type)) {
|
||||
mime = '';
|
||||
@ -84,7 +84,7 @@ function copyChildAttributes(parentNote, childNote) {
|
||||
* - {string} parentNoteId
|
||||
* - {string} title
|
||||
* - {*} content
|
||||
* - {string} type - text, code, file, image, search, book, relation-map, canvas-note, render
|
||||
* - {string} type - text, code, file, image, search, book, relation-map, canvas, render
|
||||
*
|
||||
* Following are optional (have defaults)
|
||||
* - {string} mime - value is derived from default mimes for type
|
||||
|
@ -168,7 +168,7 @@ const STRING_MIME_TYPES = [
|
||||
|
||||
function isStringNote(type, mime) {
|
||||
// render and book are string note in the sense that they are expected to contain empty string
|
||||
return ["text", "code", "relation-map", "search", "render", "book", "mermaid", "canvas-note"].includes(type)
|
||||
return ["text", "code", "relation-map", "search", "render", "book", "mermaid", "canvas"].includes(type)
|
||||
|| mime.startsWith('text/')
|
||||
|| STRING_MIME_TYPES.includes(mime);
|
||||
}
|
||||
@ -192,7 +192,7 @@ function formatDownloadTitle(filename, type, mime) {
|
||||
|
||||
if (type === 'text') {
|
||||
return filename + '.html';
|
||||
} else if (['relation-map', 'canvas-note', 'search'].includes(type)) {
|
||||
} else if (['relation-map', 'canvas', 'search'].includes(type)) {
|
||||
return filename + '.json';
|
||||
} else {
|
||||
if (!mime) {
|
||||
|
@ -85,7 +85,7 @@ document.addEventListener("DOMContentLoaded", function() {
|
||||
else if (note.type === 'book') {
|
||||
isEmpty = true;
|
||||
}
|
||||
else if (note.type === 'canvas-note') {
|
||||
else if (note.type === 'canvas') {
|
||||
header += `<script>
|
||||
window.EXCALIDRAW_ASSET_PATH = window.location.origin + "/node_modules/@excalidraw/excalidraw/dist/";
|
||||
</script>`;
|
||||
|
@ -124,11 +124,11 @@ function register(router) {
|
||||
if (!image) {
|
||||
return res.status(404).send(`Note '${req.params.noteId}' not found`);
|
||||
}
|
||||
else if (!["image", "canvas-note"].includes(image.type)) {
|
||||
else if (!["image", "canvas"].includes(image.type)) {
|
||||
return res.status(400).send("Requested note is not a shareable image");
|
||||
} else if (image.type === "canvas-note") {
|
||||
} else if (image.type === "canvas") {
|
||||
/**
|
||||
* special "image" type. the canvas-note is actually type application/json
|
||||
* special "image" type. the canvas is actually type application/json
|
||||
* to avoid bitrot and enable usage as referenced image the svg is included.
|
||||
*/
|
||||
const content = image.getContent();
|
||||
|
Loading…
x
Reference in New Issue
Block a user