New beta editor for the mobile app

The latest Android pre-release features an improved beta editor, which I hope could become a replacement for the very basic editor we have at the moment. To enable it, open the configuration screen then scroll down and select "Use beta editor".

It's still experimental because it's based on the equally experimental CodeMirror 6, however for simple editing tasks it seems to work fine. At the moment the improvements are:

  • Syntax highlighting for various tags such as bold, italic and headings.

  • List continuation for ordered and unordered lists (I didn't try checklists but I assume it doesn't work)

  • Improved undo/redo

  • Maybe better handling of large documents? CodeMirror 6 has a demo that loads a document with millions of lines, so maybe that will solve the performance issues that some users were having

If everything works well, later on we should be able to add things like a toolbar, spellchecking and other features that are impossible with the current editor.

If you find any bug, feel free to report here. Also make sure you backup your notes regularly in case there's an issue!

10 Likes

But you can't back up on mobile

Yes I mean a backup on desktop at least, so even if something goes wrong on mobile there's a chance the note has been synced before and backed up. The note history also could help on mobile if there's an issue.

Tried it a bit. Mostly works but a few times the body edit field was empty and not editable. Switching to viewer mode and back to edit again fixed it. Only happened occasionally, I am not able to reliably reproduce it.
And logs are clean too.

That's probably an error when the component is created. But I've just realised I'm logging to console, which would show up in adb logcat but not in the app log. I'll update that, so that at least we can know what's causing this.

Played around with new editor and in comparison to previous one it feels subjectively very good.

Not sure sure if it's intended behavior:
I was able to get some sort of highlights only on headers, italics and bold text. --Strike through-- isn't shown, links, code blocks etc are the same style and color as main text.

Ran several times into blank screen when changed font of editor from default to monospace. Yet couldn't reliably reproduce it. Reopening the note solved the problem.

Nitpicks:

  • it doesn't add closing bracket automatically
  • check boxes are continued as bulleted list, not as check boxes per se
  • monospaced font in settings actually made it to be rendered regular font in editor, and default in settings made it monospaced in the editor

In any case it seems pretty robust and nice to work with. Will leave it as a default editor from now on.

1 Like

This is really awesome! I've been wanting to play around with CodeMirror 6 for awhile now and I'm glad to see that you've beat me too it. I had a quick look at the code and it seems like there are some similarities to the desktop, are you planning on eventually extending this to use a single shared editor between the desktop and mobile? Or is there something preventing that?

1 Like

Is this editor available to try out on desktop? Or is it android only?

I'm missing some buttons to Help input of some markdown symbols, which are usually hidden on normal on-screen keyboards.

I tried to replicate graphit0's post and can confirm the results:


I love the feature & haven't run into any issues with the editor so far tho.
Toolbar would be great.

It there a chance that we get a new beta for iOS at some point in time? I really want to have a better editing experience on mobile :smiley:

Indeed that would be great if it can be done, and it looks like they've tried to keep some level of compatibility with CM5 (CSS classes are similar and I believe some CM5 modules work with CM6).

The main difference is that CodeMirror 6 has to be compiled with all its dependencies into a bundle before it can be used, while CM5 simply loads external JS files.

If we wanted to use the same editor in both desktop and mobile I guess the main goal would be to find how to re-use the existing desktop code. Perhaps it would even make sense to start from the desktop app, switch to CM6 and try to get things working, then use this in mobile with whatever tweak is needed (for example on mobile we could disable vim mode, some keyboard shortcuts, etc.).

It will be on the next iOS release.

1 Like

@laurent Have you tried using Markor Markdown Editor? It is excellent, but I believe only for Android.

Not sure if the editor can be used outside of the app, but it would be awesome if Joplin could integrate it.

Markor is a TextEditor for Android. This project aims to make an editor that is versatile, flexible, and lightweight. Markor utilizes simple markup formats like Markdown and todo.txt for note-taking and list management. It is versatile at working with text; it can also be used for keeping bookmarks, copying to clipboard, fast opening a link from text and lots more. Created files are interoperable with any other plaintext software on any platform. Markor is openly developed free software that accepts community contributions.

gsantner/markor - Github

Markor: Markdown Editor - Google Play

Thank you for your amazing software. It's the first time that I've used a Note app to organize all my notes and rely on it exclusively. Used Evernote for a while but got tired of it and my notes got scattered all over different apps like Evernote, Google Keep, Apple Notes, Google Drive files, Dropbox Paper etc. Slowly consolidating them into Joplin. It also became a time consuming hobby :slight_smile:

For info, this post confirms that the performance of this editor is much better, which is a nice added bonus.

1 Like

We use React Native and this is a pure Android editor so we couldn't use that.

1 Like

Beside what is reported above, it's much better than old one.

With this new editor, are there any plan to add a better copy and paste feature in Android that support the basic HTML formats such link, list, heading, image, table, code fence, etc. when copying from website?

This one feature that I really miss since I do most note taking on my phone and tablet while not at home. Right now I have to save link or clip articles and then copy notes when at home using the desktop Jopl6.

Thanks

I like the beta editor :+1: in dark theme/design the cursor is very hard to see though, will switch to light for now.

Yes indeed I couldn't find how to make it brighter but I'd like to fix that.

1 Like

I installed this beta and think it's a nice improvement. Wondering about the checkboxes. Would it be complicated to get those automatically updated?