[Release] Codemirror6 Plugin

[oeyoews]

The basic branch needs to be repackaged manually, I haven’t updated it in a long time, I plan to automate the process

[oeyoews]

Update: support it already

https://codemirror.net/docs/ref/#search.gotoLine

[wattahay]

Are there instructions on how to package the main branch?

I’m on Linux.

Thanks.

[oeyoews]

GitHub - oeyoews/tiddlywiki-codemirror6: Next TiddlyWiki5 Next Editor Plugin: Codemirror6 Is this information useful to you?

[oeyoews]

For new created tiddler, a minimum number of lines config is added, default value is 1

[oeyoews]

support maxheight with auto

Give the CodeMirror Editor a max-height, but still auto shrink

The height adjustment in the editor provisions for a fixed height, or an auto height that increases regardless of how tall the editor is. However, this solves that. In the Editor Toolbar: 1 Click the height adjustment button 2. Select the “Fixed Height” radio button 3. Enter something like the following in the box: auto; max-height:800px; max-width:800px; or something like that ; max-height:900px; Explanation: “auto;” is the tail end of what would have been a fixed size (or what is a…

feat: add maxheight option

[wattahay]

Oddly enough the gotoline feature is only functioning with an internet connection.

Is this because the feature is part of a module that’s not actually packaged with the plugin?

I’ve tried to find documentation on such a module, but could not find it.

Thanks for any help.

This particular gotoline feature is good for multiple reasons, including recovering after the scroll position gets lost after saving a tiddler.

[oeyoews]

Does this shortcut key not work for you?

[oeyoews]

I do have such a feature that I haven’t implemented yet. It’s very useful to save the last scroll/edited cursor position. But I haven’t had time to complete it recently.

The API of codemirror6 is too large. I have not yet found the relevant API to implement this function.

[wattahay]

Sorry, this turned out to be an issue with the LibreWolf browser.

[TW_Tones]

Perhaps this could somehow be added to $:/plugins/telmiger/EditButtons rather than code mirror if the cursor position (nth character) can be found.

• I think it reasonable if you are editing a tiddler, to save the cursor position in that tiddler but separately, perhaps in a data tiddler, tiddlername / position would be better.
• Eventually we may even be able to edit or view a tiddler while giving a cursor position from a special link. Actually this could be done by manually setting a cursor position if nothing else.
  • May be we could save multiple cursor positions with names and intergrate a keywork search at the same time

[linonetwo]

Recommend this minimap plugin

GitHub - replit/codemirror-minimap: Minimap extension for Codemirror 6

But I think it’s better to build a minimap that render the whole webpage.

---

I see, you are already using it

[linonetwo]

If I have time, I want to use js-minimap - npm to build a minimap scrollbar for Story River. Minimap 小地图插件 · tiddly-gittly/tiddlywiki-plugins · Discussion #99 · GitHub

[CodaCoder]

@oeyoews

I have found two issues with the CM6 plugin.

Issue 1

CM6 is adding these lines to the raw markup section:

I deleted over a hundred of them before taking the screenshot.

Issue 2

When selecting text in the editor with the mouse, CM6 will start to select multiple lines almost immediately, even if you’re trying to select text on a single line. Then it starts to scroll the editor (for no reason). Now you try to select upward and the problem gets worse – you have to stop dragging the mouse and start over.

There should be code to desensitize the mouse (jitter/debounce) because it’s just too sensitive.

This problem is much worse when those hundreds of empty divs are present from issue 1.

Hope this makes sense?

[oeyoews]

@CodaCoder

CM6 is adding these lines to the raw markup section:

It looks like this is the default behavior of codemirror6, I may need to find a way to clean them up when the instance is destroyed

[CodaCoder]

Issue 2 is by far the worst.

[oeyoews]

Actually, I don’t understand this question, can you provide some pictures or video demonstrations?

[CodaCoder]

@oeyoews

I don’t understand this question,

I can’t give you the video or screenshot because I’ve deleted all the bogus divs.

If I try to select text like this…

CM6 immediately starts to scroll the editor so I end up with this:

Then I try to drag the mouse UP and end up in a race condition trying to regain control of the selection. A race I can’t win.

If I use the keyboard instead, it works fine. So the problem is in the code that provides mouse-drag-selection.

[CodaCoder]

And where are the styles kept? I found $:/plugins/oeyoews/tiddlywiki-codemirror-6/styles but that seems overloaded with !important property values (not cool for a library to do that especially without recourse to @layer).

[BurningTreeC]

Hello @CodaCoder

To the styles I can say that they are in the CodeMirror6 Javascript code hardcoded and added in the tiddlywiki header.
The styles you found that are using !important (I believe) are mostly color definitions (and styles used for the ControlPanel > Settings UI)

I have updated my version of the codemirror6 plugin, maybe there these lines you found aren’t added.
CodeMirror6 adds them and I don’t know why.

Best wishes,
Simon