jekyll_picture_tag 1.9.0 → 1.10.0

data/lib/jekyll_picture_tag/instructions/set.rb

@@ -34,6 +34,24 @@ module PictureTag
         @source_images ||= build_source_images
       end
 
+      def crop(media = nil)
+        params.geometries[media] || preset.crop(media)
+      end
+
+      def gravity(media = nil)
+        params.gravities[media] || preset.gravity(media)
+      end
+
+      # Returns a class constant for the selected output format, which is used
+      # to dynamically instantiate it.
+      def output_class
+        Object.const_get(
+          'PictureTag::OutputFormats::' + Utils.titleize(preset['markup'])
+        )
+      end
+
+      private
+
       def build_source_images
         source_names = params.source_names
         media_presets = params.media_presets
@@ -48,14 +66,6 @@ module PictureTag
 
         sources
       end
-
-      # Returns a class constant for the selected output format, which is used
-      # to dynamically instantiate it.
-      def output_class
-        Object.const_get(
-          'PictureTag::OutputFormats::' + Utils.titleize(preset['markup'])
-        )
-      end
     end
   end
 end

data/lib/jekyll_picture_tag/instructions/tag_parser.rb

@@ -1,105 +1,95 @@
 module PictureTag
   module Instructions
-    # This tag takes the arguments handed to the liquid tag, and extracts the
-    # preset name (if present), source image name(s), and associated media
-    # queries (if present). The leftovers (html attributes) are handed off to
-    # its respective class.
+    # Tag Parsing Responsibilities:
+    #
+    #  {% picture mypreset a.jpg 3:2 mobile: b.jpg --alt "Alt" --link "/" %}
+    # |  Jekyll  |           TagParser            |    HTMLAttributes    |
+    #
+    # This class takes the arguments handed to the liquid tag (given as a simple
+    # string), hands them to ArgSplitter (which breaks them up into an array of
+    # words), extracts the preset name (if present), source image name(s),
+    # associated media queries (if present), and image-related arguments such as
+    # crop and gravity. HTML attributes are handed off to its respective class
+    # (as 'leftovers')
+    #
+    # Media presets and source names are stored as arrays in their correct
+    # orders. Gravities and geometries are stored in a hash, keyed by their
+    # relevant media presets. Note that the base image will have a media preset
+    # of nil, which is a perfectly fine hash key.
+    #
     class TagParser
-      attr_reader :preset_name, :source_names, :media_presets
-      def initialize(raw_params)
-        build_params PictureTag::Utils.liquid_lookup(raw_params)
+      attr_reader :preset_name, :source_names, :media_presets, :gravities,
+                  :geometries, :leftovers
 
-        @preset_name = grab_preset_name
+      def initialize(raw_params)
+        @raw_params = raw_params
+        @params = split_params
 
-        # The first param specified will be our base image, so it has no
-        # associated media query.
         @media_presets = []
-        @source_names = [] << strip_quotes(@params.shift)
+        @source_names = []
+        @geometries = {}
+        @gravities = {}
 
-        # Detect and store arguments of the format 'media_query: img.jpg' as
-        # keys and values.
-        add_media_source while @params.first =~ /[\w\-]+:$/
-      end
-
-      def leftovers
-        @params
+        parse_params
       end
 
       private
 
-      def add_media_source
-        @media_presets << @params.shift.delete_suffix(':')
-        @source_names << strip_quotes(@params.shift)
+      def split_params
+        ArgSplitter
+          .new(Utils.liquid_lookup(@raw_params))
+          .words
       end
 
-      # First param is the preset name, unless it's a filename.
-      def grab_preset_name
-        if @params.first.include? '.'
-          'default'
-        else
-          @params.shift
-        end
-      end
-
-      # Originally separating arguments was just handled by splitting the raw
-      # params on spaces. To handle quotes and backslash escaping, we have to
-      # parse the string by characters to break it up correctly. I'm sure
-      # there's a library to do this, but it's not that much code honestly. If
-      # this starts getting big, we'll pull in a new dependency.
-      def build_params(raw_params)
-        @params = []
-        @word = ''
-        @in_quotes = false
-        @escaped = false
+      def parse_params
+        @preset_name = determine_preset_name
+        @source_names << strip_quotes(@params.shift)
 
-        raw_params.each_char { |c| handle_char(c) }
+        parse_param(@params.first) until stop_here? @params.first
 
-        add_word # We have to explicitly add the last one.
+        @leftovers = @params
       end
 
-      def handle_char(char)
-        # last character was a backslash:
-        if @escaped
-          close_escape char
+      def parse_param(param)
+        if param.match?(/[\w\-]+:$/)
+          add_media_source
 
-        # char is a backslash or a quote:
-        elsif char.match(/["\\]/)
-          handle_special char
+        elsif Utils::GRAVITIES.include?(param.downcase)
+          @gravities[@media_presets.last] = @params.shift
 
-        # Character isn't whitespace, or it's inside double quotes:
-        elsif @in_quotes || char.match(/\S/)
-          @word << char
+        elsif param.match?(Utils::GEOMETRY_REGEX)
+          @geometries[@media_presets.last] = @params.shift
 
-        # Character is whitespace outside of double quotes:
         else
-          add_word
+          raise_error(param)
         end
       end
 
-      def handle_special(char)
-        if char == '\\'
-          @escaped = true
-        elsif char == '"'
-          @in_quotes = !@in_quotes
-          @word << char
-        end
+      # HTML attributes are handled by its own class; once we encounter them
+      # we are finished here.
+      def stop_here?(param)
+        # No param    Explicit HTML attribute   Implicit HTML attribute
+        param.nil? || param.match?(/^--\S*/) || param.match?(/^\w*="/)
       end
 
-      def add_word
-        return if @word.empty?
-
-        @params << @word
-        @word = ''
+      def add_media_source
+        @media_presets << @params.shift.delete_suffix(':')
+        @source_names << strip_quotes(@params.shift)
       end
 
-      def close_escape(char)
-        @word << char
-        @escaped = false
+      # The first param is the preset name, unless it's a filename.
+      def determine_preset_name
+        @params.first.include?('.') ? 'default' : @params.shift
       end
 
       def strip_quotes(name)
         name.delete_prefix('"').delete_suffix('"')
       end
+
+      def raise_error(param)
+        raise ArgumentError, "Could not parse '#{param}' in the following "\
+          "tag: \n  {% picture #{@raw_params} %}"
+      end
     end
   end
 end

data/lib/jekyll_picture_tag/output_formats/basic.rb

@@ -71,22 +71,28 @@ module PictureTag
 
       # GeneratedImage class, not HTML
       def build_fallback_image
-        fallback = GeneratedImage.new(
+        return fallback_candidate if fallback_candidate.exists?
+
+        build_new_fallback_image
+      end
+
+      def fallback_candidate
+        @fallback_candidate ||= GeneratedImage.new(
           source_file: PictureTag.source_images.first,
           format: PictureTag.fallback_format,
-          width: PictureTag.fallback_width
+          width: PictureTag.fallback_width,
+          crop: PictureTag.crop,
+          gravity: PictureTag.gravity
         )
-
-        return fallback if fallback.exists?
-
-        build_new_fallback_image
       end
 
       def build_new_fallback_image
         GeneratedImage.new(
           source_file: PictureTag.source_images.first,
           format: PictureTag.fallback_format,
-          width: checked_fallback_width
+          width: checked_fallback_width,
+          crop: PictureTag.crop,
+          gravity: PictureTag.gravity
         )
       end
 
@@ -107,15 +113,26 @@ module PictureTag
         content.add_parent anchor
       end
 
+      def source
+        PictureTag.source_images.first
+      end
+
+      def source_width
+        if PictureTag.crop
+          fallback_candidate.cropped_source_width
+        else
+          source.width
+        end
+      end
+
       def checked_fallback_width
-        source = PictureTag.source_images.first
         target = PictureTag.fallback_width
 
-        if target > source.width
+        if target > source_width
           Utils.warning "#{source.shortname} is smaller than the " \
-            "requested fallback width of #{target}px. Using #{source.width}" \
+            "requested fallback width of #{target}px. Using #{source_width}" \
             ' px instead.'
-          source.width
+          source_width
         else
           target
         end

data/lib/jekyll_picture_tag/router.rb

@@ -47,6 +47,14 @@ module PictureTag
       @instructions.source_images
     end
 
+    def crop(media = nil)
+      @instructions.crop(media)
+    end
+
+    def gravity(media = nil)
+      @instructions.gravity(media)
+    end
+
     # Config Forwarding
 
     def source_dir

data/lib/jekyll_picture_tag/srcsets/basic.rb

@@ -65,26 +65,37 @@ module PictureTag
       end
 
       def checked_targets
-        if target_files.any? { |f| f.width > @source_image.width }
+        if target_files.any? { |f| f.width > source_width }
 
           small_source_warn
 
-          files = target_files.reject { |f| f.width >= @source_image.width }
-          files.push(generate_file(@source_image.width))
+          files = target_files.reject { |f| f.width >= source_width }
+          files.push(generate_file(source_width))
         end
 
         files || target_files
       end
 
+      def source_width
+        @source_width ||= if PictureTag.crop(@media)
+                            target_files.first.cropped_source_width
+                          else
+                            @source_image.width
+                          end
+      end
+
       def target_files
         @target_files ||= widths.collect { |w| generate_file(w) }
       end
 
       def small_source_warn
         Utils.warning(
-          " #{@source_image.shortname} is #{@source_image.width}px wide,"\
-          " smaller than at least one size in the set #{widths}. Will not"\
-          ' enlarge.'
+          <<~HEREDOC
+            #{@source_image.shortname}
+            is #{source_width}px wide (after cropping, if applicable),
+            smaller than at least one size in the set #{widths}.
+            Will not enlarge.
+          HEREDOC
         )
       end
 
@@ -92,7 +103,9 @@ module PictureTag
         GeneratedImage.new(
           source_file: @source_image,
           width: width,
-          format: @input_format
+          format: @input_format,
+          crop: PictureTag.crop(@media),
+          gravity: PictureTag.gravity(@media)
         )
       end
     end

data/lib/jekyll_picture_tag/utils.rb

@@ -2,6 +2,24 @@ module PictureTag
   # This is a little module to hold logic that doesn't fit other places. If it
   # starts getting big, refactor.
   module Utils
+    # These are valid ImageMagick gravity arguments (relevant to our use
+    # case):
+    GRAVITIES =
+      %w[center
+         north
+         northeast
+         east
+         southeast
+         south
+         southwest
+         west
+         northwest].freeze
+
+    # This is an attempt to recognize valid imagemagick geometry arguments
+    # with regex. It only tries to match values which don't preserve aspect
+    # ratio, as they're the ones people might actually need here.
+    GEOMETRY_REGEX = /\A\d*%?[x:]?\d*[%!]?([+-]\d+){,2}\Z/i.freeze
+
     class << self
       # Configure Jekyll to keep our generated files
       def keep_files

data/lib/jekyll_picture_tag/version.rb

@@ -1,3 +1,3 @@
 module PictureTag
-  VERSION = '1.9.0'.freeze
+  VERSION = '1.10.0'.freeze
 end

data/readme.md

@@ -1,21 +1,20 @@
 # Jekyll Picture Tag
 
-**Easy responsive images for Jekyll.**
+**Responsive Images done correctly.**
 
-It's easy to throw an image on a webpage and call it a day. Doing justice to your users by serving
-it efficiently on all browsers and screen sizes is tedious and tricky. Tedious, tricky things should be
-automated.
+It's simple to throw a photo on a page and call it a day, but doing justice to users on all
+different browsers and devices is tedious and tricky. Tedious, tricky things should be automated.
 
-Jekyll Picture Tag adds responsive images to your [Jekyll](http://jekyllrb.com) static site. It
-automatically creates resized, reformatted source images, is fully configurable, implements sensible
-defaults, and solves both the art direction and resolution switching problems with a little YAML
-configuration and a simple template tag.
+Jekyll Picture Tag automatically builds cropped, resized, and reformatted images, builds several
+kinds of markup, offers extensive configuration while requiring none, and solves both the art
+direction and resolution switching problems with a little YAML configuration and a simple template
+tag.
 
 ## Why use Responsive Images?
 
-**Performance:** The fastest sites are static sites, but when you plonk a 2mb picture of your dog at
-the top of a blog post you're throwing it all away.  Responsive images allow you to keep your site
-fast, without compromising image quality.
+**Performance:** The fastest sites are static sites, but if you plonk a 2mb picture of your dog at
+the top of a blog post you throw it all away. Responsive images allow you to keep your site fast,
+without compromising image quality.
 
 **Design:** Your desktop image may not work well on mobile, regardless of its resolution. We often
 want to do more than just resize images for different screen sizes, we want to crop them or use a
@@ -24,15 +23,35 @@ different image entirely.
 ## Why use Jekyll Picture Tag?
 
 **Developer Sanity:** If you want to serve multiple images in multiple formats and resolutions, you
-have a litany of markup to write and a big pile of images to generate. Jekyll Picture Tag is your
-responsive images minion - give it simple instructions and it'll handle the rest. 
+have a litany of markup to write and a big pile of images to generate and organize. Jekyll Picture
+Tag is your responsive images minion - give it simple instructions and it'll handle the rest. 
 
 ## Features
 
-* Automatic generation and organization of resized image files in basically any format(s).
-* Automatic generation of complex markup in several different formats.
-* No configuration required, extensive configuration available.
+* Generate piles of cropped, resized, and converted image files.
+* Generate corresponding markup in several different formats.
+* Configure it easily, or not at all.
+* Make Lighthouse happy.
 
 ## Documentation:
 
 https://rbuchberger.github.io/jekyll_picture_tag/
+
+## Changelog:
+
+https://rbuchberger.github.io/jekyll_picture_tag/releases
+
+Latest version: 
+
+* 1.10.0 May 11, 2020
+  * **Image Cropping support!** access the power of ImageMagick's `crop` function.
+  * Don't issue a warning when `default` preset is not found.
+  * Documentation improvements
+
+## Help Wanted
+
+Writing code is only part of the job; often the harder part is knowing what needs to be changed. Any
+and all feedback is greatly appreciated, especially in regards to documentation. What are your pain
+points? See the [contributing
+guidelines](https://rbuchberger.github.io/jekyll_picture_tag/contributing), or the
+[issues](https://github.com/rbuchberger/jekyll_picture_tag/issues) page for more.

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: jekyll_picture_tag
 version: !ruby/object:Gem::Version
-  version: 1.9.0
+  version: 1.10.0
 platform: ruby
 authors:
 - Robert Wierzbowski
@@ -10,7 +10,7 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2020-02-04 00:00:00.000000000 Z
+date: 2020-05-11 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: bundler
@@ -152,6 +152,20 @@ dependencies:
     - - "~>"
       - !ruby/object:Gem::Version
         version: '2.6'
+- !ruby/object:Gem::Dependency
+  name: base32
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '0.3'
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '0.3'
 - !ruby/object:Gem::Dependency
   name: mime-types
   requirement: !ruby/object:Gem::Requirement
@@ -186,14 +200,14 @@ dependencies:
     requirements:
     - - "~>"
       - !ruby/object:Gem::Version
-        version: 1.1.1
+        version: 1.1.2
   type: :runtime
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
     - - "~>"
       - !ruby/object:Gem::Version
-        version: 1.1.1
+        version: 1.1.2
 - !ruby/object:Gem::Dependency
   name: jekyll
   requirement: !ruby/object:Gem::Requirement
@@ -225,6 +239,7 @@ files:
 - ".ruby-version"
 - ".solargraph.yml"
 - ".travis.yml"
+- Dockerfile
 - Gemfile
 - LICENSE.txt
 - Rakefile
@@ -253,6 +268,7 @@ files:
 - lib/jekyll_picture_tag/generated_image.rb
 - lib/jekyll_picture_tag/img_uri.rb
 - lib/jekyll_picture_tag/instructions.rb
+- lib/jekyll_picture_tag/instructions/arg_splitter.rb
 - lib/jekyll_picture_tag/instructions/configuration.rb
 - lib/jekyll_picture_tag/instructions/html_attributes.rb
 - lib/jekyll_picture_tag/instructions/preset.rb
@@ -301,7 +317,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubygems_version: 3.0.4
+rubygems_version: 3.1.3
 signing_key: 
 specification_version: 4
 summary: Easy responsive images for Jekyll.