jekyll_img 0.2.5 → 0.2.7

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 68b1a33d89b04dfab1851a2ba9adaac2ebeb7b7fbd91428cb2431f008f9226a1
-  data.tar.gz: ac86e8906b8d5e96d7295486f8e7b0ac2f76a825e2f9cd66d6072a5e644c0fb3
+  metadata.gz: 0ec131406e5dce078a0d63a5a821f73b8de66ece127990a8c3fa34a348c9d819
+  data.tar.gz: ed9c9f00d0df3b50ea9409593ccc58fa6aca91d2e8c200a4ece28a8b3fc21aa3
 SHA512:
-  metadata.gz: f44391734629f99eedf6d62579bf3e4342ba334f20b6bc7b67e6a046cca8f774cc8e181fbc9c5c4c0661d6ba532c6cc525a8de62cf6f5ce049eea4c7766bc0b5
-  data.tar.gz: d7fa41d16eb7b23368ce08dddb59574a5c71b5a4afab28705bd16b44ab7b10d527db90e068d51ef91780e1cb950fb1a23953bc5d1922d2c0800a1d81418d34fc
+  metadata.gz: 256b5e033e1f7ab3b08a0e37df0091eb39c67430397da6fb44745cd29e0dbc46fa104efe88b4230ca8d17ecb47014006ae11031895f14cf7031632e702f8cf0d
+  data.tar.gz: 15a4431e31fdef70e180dc0a774f9a9eff410276768d42a7f3b727a72f1b1c30fd87a6242199ddf0898bb1e0fa17aa43ce70cf67b727b3981d85be1aa4ede188

data/CHANGELOG.md

@@ -1,5 +1,18 @@
 # Change Log
 
+## 0.2.7 / 2024-09-11
+
+* Further tweaking of the generated HTML.
+
+
+## 0.2.6 / 2024-09-10
+
+* Optimized the generated HTML.
+  For example, `srcset` elements are now only generated for images that actually exit locally.
+  For remote images, only an `img` element is generated for the specified filetype.
+  The tests can be found in `demo/img_test.html`.
+
+
 ## 0.2.5 / 2024-07-23
 
 * Depends on jekyll_plugin_support v1.0.2

data/README.md

@@ -9,10 +9,6 @@ Muliple image formats are supported for each image.
 The user’s web browser determines the formats which it will accept.
 The most desirable formats that the web browser supports are prioritized.
 
-I explain why the `webp` image format is important in
-[Converting All Images in a Website to `webp` Format](https://mslinn.com/blog/2020/08/15/converting-all-images-to-webp-format.html).
-That article also provides 2 bash scripts for converting existing images to and from <code>webp</code> format.
-
 For example, if an image is encloded in `webp`, `png` and `gif` filetypes,
 and the user&rsquo;s web browser is relatively recent,
 then `webp` format will give the fastest transmission and look best.
@@ -22,56 +18,87 @@ Really old web browsers would only support the `gif` file type.
 
 Please read the next section for details.
 
+I explain why the `webp` image format is important in
+[Converting All Images in a Website to `webp` Format](https://mslinn.com/blog/2020/08/15/converting-all-images-to-webp-format.html).
+That article also provides 2 bash scripts for converting existing images to and from <code>webp</code> format.
+
 See [demo/index.html](demo/index.html) for examples.
 
 
+## External Images
+
+Images whose `src` attribute starts with `http` are not served from the Jekyll website.
+The `jekyll_img` plugin generates HTML for external images using an `img` element with a `src`
+attribute as you might expect.
+
+
 ## Image Fallback
 
-This plugin provides support for many image formats,
-fallbacks to less performant formats by using the HTML
+For local files (files served from the Jekyll website),
+the `jekyll_img` plugin generates HTML that falls back to successively less performant
+formats.
+This is made possible by using a
 [`picture`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/picture) element.
 
-This means that at least one version of every image are required.
+At least one version of every image are required.
+Supported filetypes are:
+`svg`, `webp`, `apng`, `png`, `jpg`, `jpeg`, `jfif`, `pjpeg`, `pjp`, `gif`, `tif`, `tiff`, `bmp`, `ico` and `cur`.
 
-You could specify the desired image with a `webp` filetype, or you could specify no filetype.
-The plugin would generate a `picture` element that contains a primary
-`source` sub-element that specifies the given image URL,
-and secondary `img` sub-element with all other supported filetypes.
-
-For example, these two invocations yield the same result:
+For example, an image file might have the following verions: `blah.webp`, `blah.png` and `blah.jpg`.
+Given a tag invocation like `{% img src='blah.webp' %}`,
+the plugin would generate a `picture` element that contains an `img` sub-element with the given `src` attribute,
+and a `source` element for each related image (`blah.png` and `blah.jpg`).
+Conceptually, the generated HTML might look something like this:
 
 ```html
-{% img src="blah" %}
-{% img src="blah.webp" %}
+<picture>
+  <source srcset="blah.png" />
+  <source srcset="blah.jpg" />
+  <img src="blah.webp" />
+</picture>
 ```
 
-The above generates the following
-(to support the other options, the generated HTML can be a lot more complex):
+If no filetype is given for the image, `webp` is assumed.
+For example, these two invocations yield the same result,
+if `blah.webp` exists on the Jekyll website:
 
 ```html
-<picture>
-  <source srcset="blah.svg" type="image/svg" />
-  <source srcset="blah.webp" type="image/webp" />
-  <source srcset="blah.apng" type="image/apng">
-  <source srcset="blah.png" type="image/png">
-  <source srcset="blah.jpg" type="image/jpeg">
-  <source srcset="blah.jpeg" type="image/jpeg">
-  <source srcset="blah.jfif" type="image/jpeg">
-  <source srcset="blah.pjpeg" type="image/jpeg">
-  <source srcset="blah.pjp" type="image/jpeg">
-  <source srcset="blah.gif" type="image/gif">
-  <source srcset="blah.tif" type="image/tiff">
-  <source srcset="blah.tiff" type="image/tiff">
-  <source srcset="blah.bmp" type="image/bmp">
-  <source srcset="blah.ico" type="image/x-icon">
-  <source srcset="blah.cur" type="image/x-icon">
-  <img src="blah.png" />
-</picture>
+{% img src="blah" %}
+{% img src="blah.webp" %}
 ```
 
 If both `blah.webp` and `blah.png` were available,
 the above would fetch and display `blah.webp` if the web browser supported `webp` format,
 otherwise it would fetch and display `blah.png`.
+If the browser did not support the `picture` element,
+the `img src` attribute would be used to specify the image.
+
+
+### Default and Relative Paths
+
+Local images whose path does not start with a slash are assumed to be relative to `/assets/images`.
+Simply specifying the filename of the image will cause it to be fetched from
+`/assets/images/`.
+For example, the following all fetch the same image:
+
+```html
+{% img src="/assets/images/blah.webp" %}
+{% img src="blah.webp" %}
+{% img src="blah" %}
+```
+
+To specify an image in a subdirectory of where the page resides,
+prepend the relative path with a dot (`.`).
+
+For example, if the current page resides in a [Jekyll collection](https://jekyllrb.com/docs/collections/)
+with path `/collections/_av_studio/`,
+and an image resides in the `/collections/_av_studio/images` subdirectory,
+the following would result in the same image being displayed:
+
+```html
+{% img src="/av_studio/images/blah" %}
+{% img src="./images/blah" %}
+```
 
 
 ## Supported Filetypes
@@ -103,7 +130,7 @@ Run the demo website by typing:
 $ demo/_bin/debug -r
 ```
 
-... and point your web browser to http://localhost:4444
+... and point your web browser to http://localhost:4011
 
 
 ## Usage

data/lib/img_builder.rb

@@ -1,5 +1,9 @@
-# Like RoR's squish method
 class String
+  def remove_blank_lines
+    strip.gsub(/^\s*$\n/, '')
+  end
+
+  # Like RoR's squish method
   def squish
     strip.gsub(/\s+/, ' ')
   end
@@ -7,84 +11,80 @@ end
 
 # Constructs HTML img tag from properties
 class ImgBuilder
+  attr_reader :source
+
   def initialize(props)
     props.compute_dependant_properties
     @props = props
+    @source = Source.new @props.src
   end
 
-  def to_s
-    @props.compute_dependant_properties
-    generate_wrapper
+  def generate_figcaption
+    <<~END_CAPTION
+      <figcaption class='imgFigCaption #{@props.attr_size_class}'>
+        #{@props.url ? generate_url_caption : @props.caption}
+      </figcaption>
+    END_CAPTION
+  end
+
+  def generate_img
+    img_classes = @props.classes || 'rounded shadow'
+    <<~END_IMG
+      <img #{@props.attr_alt}
+        class="imgImg #{img_classes.squish}"
+        src="#{@source.src_fallback}"
+        #{@props.attr_style_img}
+        #{@props.attr_title}
+      />
+    END_IMG
+  end
+
+  # See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/picture
+  def generate_picture
+    return generate_img if @props.src.start_with? 'http'
+
+    # avif is not well supported yet
+    # <source srcset="#{@props.src_any 'avif'}" type="image/avif">
+    result = <<~END_IMG
+      <picture#{@props.attr_id} class='imgPicture'>
+        #{@source.generate.join("\n  ")}
+        #{generate_img}
+      </picture>
+    END_IMG
+    result.strip
+  end
+
+  def generate_url_caption
+    <<~END_URL
+      <a href="#{@props.url}"#{@props.attr_target}#{@props.attr_nofollow}>
+        #{@props.caption}
+      </a>
+    END_URL
   end
 
-  private
+  def generate_url_wrapper
+    <<~END_HTML
+      <a href='#{@props.url}'#{@props.attr_target}#{@props.attr_nofollow} class='imgImgUrl'>
+        #{generate_picture}
+      </a>
+    END_HTML
+  end
 
   def generate_wrapper
     classes = "imgWrapper #{@props.img_display} #{@props.align} #{@props.attr_size_class} #{@props.wrapper_class}".squish
-    result = <<~END_HTML
+    <<~END_HTML.remove_blank_lines
       <div class='#{classes}' style='#{@props.attr_width_style} #{@props.wrapper_style}'>
         #{"<figure>\n" if @props.caption}
-          #{ if @props.url
-               "<a href='#{@props.url}'#{@props.attr_target}#{@props.attr_nofollow} class='imgImgUrl'>#{generate_img}</a>"
-             else
-               generate_img
-             end
-          }
-          #{generate_figure_caption}
+          #{@props.url ? generate_url_wrapper : generate_picture}
+          #{generate_figcaption if @props.caption}
         #{"</figure>\n" if @props.caption}
         #{@props.attribute if @props.attribution}
       </div>
     END_HTML
-    result.strip
   end
 
-  def generate_figure_caption
-    return nil unless @props.caption
-
-    <<~END_CAPTION
-      <figcaption class='imgFigCaption #{@props.attr_size_class}'>
-        #{if @props.url
-            <<~END_URL
-              <a href="#{@props.url}" #{@props.attr_target} #{@props.attr_nofollow}>
-                #{@props.caption}
-              </a>
-            END_URL
-          else
-            @props.caption
-          end
-        }
-      </figcaption>
-    END_CAPTION
-  end
-
-  # See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/picture
-  def generate_img
-    img_classes = @props.classes || 'rounded shadow'
-    <<~END_IMG
-      <picture#{@props.attr_id} class='imgPicture'>
-        <source srcset="#{@props.src_any 'svg'}" type="image/svg">
-        <!---<source srcset="#{@props.src_any 'avif'}" type="image/avif">-->
-        <source srcset="#{@props.src}" type="image/webp">
-        <source srcset="#{@props.src_any 'apng'}" type="image/apng">
-        <source srcset="#{@props.src_any 'png'}" type="image/png">
-        <source srcset="#{@props.src_any 'jpg'}" type="image/jpeg">
-        <source srcset="#{@props.src_any 'jpeg'}" type="image/jpeg">
-        <source srcset="#{@props.src_any 'jfif'}" type="image/jpeg">
-        <source srcset="#{@props.src_any 'pjpeg'}" type="image/jpeg">
-        <source srcset="#{@props.src_any 'pjp'}" type="image/jpeg">
-        <source srcset="#{@props.src_any 'gif'}" type="image/gif">
-        <source srcset="#{@props.src_any 'tif'}" type="image/tiff">
-        <source srcset="#{@props.src_any 'tiff'}" type="image/tiff">
-        <source srcset="#{@props.src_any 'bmp'}" type="image/bmp">
-        <source srcset="#{@props.src_any 'ico'}" type="image/x-icon">
-        <source srcset="#{@props.src_any 'cur'}" type="image/x-icon">
-        <img #{@props.attr_alt}
-          class="imgImg #{img_classes.squish}"
-          src="#{@props.src_png}"
-          #{@props.attr_style_img}
-          #{@props.attr_title}
-        />
-      </picture>
-    END_IMG
+  def to_s
+    @props.compute_dependant_properties
+    generate_wrapper
   end
 end

data/lib/img_props.rb

@@ -1,3 +1,5 @@
+require 'uri'
+
 # Properties from user
 # All methods are idempotent.
 # attr_ methods can be called after compute_dependant_properties
@@ -8,6 +10,7 @@ class ImgProperties
                 :url, :wrapper_class, :wrapper_style
 
   SIZES = %w[eighthsize fullsize halfsize initial quartersize].freeze
+  UNITS = %w[Q ch cm em dvh dvw ex in lh lvh lvw mm pc px pt rem rlh svh svw vb vh vi vmax vmin vw %].freeze
 
   def attr_alt
     "alt='#{@alt}'" if @alt
@@ -67,13 +70,7 @@ class ImgProperties
   end
 
   def src_any(filetype)
-    @src.gsub('.webp', ".#{filetype}")
-  end
-
-  def src_png
-    raise Jekyll::ImgError, "The 'src' parameter was not specified" if @src.to_s.empty?
-
-    @src.gsub('.webp', '.png')
+    @src.gsub(/\..*?$/, ".#{filetype}")
   end
 
   def self.local_path?(src)
@@ -84,7 +81,7 @@ class ImgProperties
   private
 
   def setup_src
-    raise Jekyll::ImgError, "The 'src' parameter was not specified" if @src.nil?
+    raise Jekyll::ImgError, "The 'src' parameter was not specified" if @src.nil? || [true, false].include?(@src)
 
     raise Jekyll::ImgError, "The 'src' parameter was empty" if @src.empty?
 
@@ -101,8 +98,6 @@ class ImgProperties
     # raise Jekyll::ImgError, "#{@src} does not exist" unless File.exist?(src)
   end
 
-  UNITS = %w[Q ch cm em dvh dvw ex in lh lvh lvw mm pc px pt rem rlh svh svw vb vh vi vmax vmin vw %].freeze
-
   def size_unit_specified?
     return false if @size == false || @size.to_s.strip.empty?
 

data/lib/jekyll_img/version.rb

@@ -1,3 +1,3 @@
 module JekyllImgVersion
-  VERSION = '0.2.5'.freeze
+  VERSION = '0.2.7'.freeze
 end

data/lib/jekyll_img.rb

@@ -3,17 +3,18 @@ require 'helper/jekyll_plugin_helper'
 require 'pry'
 require_relative 'img_builder'
 require_relative 'img_props'
+require_relative 'source'
 require_relative 'jekyll_img/version'
 
 # @author Copyright 2023 Michael Slinn
 # @license SPDX-License-Identifier: Apache-2.0
 
 module ImgModule
-  PLUGIN_NAME = 'img'.freeze
+  PLUGIN_NAME = 'img'.freeze unless const_defined?(:PLUGIN_NAME)
 end
 
 module Jekyll
-  ImgError = ::JekyllSupport.define_error
+  ImgError = ::JekyllSupport.define_error unless const_defined?(:ImgError)
 
   # Plugin implementation
   class Img < ::JekyllSupport::JekyllTag
@@ -54,6 +55,6 @@ module Jekyll
       e.html_message
     end
 
-    ::JekyllSupport::JekyllPluginHelper.register(self, ImgModule::PLUGIN_NAME)
+    ::JekyllSupport::JekyllPluginHelper.register(self, ImgModule::PLUGIN_NAME) unless $PROGRAM_NAME.end_with?('/rspec')
   end
 end

data/lib/source.rb

@@ -0,0 +1,98 @@
+class Source
+  RANKS = %w[svg webp apng png jpg jpeg jfif pjpeg pjp gif tif tiff bmp cur ico].freeze
+  RANKS_LENGTH = RANKS.length
+
+  def initialize(path)
+    raise Jekyll::ImgError, "The 'src' parameter was not specified" if path.nil?
+    raise Jekyll::ImgError, "The 'src' parameter was empty" if path.empty?
+
+    path.strip!
+    raise Jekyll::ImgError, "The 'src' parameter only contained whitespace" if path.empty?
+
+    @path = path
+    @absolute_path = @path.start_with?('/')
+  end
+
+  # @return array of source statements for filetypes that exist locally;
+  #         return nil if @path points to a remote image
+  def generate
+    return nil if @path.nil? || @path.start_with?('http')
+
+    result = sorted_files.map do |filename|
+      mtype = mimetype filename
+      next unless mtype
+
+      <<~END_HTML
+        <source srcset="#{filename}" type="#{mtype}">
+      END_HTML
+    end
+    result&.compact&.map(&:strip)
+  end
+
+  # Webp is the least desired variant, png is most desired variant.
+  # @return URL of external image, otherwise return specified path unless it is a webp;
+  #         in which case return most desired image variant that exists.
+  def src_fallback
+    return @path if @path.start_with? 'http'
+
+    result = @absolute_path ? @path.delete_prefix('.') : @path
+    png = result.gsub(/\.webp$/, '.png')
+    return png if File.exist? png
+    return result unless result.end_with? '.webp' # we know @path will be a webp after this
+
+    files = sorted_files
+    return files[0] if files.count == 1
+
+    files.each do |filename|
+      ext = File.extname filename
+      unless ext == '.webp'
+        return @absolute_path ? filename.delete_prefix('.') : filename
+      end
+    end
+    result
+  end
+
+  private
+
+  # Convert absolute paths (which reference the website root) to relative paths for globbing
+  def globbed_path
+    dir = File.dirname @path
+    dir = ".#{dir}" if dir.start_with?('/')
+    base = File.basename @path, ".*"
+    "#{dir}/#{base}.*"
+  end
+
+  def mimetype(path)
+    case File.extname(path)
+    when '.svg'
+      'image/svg'
+    when '.webp'
+      'image/webp'
+    when '.png'
+      'image/png'
+    when '.apng'
+      'image/apng'
+    when %w[.jpg .jpeg .jfif .pjpeg .pjp]
+      'image/jpeg'
+    when '.gif'
+      'image/gif'
+    when %w[.tif .tiff]
+      'image/tiff'
+    when '.bmp'
+      'image/bmp'
+    when %w[cur ico]
+      'image/x-icon'
+      # else
+      # raise Jekyll::ImgError, "#{path} has an unrecognized filetype."
+    end
+  end
+
+  def sorted_files
+    sorted = Dir[globbed_path].sort_by do |path|
+      ext = File.extname(path)&.delete_prefix('.')
+      index = RANKS.index(ext)
+      index || RANKS_LENGTH
+    end
+    sorted.map { |x| @absolute_path ? x.delete_prefix('.') : x }
+  end
+end

data/spec/img_builder_spec.rb

@@ -1,36 +1,69 @@
 require 'rspec/match_ignoring_whitespace'
 require_relative '../lib/img_builder'
 require_relative '../lib/img_props'
+require_relative '../lib/source'
 
 # Test ImgProperties
 class ImgPropertiesTest
   RSpec.describe ImgBuilder do
+    Dir.chdir("demo")
+    props = ImgProperties.new
+    props.src = '/assets/images/jekyll.webp'
+    builder = described_class.new(props)
+
+    it 'generates sources' do
+      actual = builder.source.generate
+      desired = [
+        '<source srcset="/assets/images/jekyll.webp" type="image/webp">',
+        '<source srcset="/assets/images/jekyll.png" type="image/png">'
+      ]
+      expect(actual).to match_array(desired)
+    end
+
+    it 'generates a figcaption' do
+      desired = <<~END_STRING
+        <figcaption class='imgFigCaption '>
+        </figcaption>
+      END_STRING
+      expect(builder.generate_figcaption).to match_ignoring_whitespace(desired)
+    end
+
+    it 'generates a picture' do
+      desired = <<~END_DESIRED
+        <picture class='imgPicture'>
+          <source srcset="/assets/images/jekyll.webp" type="image/webp">
+          <source srcset="/assets/images/jekyll.png" type="image/png">
+          <img class="imgImg rounded shadow"
+            src="/assets/images/jekyll.png"
+            style='width: 100%; '
+          />
+        </picture>
+      END_DESIRED
+      actual = builder.generate_picture
+      expect(actual).to match_ignoring_whitespace(desired)
+    end
+
     it 'generates a default img' do
-      props = ImgProperties.new
-      props.src = 'blah.webp'
-      builder = described_class.new(props)
-      picture = <<~END_IMG
+      desired = <<~END_IMG
         <div class='imgWrapper imgFlex' style=' '>
           <picture class='imgPicture'>
-            <source srcset="/assets/images/blah.webp" type="image/webp">
-            <source srcset="/assets/images/blah.png" type="image/png">
+            <source srcset="/assets/images/jekyll.webp" type="image/webp">
+            <source srcset="/assets/images/jekyll.png" type="image/png">
             <img class="imgImg rounded shadow"
-              src="/assets/images/blah.png"
+              src="/assets/images/jekyll.png"
               style='width: 100%; '
             />
           </picture>
         </div>
       END_IMG
 
-      expect(builder.send(:generate_figure_caption)).to be_nil
-      expect(builder.send(:generate_wrapper)).to        match_ignoring_whitespace(picture)
+      actual = builder.generate_wrapper
+      expect(actual).to match_ignoring_whitespace(desired)
     end
 
-    it 'generates an img with size and caption' do
-      props = ImgProperties.new
+    it 'generates an img wrapper with size and caption' do
       props.caption = 'This is a caption'
       props.size = '123px'
-      props.src = 'blah.webp'
       builder = described_class.new(props)
 
       caption = <<~END_CAPTION
@@ -39,15 +72,15 @@ class ImgPropertiesTest
         </figcaption>
       END_CAPTION
 
-      picture = <<~END_IMG
+      desired = <<~END_IMG
         <div class='imgWrapper imgBlock' style='width: 123px; '>
           <figure>
             <picture class='imgPicture'>
-              <source srcset="/assets/images/blah.webp" type="image/webp">
-              <source srcset="/assets/images/blah.png" type="image/png">
+              <source srcset="/assets/images/jekyll.webp" type="image/webp">
+              <source srcset="/assets/images/jekyll.png" type="image/png">
               <img alt='This is a caption'
                 class="imgImg rounded shadow"
-                src="/assets/images/blah.png"
+                src="/assets/images/jekyll.png"
                 style='width: 100%; '
                 title='This is a caption'
               />
@@ -57,8 +90,8 @@ class ImgPropertiesTest
         </div>
       END_IMG
 
-      expect(builder.send(:generate_figure_caption)).to match_ignoring_whitespace(caption)
-      expect(builder.send(:generate_wrapper)).to        match_ignoring_whitespace(picture)
+      actual = builder.generate_wrapper
+      expect(actual).to match_ignoring_whitespace(desired)
     end
   end
 end

data/spec/img_props_spec.rb

@@ -1,6 +1,6 @@
 require_relative '../lib/img_props'
 
-class ImgProperitesTest
+class ImgPropertiesTest
   RSpec.describe ImgProperties do
     it 'detects relative paths' do
       expect(described_class.local_path?('abcdef')).to be false
@@ -26,15 +26,19 @@ class ImgProperitesTest
       expect(props.attr_target).to        eq(" target='_blank'")
       expect(props.attr_title).to         be_nil
       expect(props.attr_width_style).to   be_nil
-
-      props.compute_dependant_properties
-      expect(props.attr_wrapper_align_class).to eq('inline')
     end
 
+    # it 'defaults to inline alignment' do
+    #   props = described_class.new
+    #   props.src = 'relative/path.webp'
+    #   props.compute_dependant_properties
+    #   expect(props.attr_wrapper_align_class).to eq('inline')
+    # end
+
     it 'raises exception if src was not specified' do
       props = described_class.new
-      expect { props.src_png }.to raise_error(SystemExit)
-      expect { props.send(:setup_src) }.to raise_error(SystemExit)
+      expect { props.compute_dependant_properties }.to raise_error(Jekyll::ImgError)
+      expect { props.send(:setup_src) }.to raise_error(Jekyll::ImgError)
 
       props.src = 'relative/path.webp'
       props.send(:setup_src)
@@ -69,21 +73,18 @@ class ImgProperitesTest
 
       props.size = '100px'
       expect(props.attr_size_class).to be_nil
-      expect(props.attr_style_img).to eq("style='max-width: 100px;'")
+      expect(props.attr_style_img).to eq("style='width: 100%; '")
       expect(props.attr_width_style).to eq('width: 100px;')
 
       props.size = '10%'
       expect(props.attr_size_class).to be_nil
-      expect(props.attr_style_img).to eq("style='max-width: 10%;'")
       expect(props.attr_width_style).to eq('width: 10%;')
+      expect(props.attr_style_img).to eq("style='width: 100%; '")
 
       props.size = 'fullsize'
       expect(props.attr_size_class).to eq('fullsize')
       expect(props.attr_width_style).to be_nil
 
-      props.style = 'width: 30rem;'
-      expect(props.attr_style_img).to eq("style='width: 30rem;'")
-
       props.target = 'moon'
       expect(props.attr_target).to eq(" target='moon'")
 
@@ -95,17 +96,5 @@ class ImgProperitesTest
       expect(props.attr_size_class).to be_nil
       expect(props.attr_width_style).to eq('width: 100px;')
     end
-
-    it 'generates proper alignment attributes' do
-      props = described_class.new
-
-      props.align = 'inline'
-      props.compute_dependant_properties
-      expect(props.attr_wrapper_align_class).to eq('inline')
-
-      props.align = 'center'
-      props.compute_dependant_properties
-      expect(props.attr_wrapper_align_class).to eq('center')
-    end
   end
 end

data/spec/jekyll_img_spec.rb

@@ -1,9 +1,11 @@
 require 'jekyll'
 require 'jekyll_plugin_logger'
+require 'helper/jekyll_plugin_helper'
+require 'jekyll_plugin_support'
 require 'rspec/match_ignoring_whitespace'
 require_relative '../lib/jekyll_img'
 
-Registers = Struct.new(:page, :site)
+Registers = Struct.new(:page, :site) unless defined? :Registers
 
 # Mock for Collections
 class Collections
@@ -46,14 +48,15 @@ class MyTest
     let(:parse_context) { TestParseContext.new }
 
     let(:helper) do
-      JekyllPluginHelper.new(
+      ::JekyllSupport::JekyllPluginHelper.new(
         'img',
         'src="./blah.webp"',
-        logger
+        logger,
+        false
       )
     end
 
-    it 'has no cite or url' do
+    xit 'has no cite or url' do
       helper.reinitialize('src="./blah.webp"')
       img = described_class.send(
         :new,
@@ -61,10 +64,11 @@ class MyTest
         helper.markup.dup,
         parse_context
       )
-      result = img.send(:render_impl, helper.markup)
-      expect(result).to match_ignoring_whitespace <<-END_RESULT
+      actual = img.render_impl
+      desired = <<~END_DESIRED
         <img src="./blah.webp">
-      END_RESULT
+      END_DESIRED
+      expect(actual).to match_ignoring_whitespace(desired)
     end
   end
 end

data/spec/source_spec.rb

@@ -0,0 +1,87 @@
+require 'rspec/match_ignoring_whitespace'
+require_relative '../lib/source'
+
+# Test ImgProperties
+class ImgPropertiesTest
+  RSpec.describe Source do
+    Dir.chdir("#{__dir__}/../demo")
+    source_absolute = described_class.new('/assets/images/jekyll_240x103.webp')
+    source_relative = described_class.new('./assets/images/jekyll_240x103.webp')
+
+    it 'globs absolute paths' do
+      expect(source_absolute.send(:globbed_path)).to eq("./assets/images/jekyll_240x103.*")
+    end
+
+    it 'globs relative paths' do
+      expect(source_relative.send(:globbed_path)).to eq("./assets/images/jekyll_240x103.*")
+    end
+
+    it 'sorts files with absolute path' do
+      actual = source_absolute.send(:sorted_files)
+      desired = [
+        "/assets/images/jekyll_240x103.webp",
+        "/assets/images/jekyll_240x103.png",
+        "/assets/images/jekyll_240x103.jpg",
+        "/assets/images/jekyll_240x103.gif",
+        "/assets/images/jekyll_240x103.txt"
+      ]
+      expect(actual).to eq(desired)
+    end
+
+    it 'sorts files with relative path' do
+      actual = source_relative.send(:sorted_files)
+      desired = [
+        "./assets/images/jekyll_240x103.webp",
+        "./assets/images/jekyll_240x103.png",
+        "./assets/images/jekyll_240x103.jpg",
+        "./assets/images/jekyll_240x103.gif",
+        "./assets/images/jekyll_240x103.txt"
+      ]
+      expect(actual).to eq(desired)
+    end
+
+    it 'generates mimetype for absolute paths' do
+      expect(source_absolute.send(:mimetype, 'blah.png')).to  eq('image/png')
+      expect(source_absolute.send(:mimetype, 'blah.svg')).to  eq('image/svg')
+      expect(source_absolute.send(:mimetype, 'blah.webp')).to eq('image/webp')
+      expect(source_absolute.send(:mimetype, 'blah.gif')).to  eq('image/gif')
+      expect(source_absolute.send(:mimetype, 'blah.blah')).to be_nil
+    end
+
+    it 'generates mimetype for relative paths' do
+      expect(source_relative.send(:mimetype, 'blah.png')).to  eq('image/png')
+      expect(source_relative.send(:mimetype, 'blah.svg')).to  eq('image/svg')
+      expect(source_relative.send(:mimetype, 'blah.webp')).to eq('image/webp')
+      expect(source_relative.send(:mimetype, 'blah.gif')).to  eq('image/gif')
+      expect(source_relative.send(:mimetype, 'blah.blah')).to be_nil
+    end
+
+    it 'generates source fallback for absolute paths' do
+      expect(source_absolute.src_fallback).to eq("/assets/images/jekyll_240x103.png")
+    end
+
+    it 'generates source fallback for relative paths' do
+      expect(source_relative.src_fallback).to eq("./assets/images/jekyll_240x103.png")
+    end
+
+    it 'generates sources for absolute paths' do
+      actual = source_absolute.generate.join("\n")
+      desired = <<~END_DESIRED
+        <source srcset="/assets/images/jekyll_240x103.webp" type="image/webp">
+        <source srcset="/assets/images/jekyll_240x103.png" type="image/png">
+        <source srcset="/assets/images/jekyll_240x103.gif" type="image/gif">
+      END_DESIRED
+      expect(actual).to match_ignoring_whitespace(desired)
+    end
+
+    it 'generates sources for relative paths' do
+      actual = source_relative.generate.join("\n")
+      desired = <<~END_DESIRED
+        <source srcset="./assets/images/jekyll_240x103.webp" type="image/webp">
+        <source srcset="./assets/images/jekyll_240x103.png" type="image/png">
+        <source srcset="./assets/images/jekyll_240x103.gif" type="image/gif">
+      END_DESIRED
+      expect(actual).to match_ignoring_whitespace(desired)
+    end
+  end
+end

data/spec/status_persistence.txt

@@ -0,0 +1,16 @@
+example_id                      | status | run_time        |
+------------------------------- | ------ | --------------- |
+./spec/img_builder_spec.rb[1:1] | failed | 14.37 seconds   |
+./spec/img_builder_spec.rb[1:2] | failed | 0.01498 seconds |
+./spec/img_builder_spec.rb[1:3] | failed | 0.00093 seconds |
+./spec/img_props_spec.rb[1:1]   | passed | 0.00393 seconds |
+./spec/img_props_spec.rb[1:2]   | passed | 0.00006 seconds |
+./spec/img_props_spec.rb[1:3]   | passed | 0.00673 seconds |
+./spec/img_props_spec.rb[1:4]   | passed | 4.65 seconds    |
+./spec/img_props_spec.rb[1:5]   | passed | 0.00009 seconds |
+./spec/jekyll_img_spec.rb[1:1]  | failed | 40.84 seconds   |
+./spec/source_spec.rb[1:1]      | passed | 0.00089 seconds |
+./spec/source_spec.rb[1:2]      | passed | 0.0045 seconds  |
+./spec/source_spec.rb[1:3]      | passed | 0.00687 seconds |
+./spec/source_spec.rb[1:4]      | passed | 0.00071 seconds |
+./spec/source_spec.rb[1:5]      | passed | 1.72 seconds    |

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: jekyll_img
 version: !ruby/object:Gem::Version
-  version: 0.2.5
+  version: 0.2.7
 platform: ruby
 authors:
 - Mike Slinn
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2024-08-20 00:00:00.000000000 Z
+date: 2024-09-11 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: jekyll
@@ -55,10 +55,13 @@ files:
 - lib/img_props.rb
 - lib/jekyll_img.rb
 - lib/jekyll_img/version.rb
+- lib/source.rb
 - spec/img_builder_spec.rb
 - spec/img_props_spec.rb
 - spec/jekyll_img_spec.rb
+- spec/source_spec.rb
 - spec/spec_helper.rb
+- spec/status_persistence.txt
 homepage: https://www.mslinn.com/jekyll_plugins/jekyll_img.html
 licenses:
 - MIT
@@ -94,5 +97,7 @@ test_files:
 - spec/img_builder_spec.rb
 - spec/img_props_spec.rb
 - spec/jekyll_img_spec.rb
+- spec/source_spec.rb
 - spec/spec_helper.rb
+- spec/status_persistence.txt
 ...