我自己的资料整理导引（五）：让trilium更像markdown的插件

trilium插件汇总：
https://github.com/Nriver/awesome-trilium?tab=readme-ov-file

使用插件的说明：

• 新建插件的步骤：新建一个note，选择文件类型为jsfrontend，然后把owned attribute按要求修改一下（一般是#run=frontendStartup），然后输入代码，最后点击右上角的键位
• 定义快捷键的时候需要使用键盘映射后的键位。所以注意区分ctrl, option和meta
• trilium的渲染是用CKE editor实现的。目前我的配置希望将其快捷键和markdown尽量对齐

每个文件的内容：

• math formula：在trilium题目下面的面板上新增一个\(\ell\)的图标，作用是把所有数学公式自动转换成Katex的格式。
• openfilepath：让应用程序中的_斜体_文件路径或Zotero链接在双击时自动打开相应的文件或链接
• shortcuts for CKE editior：主要是增加ctrl+x切换格式的功能，其中ctrl+0切换为段落（paragraph），ctrl+2/3/4/5切换为2/3/4/5级标题。但是注意因为我的电脑上把ctrl映射成了meta（command），所以写的代码是meta。如有需要可以改回ctrl.

math formula

在owned attributes里面添加：#widget

class ReplaceFormulasButton extends api.NoteContextAwareWidget {

    get parentWidget() {
        return 'center-pane';
    }

    doRender() {
        this.$widget = $(`<style type="text/css">
            .replace-formulas-icon.ribbon-tab-title-icon.bx:before {
                content: "\\1D4C1"; 
            }
        </style>`);
        return this.$widget;
    }

    async refreshWithNote() {
        $(document).ready(() => {
            if (!$("div.component.note-split:not(.hidden-ext) div.ribbon-tab-title").hasClass('replace-formulas-button')) {
                $("div.component.note-split:not(.hidden-ext) .ribbon-tab-title:not(.backToHis)").last().after(`
                    <div class="replace-formulas-button ribbon-tab-spacer"></div>
                    <div class="replace-formulas-button ribbon-tab-title">
                        <span class="replace-formulas-icon ribbon-tab-title-icon bx" title="Replace Formulas"></span>
                    </div>
                `);
            }
            $('div.component.note-split:not(.hidden-ext) div.replace-formulas-button').off("click", replaceFormulas);
            $('div.component.note-split:not(.hidden-ext) div.replace-formulas-button').on("click", replaceFormulas);
        });
    }
}

var replaceFormulas = function () {
    api.getActiveContextTextEditor().then(editor => {
        const data = editor.getData();

        const regex = /\$\$(.*?)\$\$|\$(.*?)\$/gs;
        let replacedData = data;
        let matchFound = false;

        replacedData = replacedData.replace(regex, (match, p1, p2) => {
            matchFound = true;
            if (p1) {
                return `<span class="math-tex">\\[${p1.replace(/<br\s*\/?>/gi, '')}\\]</span>`;
            } else if (p2) {
                return `<span class="math-tex">\\(${p2.replace(/<br\s*\/?>/gi, '')}\\)</span>`;
            }
        });

        if (matchFound) {
            editor.setData(replacedData);
            api.showMessage('Formulas have been successfully replaced.');
        } else {
            api.showMessage('No formulas found to replace.');
        }
    }).catch(error => {
        console.error('Failed to get CKEditor instance:', error);
        api.showMessage('An error occurred while trying to replace formulas.');
    });
};

module.exports = new ReplaceFormulasButton();

openfilepath

在owned attributes里面添加：#widget

/* License: MIT https://opensource.org/licenses/MIT

• Made by: GEOsens GmbH 2023
• Usage: Italicize the file path. The italicized file or folder can be opened with a double click.
• Note: there is not indication that a path is clickable, thanks ckeditor.
  */

async function onClickOpenPath(event) {
// check if event was on Italicised text
if (event.target.tagName == “I”) {
var path = event.target.innerText;

    // check if the content is a local file path or a Zotero link
    if (/[a-zA-Z]:.*|\\\\\w.*?\\\w/.test(path) || path.startsWith('zotero://')) {
        await document.PathLinkerApi.runOnBackend(async (path) => {
            const shell = require('electron').shell;

            // check if it's a Zotero link
            if (path.startsWith('zotero://')) {
                // open Zotero link
                await shell.openExternal(path);
            } else {
                // open local file path
                await shell.openPath(path);
            }
            return;
        }, [path]);
    }
}

}

const TEMPLATE = `

`;

class PathLinkerWidget extends api.NoteContextAwareWidget {
constructor(…args) {
super(…args);
this.balloonEditorCreate = null;
}

get position() { 
    // higher value means position towards the bottom/right
    return 100; 
} 

get parentWidget() { return 'center-pane'; }

doRender() {
    this.$widget = $(TEMPLATE);
    this.$widget.hide();
    
    // store API in document to access it from callback
    document.PathLinkerApi = api;
    return this.$widget;
}

}

let widget = new PathLinkerWidget();
console.log(“Loaded PathLinkerWidget”);
module.exports = widget;

shortcuts for CKE editor

在owned attributes里面添加：#run=frontendStartup
/FORMATING FUNCTIONS/

/copied from https://github.com/zadam/trilium/issues/2954 but adjusted many./

//Remove format
async function remove_format() {
let editor = await api.getActiveContextTextEditor();
editor.execute(‘removeFormat’, {value:‘null’});
}

//Font headings
async function text_set_paragraph() {
let editor = await api.getActiveContextTextEditor();
editor.execute(‘heading’, {value:‘paragraph’})
}
async function text_set_heading_2() {
let editor = await api.getActiveContextTextEditor();
editor.execute(‘heading’, {value:‘heading2’} );
}
async function text_set_heading_3() {
let editor = await api.getActiveContextTextEditor();
editor.execute(‘heading’, {value:‘heading3’} );
}
async function text_set_heading_4() {
let editor = await api.getActiveContextTextEditor();
editor.execute(‘heading’, {value:‘heading4’} );
}
async function text_set_heading_5() {
let editor = await api.getActiveContextTextEditor();
editor.execute(‘heading’, {value:‘heading5’} );
}

//Font size
async function text_size_tiny() {
let editor = await api.getActiveContextTextEditor();
editor.execute(‘fontSize’, { value: ‘tiny’});
}
async function text_size_small() {
let editor = await api.getActiveContextTextEditor();
editor.execute(‘fontSize’, { value: ‘small’});
}
async function text_size_default() {
let editor = await api.getActiveContextTextEditor();
editor.execute(‘fontSize’, { value: ‘default’});
}
async function text_size_big() {
let editor = await api.getActiveContextTextEditor();
editor.execute(‘fontSize’, { value: ‘big’});
}
async function text_size_huge() {
let editor = await api.getActiveContextTextEditor();
editor.execute(‘fontSize’, { value: ‘huge’});
}

//Code format
async function code_format() {
let editor = await api.getActiveContextTextEditor();
editor.execute(‘code’, {value:‘null’});
}

//Not working, probably there are limited fontFamily fonts packed with Trilium Notes
async function font_family_courier() {
let editor = await api.getActiveContextTextEditor();
editor.execute(‘fontFamily’, {value: ‘Courier New’});
}

/* BIND SHORTCUTS */
api.bindGlobalShortcut(‘ctrl+alt+x’, remove_format);

api.bindGlobalShortcut(‘ctrl+alt+shift+a’, text_size_tiny);
api.bindGlobalShortcut(‘ctrl+alt+shift+s’, text_size_small);
api.bindGlobalShortcut(‘ctrl+alt+shift+d’, text_size_default);
api.bindGlobalShortcut(‘ctrl+alt+shift+f’, text_size_big);
api.bindGlobalShortcut(‘ctrl+alt+shift+g’, text_size_huge);

api.bindGlobalShortcut(‘meta+0’, text_set_paragraph);
api.bindGlobalShortcut(‘meta+2’, text_set_heading_2);
api.bindGlobalShortcut(‘meta+3’, text_set_heading_3);
api.bindGlobalShortcut(‘meta+4’, text_set_heading_4);
api.bindGlobalShortcut(‘meta+5’, text_set_heading_5);

api.bindGlobalShortcut(‘ctrl+alt+shift+c’, code_format);

//Not working
api.bindGlobalShortcut(‘ctrl+alt+shift+w’, font_family_courier);