[ENH] More org-mode functionalities in preview pane

[omarcospo]

Would be cool to have it render more features of org-mode like tables, tables of contents (A bar at the side with the headings would be nice), descriptive URLs, images and syntax highlighting in code blocks (this one seems a little audacious). But I don't know if those things are exactly stuff that you can solve, maybe have more with the parser.

[tefkah]

ToC is a great idea! Images should already work though, do they not for you? They don't look great yet (aspect ratio is a bit wonky) but they should at least display.

Syntax highlighting is not difficult to implement at all (in fact it's already there, just commented out) but I couldn't get the css to work right yet, I'll try to add it asap.

Not exactly sure what you mean with descriptive urls though, care to enlighten me?

[omarcospo]

Images doesn't display for me, I tried with some files and any difference, I thought it was just a feature not implemented.
Descriptive URLs are this type of thing [[https://something.nice.com][That's a pretty website]] that should look like this That's a pretty website. For me they don't show as clickable links and doesn't have any highlighting.

[tefkah]

Could you show me an example of a file which has images that do not display? And where do you store the images?
I have images linked like this which works

* Some headline

Look, an image! [[./media/image.png]]

Wow, another image [[/usr/me/org/media/image.png]]

[tefkah]

The external links indeed do not work, I'll fix that!
Also tables should "work", they just don't have a lot of markup yet (no table lines). Tables are hard to make look pretty, I'm trying to think of a good default style.

[omarcospo]

Could you show me an example of a file which has images that do not display? And where do you store the images? I have images linked like this which works

* Some headline

Look, an image! [[./media/image.png]]

Wow, another image [[/usr/me/org/media/image.png]]

I tried with and without the html properties, local and remote files. But they don't display.

[omarcospo]

The external links indeed do not work, I'll fix that! Also tables should "work", they just don't have a lot of markup yet (no table lines). Tables are hard to make look pretty, I'm trying to think of a good default style.

Yup, some tables look nicer than other like these:

[omarcospo]

Another thing that I saw and would be cool to have, is the #+RESULTS: of code blocks show in a distinguished block too, because now they just load as simple text.

[tefkah]

The images thing should now be fixed, let me know if you run up against any other cases that don't work! The aspect ratio is still not correct but that's because Next is kind of annoying about nonlocal images, I'm still figuring that out.

[tefkah]

External links should now also show properly, although i'll need to come up with a more general solution eventually.

[omarcospo]

Images are displayed now, however, local images not. They just open in the default image viewer.

The same images, the first in the right rendered properly inside the side panel but the second one just open in the image viewer.
The file for reference:

Tested in Chromium and Min to see if make difference, but it doesn't.

[omarcospo]

The external links are indeed working just fine.

[tefkah]

Hmmm I'm having a hard time reproducing this, it works fine for me

With this as the source.

#+ATTR_HTML: :width 40% :align center
[[/Users/thomas/desktop/emacs.png]]

or this

#+ATTR_HTML: :width 40% :align center
[[file:/Users/thomas/desktop/emacs.png]]

as the source.

[tefkah]

I am on MacOS though, I can test this on my Linux machine later

[tefkah]

Could you inspect the source of where that image is supposed to be? F12 to bring it up

[omarcospo]

---

I have this error in the console though:

---

Following the link I got this:

[tefkah]

That's very strange.
Could you try both

(org-link-decode "/home/label/pix/emacs")

and (in a temp buffer!)

(insert-file-contents-literally "home/label/pix/emacs")

I wonder what causes your Emacs to instead try to open the file, because the problem is Emacs-side.

[tefkah]

Although I can remember having this problem myself as well, but that was only when visiting the url, but I thought I solved that in any case.

[omarcospo]

That's the output

[tefkah]

That is indeed what's supposed to happen. Hmmm.

[alexandergogl]

Hi! Thank you for the great work :) Have you found a solution to fix the problem with the image ratio?

[tefkah]

Not yet! Could you perhaps make a separate issue for this? Will be easier for me to keep track of it

[alexandergogl]

Yes, I did just now. Thanks for looking into it.

[lckarssen]

For those interested, I added a quick 'n' dirty "hack" locally to have example blocks (used for output of code blocks I evaluated) render with a monospace font and without line wraps.

The "hack" consists of adding

.exampe{font-family:SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:1em;white-space:pre-wrap;}

to the out/index.html file, which can be found in your local directory where the package was installed. This block of CSS code should be added in the html{} portion of the index.html file. Given that it looks a lot like code, I added it before the pre,code,kbd,samp CSS block.

Note: the missing l in exampe is not a typo. That's the class used to render begin_example/end_example Org blocks.