Can't see image in preview

Chris2011 commented 8 years ago

When I add an image with: Alt text I only see a broken symbol inside the preview, but if I push the md file to my github repo, everything works fine. You can see the result here: https://github.com/Chris2011/NbToggleWindows. Is this a parser problem? Do flow-netbeans-markdown use a different markdown parser for this?

Regards

Chris

madflow commented 8 years ago

Well we surely use another markdown parser then GIthub ;). But I do not think this is the issue here.

I believe the issue could be the leading slash "/" . Try deleting it. Github renders the preview on the web. The markdown plugin tries to find the image on a filesystem. '/screenshots/NbToggleWindows.gif' is a perfectly valid unix path.

Just a guess - untested...

Chris2011 commented 8 years ago

I tested it and now the broken image is gone, and the image too ^^ so I don't see anything now.

Chris2011 commented 8 years ago

Ok to implement an image for me here it is a gif, it slows down the whole IDE if I have a split view and see the preview next to the source.

Chris2011 commented 8 years ago

The same happens when I switch to preview without have a splitted view.

spyhunter99 commented 7 years ago

Hmm i'm using the syntax ![](images/home.png) which works during maven site generation but the preview (all flavors) do not render the image. What am i doing wrong?

edit: when previewing in a browser, it looks like it generates html in a temp folder but does not copy over image resources or referenced images into the temp folder.

madflow commented 7 years ago

@spyhunter99 Empty alt tags work for me when I am doing this (hacky):

![''](images/home.png)

The markdown spec http://daringfireball.net/projects/markdown/syntax#img is very unspecific about if you can ommit the alt tag. Our parser "Pegdown" https://github.com/sirthias/pegdown follows these specs closely.

Images work in the browser preview for me. The preview tries to expand the relative path to the image to a absolute filesystem path. This works for me on Arch Linux here.

spyhunter99 commented 7 years ago

that fixed it for me, thanks!

spyhunter99 commented 7 years ago

@madflow any chance i can request (or perhaps help) with another preview issue specific to maven site configs. maven's site plugin expects content in the following

src/site/markdown/index.md src/site/resources/images/image.png

in the markdown file, it's referenced as images/image.png. Unfortunately, it looks like it has to be in this directory structure in order for site generation to work, however in this config, the image previews do not work. If i move the images folder into the markdown folder, then preview works great, however when the images are not included with site generation. Bugger!

madflow commented 7 years ago

@spyhunter99 I don't think that this is possible just out of the box with the preview of the plugin. But - you could use Javascript in your export template for this. You could search for all images with the wrong path and replace the src with the correct path.

Options->Miscellaneous->Markdown->HTML Export

Proof of concept :D :

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>{%TITLE%}</title>
</head>
<body>
{%CONTENT%}
<script>

    var images = document.getElementsByTagName('img');

    for(i = 0;i < images.length; i++) {
        var image = images[i];

        image.src = 'http://i.giphy.com/l3q2L1oZdT7X60cU0.gif';
    }
</script>

Or in your case something like image.src.replace('src/site/markdown/', 'src/site/resources/');

spyhunter99 commented 7 years ago

@madflow oh that's amazing. thanks!

madflow / flow-netbeans-markdown

Can't see image in preview #101