Plugin: Many enhancement for my daily usage [v1.2.0][2023-03-30]

Hello! To meet my requirements in daily usage, I created a plugin that contains several different functions. Hope it can help you. :slight_smile:

V1.2.0 [2023-03-30]

  1. New: render --- as a horizontal line in markdown editor
  2. Fix:
    1. Fix list number auto correcting bugs
    2. Fix wrong link icon

Features

Each feature can be disabled/enabled in the settings.

ReadCube Papers

ReadCube Papers and others like Dida365 are standalone plugins now.
Please refer to:

Inline/Block math renderer in markdown editor

It significantly hurts your joplin's performance for now, especially with lots of math block. Please refer to Duplicate css properties for the assets of any codemirror plugins · Issue #6719 · laurent22/joplin · GitHub

Disabled by default


Imgur

Mermaid renderer in markdown editor

Header tag render in markdown editor

It shares the same configuration as with the clickable task checkbox

Code mainly comes from Zettlr

block link/image renderer in the editor

Only single line image/link can be previewed. ctrl/meta + left click on the rendered widgets can open the urls/files

Link preview only works with PDF/video/audio files

Inline link and image are folded only.

Imgur

Pseudocode

Pseudocode block:

Image

Allow following md works:

![Your Figure Caption Here](/path/to/your/img){width=60%}

This plugin can:

  • Specific the width/height of the image with {width=80px}, {height=30}, {width=50%}
  • Render the image ![]() in a <figure> block with figcaption
  • Use the alt attribute as the figure caption, and display the caption under the image if not empty
  • Center alignment for image and caption
  • Automatic image numbering

Table

Auto add row/column, delete column, and format table.

This part mainly comes from takumisoft68: vscode-markdown-table. Please refer to it for the feature description.
I just convert the code from vscode's editor to joplin's codemirror. :slight_smile:

Because I have no idea how to create a context menu, currently all the operations are triggered by shortcut:

Function Shutcut
Insert a row above/below ctrl + shift + up/down
Insert a column left/right ctrl + shift + left/right
Delete current column ctrl + shift + backspace
Navigate to previous cell tab
Navigate to next cell shift + tab
  1. It will automatically format your table code for alignment when navigation between cells with tab
  2. A new line is appended when trying to navigate to next cell from the last cell

Table column colorize from the plugin: hieuthi/joplin-plugin-markdown-table-colorize

tableFormatter

Admonition Renderer in markdown editor

It supports both !!! style and ::: style admonitions.

It only renders the editor. For admonition in the preview, please check the Admonition markdown extension

It conflicts with the 'Align wrapped list items' of Rich Markdown plugin.

This feature could be removed if the conflicts are solved, and it will be pushed to the Rich Markdown plugin.

Enhanced blockquote support

  • It supports [color=red] item in blockquote area so that the blockquote can be rendered with the given color border.
  • [name=SeptemberHX] and [date=20220202]
  • Automatically fold the [xxx=xxx] to keep the editor clean

Search & Replace

Code mainly comes from GitHub - zhuhs/codemirror-search-replace: codemirror search and replace

Current Bug: Cannot save after replacement. User needs to manually modify the note to save the change (for example: add a space)
It is disabled by default

Border for indent list in markdown editor

It needs the joplin-rich-markdown plugin installed and the feature 'indent list' enabled

Clickable task checkbox in markdown editor

Codes mainly comes from Zettlr

Toggle Sidebar and Note List panel together

A button on the note toolbar to toggle the sidebar and note list panel together.

It should be useful when the horizontal space of your screen is tight :slight_smile:

Imgur

Render Front Matter to Nothing

It just renders the front matter to nothing. It is helpful when you try to keep the front matter part and avoid the unwanted rendered content (write a blog for example).

Local file preview

Currently only local pdf file can be previewed.

Quick Commands

Type /command in the editor for quick input of table, mermaid, etc.

  • /table
  • /graph
  • /flowchart
  • /sequenceDiagram
  • /gantt
  • /classDiagram
  • /erDiagram
  • /journey
  • /now
  • /today
  • /tomorrow

Thanks to

20 Likes

Thanks!

I'd love it if the table features could be made as a standalone, or possibly merged into one of the other table plugins, like the Table Formatter.

5 Likes

That's an interesting collection of improvements!
Can you tell if there is perf impact when some features are disabled?

1 Like

Each feature should work fine with some of them disabled because each feature are independent of each other at the code level.

1 Like

It is not likely to make it as a standalone for my convenience. However, I think I can make a PR to the plugin Table Formatter.

Edit: PR is already created.

5 Likes

Is there a ready package to install / copy to the plugin folder?

Or maybe publish the CodeMirror module separately? Then each plugin can choose to integrate it or not (I think it would be good for Rich Markdown too), or we may even integrate it to the app.

5 Likes

It sounds good. I will try to package it as a CodeMirror module once I figure out what a standard npm package looks like.

You can get the packaged plugin file *.jpl from Releases · SeptemberHX/joplin-plugin-enhancement · GitHub

1 Like

this is the best so far. waiting since years for resizing pictures. thanks so much.
btw. there is another "folder" machanism plugin: Persistent text folding in editor and also a table sorter: GitHub - hieuthi/joplin-plugin-markdown-table-sortable: Add the ability to sort rendered tables on the fly

1 Like

Any plans to add this to the plugin list, so it would be installable directly from the app?

1 Like

Yes, I have noticed these two plugins before I tried to implement this one. I think 'Persistent text folding plugin' is used to fold one section under a header, but I just want to fold the mermaid code block;

And the 'joplin-plugin-markdown-table-sortable' aims to sort markdown table. This plugin tries to format the table: make it aligned by '|' character in the editor. This plugin also helps to navigate between cells, add row/column, and remove column in the editor.

Not sure I published the plugin in the right way. I just followed Official Joplin plugin repository is now ready! If you are developing a plugin please read on and run npm publish minutes ago.

2 Likes

Which cookie I've to copy to use the Readcube Papers part?

Bildschirmfoto 2022-05-21 um 12.59.35

Not sure which one exactly. When I inspect the Papers' webapp, all the four cookies are used in each requests to the Papers' server. But I am sure that the first three are set after signing in, so I guess we only need the first three.

For me, I copied all the four cookies.

If you are trying to use the Papers feature, please make sure that you get the plugin >= v0.6.2. Some incompatible changes were happened.

I am mostly interested in the image captions. Is there a way to make them smaller and to get rid of the 'Fig #' prefix, pls? I've searched the options but found nothing.

Found a bug:

This keeps popping up, even when I have disabled Papers in the settings.
image

It can be done in your userstyle.css [settings -> appearance -> advance -> markdown], and add:

figcaption::before {
    content: '' !important;
}

figcaption {
    font-size: 10px !important;
}
1 Like

I will check the bug later, and I will make the Papers as a standalone plugin in the next version I think.

2 Likes

:+1: