#109 add width and heigth attributes

cast/blocks.py

@@ -117,6 +117,20 @@ def sizes(self) -> str:
             return "100vw"
         return f"{jpg_renditions[0].width}px"
 
+    @property
+    def width(self) -> int:
+        jpg_renditions = self.renditions["jpeg"]
+        if len(jpg_renditions) == 0:
+            return 0
+        return jpg_renditions[0].width
+
+    @property
+    def height(self) -> int:
+        jpg_renditions = self.renditions["jpeg"]
+        if len(jpg_renditions) == 0:
+            return 0
+        return jpg_renditions[0].height
+
 
 class CastImageChooserBlock(ImageChooserBlock):
     """

cast/static/js/cast/gallery.js

@@ -27,6 +27,8 @@ function setModalImage(el) {
   modalImage.attr('src', curImage.data('modal-src'))
   modalImage.attr('srcset', curImage.data('modal-srcset'))
   modalImage.attr('sizes', curImage.data('modal-sizes'))
+  modalImage.attr('width', curImage.data('modal-width'))
+  modalImage.attr('height', curImage.data('modal-height'))
   modalImage.attr('alt', curImage.attr('alt'))
   // set link for modal image
   modalImage.parent().parent().attr('href', thumbnailPicture.parent().data("full"))

cast/templates/cast/image/image.html

@@ -13,6 +13,8 @@
       src="{{ value.thumbnail.src.jpeg }}"
       srcset="{{ value.thumbnail.srcset.jpeg }}"
       sizes="{{ value.thumbnail.sizes }}"
+      width="{{ value.thumbnail.width }}"
+      height="{{ value.thumbnail.height }}"
       loading="lazy"
     >
   </picture>