Plugin: Keep Cursor Synced between editor and md viewer

Feature 1: Mark the active line of editor in MD Viewer

You can also set the highlight style in userstyle.css of Joplin. For example:

.better-markdown-viewer-highlight-line { position: relative; }
.better-markdown-viewer-highlight-line::before { position: absolute; background-color: rgba(255, 255, 255, 0.4); content: ''; height: 100%; width: 3px; left: -6px; }

When using dark theme, the highlighted line element get an extra class name.

.better-markdown-viewer-highlight-line-dark {
  background: red;
}

Feature 2: Focus the same line in editor when double click MD Viewer

When In View Mode:

16 Likes

I really like this however I've already had some issues with the double click feature.
I can apparently only double click once on the viewer window, any other attempts just makes the text blue and doesn't swap to the editor.
Other times it goes grey but the cursor is then put onto the wrong line
Sometimes it goes grey but I don't see the cursor at all and the viewer puts a highlight onto a different line.

One potential feature request (not sure if it is even possible), could the double click feature be used on the single pane viewer to take you to the editor pane? (or does it already do this and it isn't working for me?) This would be great for working like I would with the dual pane viewer but on devices with more limited screen estate.

I'm on Joplin 2.5.1 on Win10.

"db click doesn't work" is a bug, fixed in 1.0.2

2 Likes

Thanks, I'll have another play with it when the plugin repo updates.

Your requested feature have been included in 1.1.0. See gif in this post

2 Likes

Oh, I just got we you mean. View-Only Mode -> db click -> Editor-Only Mode, right? I will add a option in 1.2.0

1 Like

To be honest either works perfectly fine for me but yes, that is what I originally meant. Thanks so much for implementing it.
(I was in the middle of saying I couldn't see a 1.0.2 update yet but I've just spotted the NPM package go up to 1.1.0) so hopefully the repo will update in 25 mins and I can have a play.

Hi @ylc395

Thank you for this initiative. For me, the Double click will toggle editor out when in View Mode option does not work. It's like an infinite loop where the plugin tries to activate/deactivate the "view" mode. I should mention that in the general settings of Joplin I only alternate between the editor and the viewer.

image

Bug confirmed. Fixed in 1.2.1. Waiting for NPM to update, may take hours.

2 Likes

Just downloaded 1.2.2 and it is working nicely with the toggle out to editor function, thank you for adding it.
One thing I have noticed is that it doesn't seem to like code blocks in various forms:

  • Inline code blocks on double click seems to make the cursor jump to the previous section even when after normal text
  • Fenced code blocks don't seem to work at all

On the other hand, indented code blocks work just fine

Inline code blocks on double click seems to make the cursor jump to the previous section even when after normal text

I don't quite get this, can you provide a gif or something?

Fenced code blocks don't seem to work at all

Yes, I don't have a good idea to handle Fenced code for some reasons. If anyone can help, PRs are welcome

It's a bit odd. You can see in the gif that sometimes things don't quite line up right. Sometimes I can double click the inline code and the cursor goes to the right place but the highlight doesnt. Other times it goes to the wrong line entirely but if you double click again without moving anything else it will change the cursor position. Hope the gif is clear enough.

Animation

1 Like

Do you know why my Joplin MD viewer is not like yours when handling line-break?

I like this plugin! It would be better if it will show a mark on the scrollbar (just like the search mark which appear on the scrollbar when searching a word with ctrl+f). Or, add a method that can directly jump to the exact location on the render viewer.

Besides, I saw you have a question about the line-break. That is about the setting on preference > markdown:

2021-10-14 (2)

1 Like

As @Nacandev mentions, I don't have soft breaks turned on.

Its worth noting that there is a merged PR that I don't think is in a full release yet (but you can test if you build Joplin yourself) that synchronises the scrolling better so that this shouldn't be necessary

1 Like

so why are there diffences between your rendered markdown and mine?

If I turn them on then it does look like yours.

I stand corrected, it hasn't been merged but you can still build it from the other branch:

I'm not sure I understand the argument about it being "too fast". The speed depends on which pane you are scrolling.

1 Like

Oh! Sorry, I made a logic mistake. You are right, that's what I need, I'm just thinking too much. :dizzy_face:

1 Like

I was surprised by how dramatic the usability of Joplin is improved by this plugin. Maybe it's just my workflow/workstyle, but this is awesome! Thank you!

2 Likes