WebP, SVG and Placeholder Video Thumbnail Support.

[setanarut]

I know, Github's README.MD does not support inline SVG , WebP and videos. Maybe features specific to macOS can be considered.

The Quick Look HTML preview supports the following;

• SVG
• WebP (Animated and Static)
• Placeholder Video Thumbnail

QLMarkdown cannot display the following;

Inline HTML

• WebP (Animated and Static) - <img src="image.webp" alt="">
• Placeholder Video Thumbnail - <source src="video.mov" type="video/mp4">

Markdown

• SVG - ![SVG](image.svg)
• WebP - ![WEBP](image.webp)

Note: Embedded webp is not displayed. <img src="data:image/webp;base64........

[sbarex]

The .svg and .webp images are in the same folder of the markdown file?
On my mac the svg and webp preview works.

In the app editor if you write by hand the code the images are searched from the resource bundle of the app. Otherwise if you open an .md file, the basedir is the folder of the .md file.

[setanarut]

The .svg and .webp images are in the same folder of the markdown file?
On my mac the svg and webp preview works.

In the app editor if you write by hand the code the images are searched from the resource bundle of the app. Otherwise if you open an .md file, the basedir is the folder of the .md file.

Yes, The .svg and .webp images are in the same folder. I tested every condition, it doesn't work for me.

![test](./test.svg)

[sbarex]

Can you share the .md and .svg file?

[setanarut]

@sbarex https://yadi.sk/d/HZ0pKfqjy0LO-g

[sbarex]

Please try release 17.

Regarding the preview of the videos I don't think to implement it. Security restrictions prevent you from accessing video files from the quick look preview.
An extension should be created that analyzes the .md file looking for html code containing a video, reads the file, obtains the preview and inserts it in the formatted html code...
Moreover Apple does not directly manage many video formats (webm, mkv, avi, ...) and you should use external libraries such as ffmpeg.
A lot of work for a non-standard functionality for the .md language.

[setanarut]

Please try release 17.

Regarding the preview of the videos I don't think to implement it. Security restrictions prevent you from accessing video files from the quick look preview.
An extension should be created that analyzes the .md file looking for html code containing a video, reads the file, obtains the preview and inserts it in the formatted html code...
Moreover Apple does not directly manage many video formats (webm, mkv, avi, ...) and you should use external libraries such as ffmpeg.
A lot of work for a non-standard functionality for the .md language.

Thanks, video thumbnails is not important. SVG fixed but WEBP is still not displayed. ![test](./webp_test.webp)

[setanarut]

Quick Look doesn't play animated webp by default. I think QLMarkdown should show static WebP.

[sbarex]

In the terminal, what is the output of this command?

$ file --mime-type PATH_OF_WEBP_FILE

It should be image/webp.
Also, if the QLMarkdown app in on the Applications folder try this command:

file --mime-type -m /Applications/QLMarkdown.app/Contents/Resources/magic.mgc PATH_OF_WEBP_FILE

The result should always be image/webp.

Can you provide a webp animated file?

[setanarut]

➜  Desktop file --mime-type ./webp_test.webp                   
./webp_test.webp: image/webp
➜  Desktop file --mime-type -m /Applications/QLMarkdown.app/Contents/Resources/magic.mgc ./webp_test.webp 
./webp_test.webp: image/webp

webp images
https://developers.google.com/speed/webp/gallery1

[sbarex]

on release 18 should be fixed (also support for animated .webp).

[setanarut]

@sbarex SVG works if this option is selected. but this is not inline HTML code -> ![test](./test.svg). This is a valid Markdown syntax. This is confusing for the end user. Indicates that these options are unreliable.

[sbarex]

This behavior is caused by cmark.

When html content is not allowed, it automatically performs a series of extra checks in search of dangerous content. For the images, it checks their url, removing any it thinks are not safe. In the case of the data: scheme (used to embed the image file inside the html output preventing the security limitation of the Quick Look engine) only these mime types are allowed: image/png image/gif, image/jpeg, image/webp.

[setanarut]

I think, you should write this in the documentation. --> "This option must be selected for SVG preview"