Updated to cope with multiple images and figures, and to deal with indivdual images.

Also renamed and updated readme.

Signed-off-by: Duncan Lock <duncan.lock@gmail.com>

better_figures/__init__.py

@@ -1 +0,0 @@
-from .better_figures import *

better_figures/better_figures.py

@@ -1,60 +0,0 @@
-"""
-Better Figures
--------
-
-This plugin adds the width of the contained image to .figures.
-
-
-<div class="figure">
-    <img alt="map to buried treasure" src="/static/images/dunc_smiling_192x192.jpg" />
-    <p class="caption">
-        This is the caption of the figure (a simple&nbsp;paragraph).
-    </p>
-    <div class="legend">
-        The legend consists of all elements after the caption. In this
-        case, the legend consists of this paragraph.
-    </div>
-</div>
-
-"""
-
-import types
-import os
-
-from pelican import signals
-
-from bs4 import BeautifulSoup
-from PIL import Image
-
-
-def initialized(pelican):
-    pass
-
-
-def content_object_init(instance):
-
-    def _get_content(self):
-        content = self._content
-        return content
-
-    instance._get_content = types.MethodType(_get_content, instance)
-
-    if instance._content is not None:
-        content = instance._content
-        if 'figure' in content:
-            soup = BeautifulSoup(content)
-            fig = soup.find("div", {"class": "figure"})
-            img = instance.settings['PATH'] + '/images/' + os.path.split(fig.img['src'])[1]
-            im = Image.open(img)
-            # if im.size[0] >= 500 and im.size[1] >= 500:
-
-            style = 'width: {}px;'.format(im.size[0])
-            fig['style'] = style
-            fig.img['style'] = style
-
-            instance._content = soup.decode()
-
-
-def register():
-    signals.initialized.connect(initialized)
-    signals.content_object_init.connect(content_object_init)

better_figures_and_images/__init__.py

@@ -0,0 +1 @@
+from .better_figures_and_images import *

better_figures_and_images/better_figures_and_images.py

@@ -0,0 +1,65 @@
+"""
+Better Figures & Images
+-------
+
+This plugin:
+
+- Adds a style="width: ???px;" to each image in the content
+- Also adds the width of the contained image to any parent div.figures.
+
+
+<div class="figure">
+    <img alt="map to buried treasure" src="/static/images/dunc_smiling_192x192.jpg" />
+    <p class="caption">
+        This is the caption of the figure (a simple&nbsp;paragraph).
+    </p>
+    <div class="legend">
+        The legend consists of all elements after the caption. In this
+        case, the legend consists of this paragraph.
+    </div>
+</div>
+
+"""
+
+import types
+import os
+
+from pelican import signals
+
+from bs4 import BeautifulSoup
+from PIL import Image
+
+
+def content_object_init(instance):
+
+    def _get_content(self):
+        content = self._content
+        return content
+
+    instance._get_content = types.MethodType(_get_content, instance)
+
+    if instance._content is not None:
+        content = instance._content
+        soup = BeautifulSoup(content)
+
+        if 'img' in content:
+            for img in soup('img'):
+                src = instance.settings['PATH'] + '/images/' + os.path.split(img['src'])[1]
+                im = Image.open(src)
+                extra_style = 'width: {}px;'.format(im.size[0])
+                if img.get('style'):
+                    img['style'] += extra_style
+                else:
+                    img['style'] = extra_style
+                fig = img.find_parent('div', 'figure')
+                if fig:
+                    if fig.get('style'):
+                        fig['style'] += extra_style
+                    else:
+                        fig['style'] = extra_style
+
+        instance._content = soup.decode()
+
+
+def register():
+    signals.content_object_init.connect(content_object_init)

better_figures_and_images/readme.rst

@@ -1,9 +1,11 @@
 Summary
 ===========
 
-This plug-in finds any `div class="figures"` tags in the output, finds the image contained inside each one,
-then checks the dimensions of the image file and adds the appropriate style="width: ???px;" to both the img tag
-and it's containing div.figure tag.
+This plug-in:
+
+- Adds a `style="width: ???px;"` attribute to any `<img>` tags in the content, by checking
+the dimensions of the image file and adding the appropriate style="width: ???px;" to the `<img>` tag.
+- Also finds any `div class="figures"` tags in the content, that contain images and adds the same style to them too.
 
 
 Assuming that the image is 250px wide, it turns output like this:
@@ -32,4 +34,3 @@ into output like this:
 	    </div>
 	</div>
 
-TODO: Currently only does the first figure, not all of them