jekyll_img 0.1.0

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA256:
+  metadata.gz: 3b26f4329c93cd70afacb09303d63ac2d437b70b559403c0b4dfb0dbde060794
+  data.tar.gz: 9df636b6567ca51f02314d892a38a885032c8c320809fc4609dc83e82bcaf361
+SHA512:
+  metadata.gz: fed0376534157a78447d4e5db766f9913833d0acddb41fb150d877ba35620f4b55fc3c89f986f695574930df89026ef4b02259f42ff71442cd3b340d595c07ec
+  data.tar.gz: b9ac7072163f1be7d578fe2705b75b5489c6379e5a91e30882263bb62a78dfe53dde295d8842c86e1f87b55016ba827d310af9491eb2b4f7fd84e0c584650de0

data/.rubocop.yml

@@ -0,0 +1,41 @@
+AllCops:
+  Exclude:
+      - vendor/**/*
+      - exe/**/*
+      - Gemfile*
+      - Rakefile
+  NewCops: enable
+  TargetRubyVersion: 2.6
+
+Layout/HashAlignment:
+  Enabled: false
+
+Layout/LineLength:
+  Max: 150
+
+Layout/MultilineMethodCallIndentation:
+  Enabled: false
+
+Metrics/AbcSize:
+  Max: 40
+
+Metrics/BlockLength:
+  Max: 30
+  Exclude:
+    - jekyll_img.gemspec
+    - spec/img_props_spec.rb
+
+Metrics/CyclomaticComplexity:
+  Max: 10
+
+Metrics/MethodLength:
+  Max: 30
+
+Metrics/PerceivedComplexity:
+  Max: 10
+
+Style/FrozenStringLiteralComment:
+  Enabled: false
+
+Style/TrailingCommaInHashLiteral:
+  Enabled: false

data/CHANGELOG.md

@@ -0,0 +1,2 @@
+## 0.1.0 / 2023-01-12
+  * Initial version

data/LICENSE.txt

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2020 Mike Slinn
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

data/README.md

@@ -0,0 +1,173 @@
+`jekyll_img`
+[![Gem Version](https://badge.fury.io/rb/jekyll_img.svg)](https://badge.fury.io/rb/jekyll_img)
+===========
+
+`Jekyll_img` is a Jekyll plugin that displays images,
+and provides support for captions and URLs.
+
+See [demo/index.html](demo/index.html) for examples.
+
+Run the demo website by typing:
+```shell
+$ demo/_bin/debug -r
+```
+... and point your web browser to http://localhost:4444
+
+
+## Usage
+    {% img [Options] src='path' %}
+
+`Options` are:
+
+ - `align="left|inline|right|center"` Default value is `inline`
+ - `alt="Alt text"` Default value is the `caption` text, if provided
+ - `caption="A caption"` No default value
+ - `classes="class1 class2 classN"` Extra <img> classes; default is `rounded shadow`
+ - `id="someId"` No default value
+ - `nofollow`  Generates `rel='nofollow'`; only applicable when `url` is specified
+ - `size='eighthsize|fullsize|halfsize|initial|quartersize|XXXYY|XXX%'`
+   Defines width of image.
+   - `initial` is the default behavior.
+   - `eighthsize`, `fullsize`, `halfsize`, and `quartersize` are relative to the enclosing tag's width.
+   - CSS units can also be used, for those cases `XXX` is a float and `YY` is `unit` (see below)
+ - `style='css goes here'` CSS style for <img>; no default
+ - `target='none|whatever'` Only applicable when `url` is specified; default value is `_blank`
+ - `title="A title"` Default value is `caption` text, if provided
+ - `url='https://domain.com'` No default value
+ - `wrapper_class='class1 class2 classN'` Extra CSS classes for wrapper <div>; no default value
+ - `wrapper_style='background-color: black;'` CSS style for wrapper <div>; no default value
+
+[`unit`](https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Values_and_units#numbers_lengths_and_percentages) is one of: `Q`, `ch`, `cm`, `em`, `dvh`, `dvw`, `ex`, `in`, `lh`,
+`lvh`, `lvw`, `mm`, `pc`, `px`, `pt`, `rem`, `rlh`, `svh`, `svw`, `vb`,
+`vh`, `vi`, `vmax`, `vmin`, or `vw`.
+
+CSS classes referenced by the `jekyll_img` plugin are at the bottom of [demo/assets/css/style.css](demo/assets/css/style.css). CSS marker classes are included, so CSS selectors can be used for additional styling.
+
+
+## Design
+The most significant design issue was the decision that image size and formatting should not change
+whether it had a caption.
+HTML captions exist within a `<figure />` element, which also surrounds the image.
+
+I also wanted to ensure that captions would wrap text under an image,
+and would not be wider than the image they were associated with.
+
+CSS behavior differs for `<figure />` and `<img />`.
+For example, centering, floating right and left.
+That means the CSS and where it would need to be applied are completely different for
+naked `<img />` and `<figure />` tags.
+Handling all possible situations of these two scenarios would significantly raise the complexity of the plugin code. I know, because I went down that rabbit hole.
+
+
+### Wrapper &lt;div /&gt;
+To make the plugin code more manageable,
+the plugin always encloses the generated HTML & CSS within a wrapper `<div />`.
+The wrapper allows for a simple, consistent approach regardless of whether a caption is generated or not.
+
+The wrapper width is identical to the displayed image width.
+Within the wrapper `<div />`, the embedded `<img />` is displayed with `width=100%`.
+If a caption is required, the generated `<figure />` only makes the space taken by the generated HTML longer;
+the image width and height is not affected.
+
+The wrapper will not exceed the width of the tag that encloses it if the `size` parameter has values `eighthsize`, `fullsize`, `halfsize`, `initial` or `quartersize`.
+
+The wrapper's width can be defined independently of its enclosing tag by using [CSS units](https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Values_and_units#numbers_lengths_and_percentages) for the `size` parameter:
+`Q`, `ch`, `cm`, `em`, `dvh`, `dvw`, `ex`, `in`, `lh`,
+`lvh`, `lvw`, `mm`, `pc`, `px`, `pt`, `rem`, `rlh`, `svh`, `svw`, `vb`,
+`vh`, `vi`, `vmax`, `vmin`, or `vw`.
+Using CSS units means that large enough values could cause the image to exceed the width of its enclosing tag.
+
+
+## Installation
+
+Add this line to your Jekyll project's Gemfile, within the `jekyll_plugins` group:
+
+```ruby
+group :jekyll_plugins do
+  gem 'jekyll_img'
+end
+```
+
+Also add it to `_config.yml`:
+```yaml
+plugins:
+  - jekyll_img
+```
+
+And then execute:
+
+    $ bundle install
+
+
+## Additional Information
+More information is available on
+[Mike Slinn&rsquo;s website](https://www.mslinn.com/blog/2020/10/03/jekyll-plugins.html).
+
+
+## Development
+After checking out the repo, run `bin/setup` to install dependencies.
+
+You can also run `bin/console` for an interactive prompt that will allow you to experiment.
+
+
+To build and install this gem onto your local machine, run:
+```shell
+$ bundle exec rake install
+jekyll_img 0.1.0 built to pkg/jekyll_img-0.1.0.gem.
+jekyll_img (0.1.0) installed.
+```
+
+Examine the newly built gem:
+```shell
+$ gem info jekyll_img
+
+*** LOCAL GEMS ***
+
+jekyll_img (0.1.0)
+    Author: Mike Slinn
+    Homepage:
+    https://github.com/mslinn/jekyll_img
+    License: MIT
+    Installed at: /home/mslinn/.gems
+
+    Generates Jekyll logger with colored output.
+```
+
+### Testing
+Examine the output by running:
+```shell
+$ demo/_bin/debug -r
+```
+... and pointing your web browser to http://localhost:4444/
+
+### Unit Tests
+Either run `rspec` from Visual Studio Code's *Run and Debug* environment
+(<kbd>Ctrl</kbd>-<kbd>shift</kbd>-<kbd>D</kbd>) and view the *Debug Console* output,
+or run it from the command line:
+```shell
+$ rspec
+```
+
+### Build and Push to RubyGems
+To release a new version,
+  1. Update the version number in `version.rb`.
+  2. Commit all changes to git; if you don't the next step might fail with an unexplainable error message.
+  3. Run the following:
+     ```shell
+     $ bundle exec rake release
+     ```
+     The above creates a git tag for the version, commits the created tag,
+     and pushes the new `.gem` file to [RubyGems.org](https://rubygems.org).
+
+
+## Contributing
+
+1. Fork the project
+2. Create a descriptively named feature branch
+3. Add your feature
+4. Submit a pull request
+
+
+## License
+
+The gem is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).

data/Rakefile

@@ -0,0 +1,5 @@
+require 'bundler/gem_tasks'
+require 'rspec/core/rake_task'
+
+RSpec::Core::RakeTask.new(:spec)
+task default: :spec

data/jekyll_img.gemspec

@@ -0,0 +1,42 @@
+require_relative 'lib/jekyll_img/version'
+
+Gem::Specification.new do |spec| # rubocop:disable Metrics/BlockLength
+  github = 'https://github.com/mslinn/jekyll_img'
+
+  spec.bindir = 'exe'
+  spec.authors = ['Mike Slinn']
+  spec.email = ['mslinn@mslinn.com']
+  spec.files = Dir['.rubocop.yml', 'LICENSE.*', 'Rakefile', '{lib,spec}/**/*', '*.gemspec', '*.md']
+  spec.homepage = 'https://www.mslinn.com/blog/2020/10/03/jekyll-plugins.html#quote'
+  spec.license = 'MIT'
+  spec.metadata = {
+    'allowed_push_host' => 'https://rubygems.org',
+    'bug_tracker_uri'   => "#{github}/issues",
+    'changelog_uri'     => "#{github}/CHANGELOG.md",
+    'homepage_uri'      => spec.homepage,
+    'source_code_uri'   => github,
+  }
+  spec.name = 'jekyll_img'
+  spec.post_install_message = <<~END_MESSAGE
+
+    Thanks for installing #{spec.name}!
+
+  END_MESSAGE
+  spec.require_paths = ['lib']
+  spec.required_ruby_version = '>= 2.6.0'
+  spec.summary = 'Provides a Jekyll filter that creates formatted quotes.'
+  spec.test_files = spec.files.grep %r{^(test|spec|features)/}
+  spec.version = JekyllImgVersion::VERSION
+
+  spec.add_dependency 'jekyll', '>= 3.5.0'
+  spec.add_dependency 'jekyll_plugin_support', '>= 0.3.0'
+
+  # spec.add_development_dependency 'debase'
+  spec.add_development_dependency 'rspec'
+  spec.add_development_dependency 'rspec-match_ignoring_whitespace'
+  spec.add_development_dependency 'rubocop'
+  # spec.add_development_dependency 'rubocop-jekyll'
+  spec.add_development_dependency 'rubocop-rake'
+  spec.add_development_dependency 'rubocop-rspec'
+  spec.add_development_dependency 'ruby-debug-ide'
+end

data/lib/img_builder.rb

@@ -0,0 +1,75 @@
+# Like RoR's squish method
+class String
+  def squish
+    strip.gsub(/\s+/, ' ')
+  end
+end
+
+# Constructs HTML img tag from properties
+class ImgBuilder
+  def initialize(props)
+    props.compute_dependant_properties
+    @props = props
+  end
+
+  def to_s
+    @props.compute_dependant_properties
+    generate_wrapper
+  end
+
+  private
+
+  def generate_wrapper
+    classes = "imgWrapper #{@props.img_display} #{@props.align} #{@props.attr_size_class} #{@props.wrapper_class}".squish
+    result = <<~END_HTML
+      <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}
+        #{"</figure>\n" if @props.caption}
+      </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}" type="image/webp">
+        <source srcset="#{@props.src_png}" type="image/png">
+        <img #{@props.attr_alt}
+          class="imgImg #{img_classes.squish}"
+          src="#{@props.src_png}"
+          #{@props.attr_style_img}
+          #{@props.attr_title}
+        />
+      </picture>
+    END_IMG
+  end
+end

data/lib/img_props.rb

@@ -0,0 +1,97 @@
+# Properties from user
+# All methods are idempotent.
+# attr_ methods can be called after compute_dependant_properties
+# All methods except compute_dependant_properties can be called in any order
+class ImgProperties
+  attr_accessor :align, :alt, :attr_wrapper_align_class, :caption, :classes, :id, :img_display, :nofollow, \
+                :src, :size, :style, :target, :title, :url, :wrapper_class, :wrapper_style
+
+  SIZES = %w[eighthsize fullsize halfsize initial quartersize].freeze
+
+  def attr_alt
+    "alt='#{@alt}'" if @alt
+  end
+
+  def attr_id
+    " id='#{@id}'" if @id
+  end
+
+  # <img> tag assets, except alignment classes (inline, left, center, right)
+  def attr_img_classes
+    @classes || 'rounded shadow'
+  end
+
+  def attr_nofollow
+    " rel='nofollow'" if @nofollow
+  end
+
+  def attr_size_class
+    return nil if @size.nil? || size_unit_specified?
+
+    abort "'#{@size}' is not a recognized size; must be one of #{SIZES.join(', ')}, or an explicit unit." \
+      unless SIZES.include?(@size)
+    @size
+  end
+
+  def attr_style_img
+    "style='width: 100%; #{@style}'".squish
+  end
+
+  def attr_target
+    return nil if @target == 'none'
+
+    target = @target || '_blank'
+    " target='#{target}'"
+  end
+
+  def attr_title
+    "title='#{@title}'" if @title && !@title.empty?
+  end
+
+  def attr_width_style
+    "width: #{@size};" if size_unit_specified?
+  end
+
+  def compute_dependant_properties
+    setup_src
+
+    @target ||= '_blank'
+
+    @img_display = @caption && @size ? 'imgBlock' : 'imgFlex'
+
+    @alt   ||= @caption || @title
+    @title ||= @caption || @alt # rubocop:disable Naming/MemoizedInstanceVariableName
+  end
+
+  def src_png
+    abort 'src parameter was not specified' if @src.to_s.empty?
+
+    @src.gsub('.webp', '.png')
+  end
+
+  def self.local_path?(src)
+    first_char = src[0]
+    first_char.match?(%r{[./]})
+  end
+
+  private
+
+  def setup_src
+    @src = @src.to_s.strip
+    abort 'src parameter was not specified' if @src.empty?
+
+    @src = "/assets/images/#{@src}" unless ImgProperties.local_path?(@src) || url?(@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.to_s.strip.empty?
+
+    @size.end_with?(*UNITS)
+  end
+
+  def url?(src)
+    src.start_with? 'http'
+  end
+end

data/lib/jekyll_img/version.rb

@@ -0,0 +1,3 @@
+module JekyllImgVersion
+  VERSION = '0.1.0'.freeze
+end

data/lib/jekyll_img.rb

@@ -0,0 +1,41 @@
+require 'jekyll_plugin_support'
+require 'jekyll_plugin_support_helper'
+require_relative 'img_builder'
+require_relative 'img_props'
+require_relative 'jekyll_img/version'
+
+# @author Copyright 2023 Michael Slinn
+# @license SPDX-License-Identifier: Apache-2.0
+
+module ImgModule
+  PLUGIN_NAME = 'img'.freeze
+end
+
+module Jekyll
+  # Plugin implementation
+  class Img < JekyllSupport::JekyllTag
+    def render_impl
+      props = ImgProperties.new
+      props.align         = @helper.parameter_specified?('align') || 'inline'
+      props.alt           = @helper.parameter_specified? 'alt'
+      props.caption       = @helper.parameter_specified? 'caption'
+      props.classes       = @helper.parameter_specified? 'class'
+      props.id            = @helper.parameter_specified? 'id'
+      props.nofollow      = @helper.parameter_specified? 'nofollow'
+      props.size          = @helper.parameter_specified?('size') || @helper.parameter_specified?('_size')
+      props.src           = @helper.parameter_specified? 'src'
+      props.style         = @helper.parameter_specified? 'style'
+      props.target        = @helper.parameter_specified? 'target'
+      props.title         = @helper.parameter_specified? 'title'
+      props.url           = @helper.parameter_specified? 'url'
+      props.wrapper_class = @helper.parameter_specified? 'wrapper_class'
+      props.wrapper_style = @helper.parameter_specified? 'wrapper_style'
+
+      @builder = ImgBuilder.new(props)
+      @builder.to_s
+    end
+  end
+end
+
+PluginMetaLogger.instance.info { "Loaded #{ImgModule::PLUGIN_NAME} v0.1.0 plugin." }
+Liquid::Template.register_tag(ImgModule::PLUGIN_NAME, Jekyll::Img)

data/spec/img_builder_spec.rb

@@ -0,0 +1,64 @@
+require 'rspec/match_ignoring_whitespace'
+require_relative '../lib/img_builder'
+require_relative '../lib/img_props'
+
+# Test ImgProperties
+class ImgPropertiesTest
+  RSpec.describe ImgBuilder do # rubocop:disable Metrics/BlockLength
+    it 'generates a default img' do
+      props = ImgProperties.new
+      props.src = 'blah.webp'
+      builder = ImgBuilder.new(props)
+      picture = <<~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">
+            <img class="imgImg rounded shadow"
+              src="/assets/images/blah.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)
+    end
+
+    it 'generates an img with size and caption' do
+      props = ImgProperties.new
+      props.caption = 'This is a caption'
+      props.size = '123px'
+      props.src = 'blah.webp'
+      builder = ImgBuilder.new(props)
+
+      caption = <<~END_CAPTION
+        <figcaption class='imgFigCaption '>
+          This is a caption
+        </figcaption>
+      END_CAPTION
+
+      picture = <<~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">
+              <img alt='This is a caption'
+                class="imgImg rounded shadow"
+                src="/assets/images/blah.png"
+                style='width: 100%; '
+                title='This is a caption'
+              />
+            </picture>
+            #{caption}
+          </figure>
+        </div>
+      END_IMG
+
+      expect(builder.send(:generate_figure_caption)).to match_ignoring_whitespace(caption)
+      expect(builder.send(:generate_wrapper)).to        match_ignoring_whitespace(picture)
+    end
+  end
+end

data/spec/img_props_spec.rb

@@ -0,0 +1,112 @@
+require_relative '../lib/img_props'
+
+# Test ImgProperties
+class ImgProperitesTest
+  RSpec.describe ImgProperties do # rubocop:disable Metrics/BlockLength
+    it 'detects relative paths' do
+      expect(ImgProperties.local_path?('abcdef')).to be false
+      expect(ImgProperties.local_path?('./abc')).to  be true
+      expect(ImgProperties.local_path?('/abc')).to   be true
+    end
+
+    it 'has other class methods' do
+      props = ImgProperties.new
+      expect(props.send(:size_unit_specified?)).to be false
+      expect(props.send(:url?, 'blah')).to         be false
+      expect(props.send(:url?, 'http://blah')).to  be true
+    end
+
+    it 'does not generate attributes for most empty properties' do
+      props = ImgProperties.new
+      expect(props.attr_alt).to           be nil
+      expect(props.attr_img_classes).to   eq('rounded shadow')
+      expect(props.attr_id).to            be nil
+      expect(props.attr_nofollow).to      be nil
+      expect(props.attr_size_class).to    be nil
+      expect(props.attr_style_img).to     eq("style='width: 100%; '")
+      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 'raises exception if src was not specified' do
+      props = ImgProperties.new
+      expect { props.src_png }.to raise_error(SystemExit)
+      expect { props.send(:setup_src) }.to raise_error(SystemExit)
+
+      props.src = 'relative/path.webp'
+      props.send(:setup_src)
+      expect(props.src).to eq('/assets/images/relative/path.webp')
+
+      props.src = './local/path.webp'
+      props.send(:setup_src)
+      expect(props.src).to eq('./local/path.webp')
+
+      props.src = '/absolute/path.webp'
+      props.send(:setup_src)
+      expect(props.src).to eq('/absolute/path.webp')
+    end
+
+    it 'generates proper simple attributes' do # rubocop:disable Metrics/BlockLength
+      props = ImgProperties.new
+
+      props.alt = 'blah'
+      expect(props.attr_alt).to eq("alt='blah'")
+
+      props.classes = 'blah'
+      expect(props.attr_img_classes).to eq('blah')
+
+      props.id = 'blah'
+      expect(props.attr_id).to eq(" id='blah'")
+
+      props.nofollow = true
+      expect(props.attr_nofollow).to eq(" rel='nofollow'")
+
+      props.size = 'initial'
+      expect(props.attr_size_class).to eq('initial')
+
+      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_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%;')
+
+      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'")
+
+      props.title = 'The End'
+      expect(props.attr_title).to eq("title='The End'")
+
+      props.size = '100px'
+      props.caption = 'A caption'
+      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 = ImgProperties.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

@@ -0,0 +1,72 @@
+# frozen_string_literal: true
+
+require 'jekyll'
+require 'jekyll_plugin_logger'
+require 'rspec/match_ignoring_whitespace'
+require_relative '../lib/jekyll_img'
+
+Registers = Struct.new(:page, :site)
+
+# Mock for Collections
+class Collections
+  def values
+    []
+  end
+end
+
+# Mock for Site
+class SiteMock
+  attr_reader :config
+
+  def collections
+    Collections.new
+  end
+end
+
+# Mock for Liquid::ParseContent
+class TestParseContext < Liquid::ParseContext
+  attr_reader :line_number, :registers
+
+  def initialize
+    super
+    @line_number = 123
+
+    @registers = Registers.new(
+      { },
+      SiteMock.new
+    )
+  end
+end
+
+# These tests all fail because I have not figured out how to provide a Jekyll block body to a test
+class MyTest
+  RSpec.describe Jekyll::Img do
+    let(:logger) do
+      PluginMetaLogger.instance.new_logger(self, PluginMetaLogger.instance.config)
+    end
+
+    let(:parse_context) { TestParseContext.new }
+
+    let(:helper) do
+      JekyllPluginHelper.new(
+        'img',
+        'src="./blah.webp"',
+        logger
+      )
+    end
+
+    it 'has no cite or url' do
+      helper.reinitialize('src="./blah.webp"')
+      quote = Jekyll::Img.send(
+        :new,
+        'img',
+        helper.markup.dup,
+        parse_context
+      )
+      result = quote.send(:render_impl, helper.markup)
+      expect(result).to match_ignoring_whitespace <<-END_RESULT
+        <img src="./blah.webp">
+      END_RESULT
+    end
+  end
+end

data/spec/spec_helper.rb

@@ -0,0 +1,11 @@
+require 'jekyll'
+require_relative '../lib/jekyll_img'
+
+RSpec.configure do |config|
+  config.filter_run :focus
+  config.order = 'random'
+  config.run_all_when_everything_filtered = true
+
+  # See https://relishapp.com/rspec/rspec-core/docs/command-line/only-failures
+  config.example_status_persistence_file_path = 'spec/status_persistence.txt'
+end

data/spec/status_persistence.txt

@@ -0,0 +1,10 @@
+example_id                      | status | run_time        |
+------------------------------- | ------ | --------------- |
+./spec/img_builder_spec.rb[1:1] | passed | 0.00073 seconds |
+./spec/img_props_spec.rb[1:1]   | passed | 0.0001 seconds  |
+./spec/img_props_spec.rb[1:2]   | passed | 0.00008 seconds |
+./spec/img_props_spec.rb[1:3]   | failed | 0.00051 seconds |
+./spec/img_props_spec.rb[1:4]   | passed | 0.0011 seconds  |
+./spec/img_props_spec.rb[1:5]   | passed | 0.00019 seconds |
+./spec/img_props_spec.rb[1:6]   | failed | 0.00008 seconds |
+./spec/jekyll_img_spec.rb[1:1]  | failed | 0.00037 seconds |

metadata

@@ -0,0 +1,184 @@
+--- !ruby/object:Gem::Specification
+name: jekyll_img
+version: !ruby/object:Gem::Version
+  version: 0.1.0
+platform: ruby
+authors:
+- Mike Slinn
+autorequire:
+bindir: exe
+cert_chain: []
+date: 2023-01-20 00:00:00.000000000 Z
+dependencies:
+- !ruby/object:Gem::Dependency
+  name: jekyll
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: 3.5.0
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: 3.5.0
+- !ruby/object:Gem::Dependency
+  name: jekyll_plugin_support
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: 0.3.0
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: 0.3.0
+- !ruby/object:Gem::Dependency
+  name: rspec
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+- !ruby/object:Gem::Dependency
+  name: rspec-match_ignoring_whitespace
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+- !ruby/object:Gem::Dependency
+  name: rubocop
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+- !ruby/object:Gem::Dependency
+  name: rubocop-rake
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+- !ruby/object:Gem::Dependency
+  name: rubocop-rspec
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+- !ruby/object:Gem::Dependency
+  name: ruby-debug-ide
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+description:
+email:
+- mslinn@mslinn.com
+executables: []
+extensions: []
+extra_rdoc_files: []
+files:
+- ".rubocop.yml"
+- CHANGELOG.md
+- LICENSE.txt
+- README.md
+- Rakefile
+- jekyll_img.gemspec
+- lib/img_builder.rb
+- lib/img_props.rb
+- lib/jekyll_img.rb
+- lib/jekyll_img/version.rb
+- spec/img_builder_spec.rb
+- spec/img_props_spec.rb
+- spec/jekyll_img_spec.rb
+- spec/spec_helper.rb
+- spec/status_persistence.txt
+homepage: https://www.mslinn.com/blog/2020/10/03/jekyll-plugins.html#quote
+licenses:
+- MIT
+metadata:
+  allowed_push_host: https://rubygems.org
+  bug_tracker_uri: https://github.com/mslinn/jekyll_img/issues
+  changelog_uri: https://github.com/mslinn/jekyll_img/CHANGELOG.md
+  homepage_uri: https://www.mslinn.com/blog/2020/10/03/jekyll-plugins.html#quote
+  source_code_uri: https://github.com/mslinn/jekyll_img
+post_install_message: |2+
+
+  Thanks for installing jekyll_img!
+
+rdoc_options: []
+require_paths:
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: 2.6.0
+required_rubygems_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+requirements: []
+rubygems_version: 3.3.3
+signing_key:
+specification_version: 4
+summary: Provides a Jekyll filter that creates formatted quotes.
+test_files:
+- spec/img_builder_spec.rb
+- spec/img_props_spec.rb
+- spec/jekyll_img_spec.rb
+- spec/spec_helper.rb
+- spec/status_persistence.txt
+...