View-Mode: AsciiDoc convert support

[aisbergde]

⚠️ This issue respects the following points: ⚠️

• This is a enhancement/feature request. Not a bug or question.
• The topic is not already reported at Issues. (I've searched it).
• Markor is up to date. See Releases for the latest version. Updates are available from F-Droid and GitHub.
• The wanted feature/enhancement is not present in the latest code version (git master). (Please download and try the test version of Markor, named Mordor. Don't worry; Markor and Mordor appear as completely separate applications. You can install both side-by-side, and Markor's settings are not touched. If your desired feature is present, you don't need to open this issue. The change will be part of the next Markor update.)

Description

After the implementation of #808 (new format: AsciiDoc) more features like AsciiDoc Preview should be implemented.
For this purpose, there is "AsciidoctorJ: Java Bindings for Asciidoctor":
https://docs.asciidoctor.org/asciidoctorj/latest/

And what and how to install a preview (with it, among other things):

• https://coderwall.com/p/gt2t-g/enjoy-the-magic-of-asciidoctor-in-java
• https://www.baeldung.com/asciidoctor

Why a separate issue?

• Add format: AsciiDoc (Highlighter, TextActions) #808 can be taken off first without overloading the implementation too much with features
• you could involve more AsciiDoc-affine developers in the project later.

I am ready to assigned. But maybe some support would be required.

Information

Android version:
Device:
App Version:

Source

F-Droid

Format / File type

Something else (-> Additional info)

Additional info / Log

-

[gsantner]

To my understanding, this is a ruby gem and contains native code. Meaning Markor gets from all-architecture-supported-by-one-pure-java-application APK to requiring a own build per platform. Can you please check this?
At Markor I can only see pure java implementations as viable - otherwise it bloats the app highly and it means Markor is not lightweight anymore ... and it should stay lightweight.

[aisbergde]

I have to check.

My idea was

• first to get the basic implementation merged.
• then to announce this in the AsciiDoc community
• then to find some developers to contribute.

Can we keep this issue as a placeholder, until clarification?

IMHO: In General, there would be several ways:

• to implement some "light" syntax highlighting
• to have a look at what exists (for example asciidoctor)

Also for the preview, I can imagine a light way: the user can install a browser (like kiwi browser), supporting chrome extensions. Then he can implement the AsciiDoc plugin to render AsciiDoc as html. And somehow Markor will make the adoc files in any way available for the browser, but rendering will be an external job.

Currently, I am using "NiM Web Server" on Android, to provide the content to the web browser.

[gsantner]

you can move this new comment to the pull request and remove it here. not really is about the issue itself, but about the goals of the pull request.

[aisbergde]

it could be converted from an issue into a discussion? If it is just a comment to the pull request, it could be lost.

[gsantner]

It won't be lost unless somebody deletes it, which we don't do. Wherever it is written to. And splitting up to discuss something on 5 different places not makes it easier 😄 . So please just write in the merge request 👍🏻

[gsantner]

Suggestion and seemingly the least bloating option without too much dependencies:
Adding a copy of the Asciidoctor.js (as seen at the official Asciidoc website) file to Markor, export text to view mode with a wrapper block and convert on js side directly.

so like <link rel="js"><div id="content">{{ user text }}</div>
<script>var parsed=asciidocjs.parse(content.innerText); content.innerHTML = parsed;</script>

[TimReset]

I have just checked - asciidoctor.js - it's a similar lib as asciidoctorJ - Ruby port for JS. And size is similar.
So, @gsantner is your statement about "and it should stay lightweight." still valid?
Because I don't see any options to support AsciiDoc in Markor except using Ruby port - either Java or JS.

[aisbergde]

I don't know what to do.
I was able to do the Java part, based on the idea, how Markdown support was implemented. But I am overwhelmed with the preview.

[TimReset]

So, I tried to use asciidocj but it uses java.lang.invoke.MethodHandle and java.lang.invoke.SwitchPoint
To fix the first requirement - need to increase an android version to 26, but android jvm doesn't have SwitchPoint anyway.
And I tried to use asciidoc.js. It works:

I'll make that code more productive ready and create a pull request.

PS size of asciidocjs min is ~700KB

[gsantner]

thanks for trying both. Increasing minimum Android version to 26 (and locking out a huge part of Markor users) is definetley no option.

So as you got asciidoc.js to work, nice! How much (filesize) are the (js/css) files you need to add? And how much does the size of the apk increase by that roughly? As far I understood asciidocjs basically is a ruby-installation-compiled-to-javascript plus the asciidoc stuff (which could be big in terms of size).

Btw dont worry about making about all features (like html export) too much, it's OK to make a merge request with the bare minimum for first 😃.

[TimReset]

10569KB

[TimReset]

I have created a pr
#2022

So, actually there is still a problem - need to support dark mode.
But to do that need to rewrite asciidoctor.css.

[gsantner]

@TimReset

Regarding dark mode I have a idea.

So instead of adding multiple files, or manipulating color hex strings by i.e. search+replace at runtime....It might be a good idea to use CSS variables instead. So to i.e. change the most important stuff to i.e. --var(text-color, #fallback) and the colors come then in by generic means - so it also uses Markor's usual text/background/ahref-link colors. For the most part I don't think we need to change up the color/stle (like .blue { #somebluehexcolor doesn't need anything different by light or dark).

What do you think about that? If you think thats a good idea, I can help by taking care of the rather generic stuff and ou would need to take care to change the asciidoctor css file to use --var.

[gsantner]

One of the things that are important to me is that adding asciidoc converter does not blow up the (APK) filesize for users. As far I can see the resulting binary filesize does not blow up as much I thought. Around half megabyte more of course is not nothing, but it's OK I'd say 😄 .

[TimReset]

@gsantner
About dark theme:
I agree - I tried to google, how to implement dark theme and the first result is use variables in css. Actually my main problem is how to choose correct colors for dark theme. I'm a server side developer and UI/UX are not my strong skills :-)

About apk size:
I don't know android very well and don't know how to find out what the file consists of, what is the biggest part of apk.
So, did you research that? Maybe we can remove something? eg, some fat libs.

[gsantner]

Markor has for most things already some standard/default colors, so don't worry too much about it. For many things it might be enough to not specify any color at all at asciidoctor.css (i.e. removing the line).

The point was, due your change of adding asciidocjs the resulting binary file size increased by ~half megabyte. It's not about anything else. And I'd say it's a increase that doesn't hurt.

[aisbergde]

Regarding colors:

I tried to select colors, which are fine for red-green color deficiency individuals, like me. I tried to optimize them for a light and a dark theme. But this was related to the editor for "source code".
Final preview could be different.

In General I am fine with the default light theme, but regarding to
https://docs.asciidoctor.org/asciidoctor/latest/html-backend/default-stylesheet/#are-there-different-themes
dedicated AsciiDoc skins exist
https://github.com/darshandsoni/asciidoctor-skins

[TimReset]

Wow. I tried to find something like that but no luck. I'll check, thanks!

[TimReset]

I finally manage to do that with some hacks:

And I added check to net.gsantner.markor.frontend.textview.AutoTextFormatter#autoIndent bcz I had an exception in:
indent = source + oLine.line.substring(0, oLine.indent);
due to oLine.indent = -1 or -31
Definitely it could be fixed more gracefully but I have no idea how. net.gsantner.markor.frontend.textview.AutoTextFormatter.ListLine#isEmpty = false and I can't rely on this boolean variable

[TimReset]

So, Any ideas what needs to be improved next?
I thought about MermaidJS.

[gsantner]

So you would be interested in more contributions? Very welcome!

Generally said, contributors should do what they are interested. Unlike commercial products there is nothing assigned, pre-announced or pre-decided ""this features is worked on and released in next version"" 😄 .

What I suggest to do next is: Make a proper AsciiDoc example document showcasing all of it's features and syntax. Similar to the markdown-reference.md file. Also I can see that the image links in the existing asciidoc sample do not render. But they do at Markdown sample, so should be doable.

I do not use asciidoc (currently). So it would be especially important that AsciiDoc is good wrapped up from all directions by somebody who knows it good, since I probably won't touch it too much.

[aisbergde]

So, Any ideas what needs to be improved next?
I thought about MermaidJS.

Light theme for Asciidoc preview 😍

[TimReset]

So, Any ideas what needs to be improved next?
I thought about MermaidJS.

Light theme for Asciidoc preview 😍

Oh, my fault - I really thought I implemented it correctly!
Here is small pr (I tested - it's dark in dark mode and light in light mode)
#2092

@aisbergde