mirror of
				https://github.com/zadam/trilium.git
				synced 2025-11-04 13:39:01 +01:00 
			
		
		
		
	mermaid layout improvements
This commit is contained in:
		
							parent
							
								
									f4dde84f06
								
							
						
					
					
						commit
						af3fd61974
					
				@ -16,7 +16,7 @@ const NOTE_TYPE_ICONS = {
 | 
			
		||||
    "relation-map": "bx bx-map-alt",
 | 
			
		||||
    "book": "bx bx-book",
 | 
			
		||||
    "note-map": "bx bx-map-alt",
 | 
			
		||||
    "mermaid": "bx bx-water"
 | 
			
		||||
    "mermaid": "bx bx-selection"
 | 
			
		||||
};
 | 
			
		||||
 | 
			
		||||
/**
 | 
			
		||||
 | 
			
		||||
@ -86,14 +86,15 @@ async function getRenderedContent(note, options = {}) {
 | 
			
		||||
        await libraryLoader.requireLibrary(libraryLoader.MERMAID);
 | 
			
		||||
 | 
			
		||||
        const noteComplement = await froca.getNoteComplement(note.noteId);
 | 
			
		||||
        const graph = noteComplement.content || "";
 | 
			
		||||
        const content = noteComplement.content || "";
 | 
			
		||||
 | 
			
		||||
        const updateWithContent = (content) => {
 | 
			
		||||
            $renderedContent.append($(content))
 | 
			
		||||
        }
 | 
			
		||||
        $renderedContent
 | 
			
		||||
            .css("display", "flex")
 | 
			
		||||
            .css("justify-content", "space-around");
 | 
			
		||||
 | 
			
		||||
        try {
 | 
			
		||||
            mermaid.mermaidAPI.render('graphDiv', graph, updateWithContent);
 | 
			
		||||
            mermaid.mermaidAPI.render("mermaid-graph", content,
 | 
			
		||||
                    content => $renderedContent.append($(content)));
 | 
			
		||||
        } catch (e) {
 | 
			
		||||
            const $error = $("<p>The diagram could not displayed.</p>");
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
@ -32,6 +32,16 @@ async function createNote(parentNotePath, options = {}) {
 | 
			
		||||
 | 
			
		||||
    const parentNoteId = treeService.getNoteIdFromNotePath(parentNotePath);
 | 
			
		||||
 | 
			
		||||
    console.log(options);
 | 
			
		||||
 | 
			
		||||
    if (options.type === 'mermaid' && !options.content) {
 | 
			
		||||
        options.content = `graph TD;
 | 
			
		||||
    A-->B;
 | 
			
		||||
    A-->C;
 | 
			
		||||
    B-->D;
 | 
			
		||||
    C-->D;`
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    const {note, branch} = await server.post(`notes/${parentNoteId}/children?target=${options.target}&targetBranchId=${options.targetBranchId}`, {
 | 
			
		||||
        title: newNoteName,
 | 
			
		||||
        content: options.content || "",
 | 
			
		||||
 | 
			
		||||
@ -33,7 +33,7 @@ class TreeContextMenu {
 | 
			
		||||
            { title: "Note Map", command: command, type: "note-map", uiIcon: "map-alt" },
 | 
			
		||||
            { 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: "water" }
 | 
			
		||||
            { title: "Mermaid diagram", command: command, type: "mermaid", uiIcon: "selection" }
 | 
			
		||||
        ];
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
@ -63,7 +63,7 @@ export default class MermaidWidget extends NoteContextAwareWidget {
 | 
			
		||||
 | 
			
		||||
            this.$errorContainer.hide();
 | 
			
		||||
        } catch (e) {
 | 
			
		||||
            this.$errorMessage.text(e.message);
 | 
			
		||||
            this.$errorMessage.text(e.message).append(`<br/><br/><p>See <a href="https://mermaid-js.github.io/mermaid/#/flowchart?id=graph">help and examples</a>.</p>`);
 | 
			
		||||
            this.$errorContainer.show();
 | 
			
		||||
        }
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
@ -50,7 +50,7 @@ function deriveMime(type, mime) {
 | 
			
		||||
 | 
			
		||||
    if (type === 'text') {
 | 
			
		||||
        mime = 'text/html';
 | 
			
		||||
    } else if (type === 'code') {
 | 
			
		||||
    } else if (type === 'code' || type === 'mermaid') {
 | 
			
		||||
        mime = 'text/plain';
 | 
			
		||||
    } else if (['relation-map', 'search'].includes(type)) {
 | 
			
		||||
        mime = 'application/json';
 | 
			
		||||
@ -115,6 +115,8 @@ function createNewNote(params) {
 | 
			
		||||
            mime: deriveMime(params.type, params.mime)
 | 
			
		||||
        }).save();
 | 
			
		||||
 | 
			
		||||
        console.log(params);
 | 
			
		||||
 | 
			
		||||
        note.setContent(params.content);
 | 
			
		||||
 | 
			
		||||
        const branch = new Branch({
 | 
			
		||||
 | 
			
		||||
@ -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"].includes(type)
 | 
			
		||||
    return ["text", "code", "relation-map", "search", "render", "book", "mermaid"].includes(type)
 | 
			
		||||
        || mime.startsWith('text/')
 | 
			
		||||
        || STRING_MIME_TYPES.includes(mime);
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user