jgrassler / mkdocs-pandoc

[unmaintained] mkdocs -> pandoc converter: use this fork https://github.com/twardoch/mkdocs-combine
Apache License 2.0
107 stars 39 forks source link

Additional html <img> tags filter for pandoc(1) flavoured markdown conversion #10

Open ghost opened 8 years ago

ghost commented 8 years ago

Problem: MkDocs only shows resized pictures if they are written in html tags. The pandoc conversion from markdown to pdf will simply cut out all html inliners since the extension raw_html would be ignored. The conversion from markdown to html and finally to pdf will drop any alignment information in tables which would be available in conversion from markdown to pdf.

Idea: The conversion triggered by mkdocs2pandoc > docs.pd could already check for html tags and change them to markdown inliners. /mkdocs_pandoc/filters/ contains filters like the images.py. A suggestion for a new filter would be html_images.py.

Suggested solution: In /mkdocs_pandoc/pandoc_converter.py add

import mkdocs_pandoc.filters.html_images

and below def init(self, **kwargs):

        self.filter_html_img = True

Above lines_tmp = f_headlevel.run(lines_tmp) add

            if self.filter_html_img:
                lines_tmp = f_html_image.run(lines_tmp)

html_images.py:

import re

class ImageFilter(object):
    def run(self, lines):
        ret = []
        for line in lines:
            done = {}
            while True:
                src = ''
                alt = ''
                title = ''
                width_height = ''
                matchImg = re.search(r'<img ([^>]*)>([^<]*</img>)?', line)

                # image in html style?
                if matchImg:
                    if matchImg.group(0) in done:
                        break
                    allInfoElems = matchImg.group(1)
                    srcMatch = re.search(r'src=\"([^>\"]*)\"', allInfoElems)
                    src=srcMatch.group(1)
                    altMatch = re.search(r'alt=\"([^>\"]*)\"', allInfoElems)
                    if altMatch:
                        alt=altMatch.group(1)
                    titleMatch = re.search(r'title=\"([^>\"]*)\"', allInfoElems)
                    if titleMatch:
                        title=" \""+titleMatch.group(1)+"\""
                    widthMatch = re.search(r'width=\"([^>\"]*)\"', allInfoElems)
                    if widthMatch:
                        width="width="+widthMatch.group(1)+"px "
                    heightMatch = re.search(r'height=\"([^>\"]*)\"', allInfoElems)
                    if heightMatch:
                        height="height="+heightMatch.group(1)+"px "
                    if width != "" or height != "":
                        width_height="{ "+width+height+"}"
                else:
                    break
                line = re.sub(r'<img [^>]*>([^<]*</img>)?',
                    '![%s](%s%s)%s' % (alt, src, title, width_height), line)
                done[matchImg.group(0)] = True
            ret.append(line)
        return ret
jgrassler commented 8 years ago

Provided pandoc can handle images with height/width, this looks like a good idea, yes. Can you turn this into a pull request (I presume you've got the modified code anyway) and provide a test case so I can try it out?

I'm a bit busy right now (which is why I haven't even gotten around to properly testing and merging the fix for https://github.com/jgrassler/mkdocs-pandoc/issues/9 ) but I'll try to get around to it soonish and cut a new release with the patches from both #9 and #10.

cudmore commented 8 years ago

This would be a wonderful addition and very useful to my small site http://cudmore.github.io/treadmill