jekyll-og-image 1.0.4 → 1.1.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: eeccdc0ae99d37ef260733506fbad4ebf5c60f925cdb2514acb91dcb346d1673
-  data.tar.gz: b8b291f97eddc6a0be9dc080d2f999be0bb027224bf5bf2953f941a89491b63a
+  metadata.gz: b61ed8f290ff7d539d5797f7e176821c7467cf1e5c2405e54960909663271ef5
+  data.tar.gz: 300123301cf7fc2dc403cc8254181772983f036cb8a06e7e23374fda7861d62c
 SHA512:
-  metadata.gz: b15a8205247be628cf982c6efb8f9127cd0ba2eb1d2421e7f7f702802e4960a14317612cfffa010d41972e1b2ba2671eae82f19092552f93b71003995096a21a
-  data.tar.gz: 47b2a2845a7e6bd2a25ef2f249af3fcd1e78adf9179366680e173fc0228aaa5e564be2f5935a0752b3c2c5dd8061b6b17959d7f592fa50ca08d54006baca272c
+  metadata.gz: 6a29185631359c3b89faddc2b54187bbfd663b762c6533eb5909270e78320c04f313193ddd4c3e33652946865ef486b7bfaefbb941637a965d8fc02f8f6560b4
+  data.tar.gz: 83fa74112ac6747aa11a402913b6cd736c828f318b8a08ddf342d7aac8212a367b9c7028378fe681dbb8725dd44a6fcfe3ec379beb9e999e9e105cc6d52adb61

data/.rspec_status

@@ -1,5 +1,5 @@
 example_id                          | status | run_time        |
 ----------------------------------- | ------ | --------------- |
-./spec/jekyll_og_image_spec.rb[1:1] | passed | 0.01883 seconds |
-./spec/jekyll_og_image_spec.rb[1:2] | passed | 0.31382 seconds |
-./spec/jekyll_og_image_spec.rb[1:3] | passed | 0.07861 seconds |
+./spec/jekyll_og_image_spec.rb[1:1] | passed | 0.01708 seconds |
+./spec/jekyll_og_image_spec.rb[1:2] | passed | 0.27293 seconds |
+./spec/jekyll_og_image_spec.rb[1:3] | passed | 0.06846 seconds |

data/README.md

@@ -61,6 +61,31 @@ og_image:
 
 ![Example 1](examples/1.png)
 
+### Background Color and Text Colors
+
+```yaml
+og_image:
+  output_dir: "/assets/og"
+  image: "/assets/images/igor.jpeg"
+  canvas:
+    background_color: "#F9E065"
+  header:
+    font_family: "Roboto, Bold"
+    color: "#333333"
+  content:
+    font_family: "Roboto, Regular"
+    color: "#333333"
+  force: false
+  domain: "igor.works"
+  border_bottom:
+    width: 20
+    fill:
+      - "#002B7F"
+      - "#FCD116"
+      - "#CE1126"
+```
+
+![Example 3](examples/3.png)
 
 
 ## Contributing

data/lib/jekyll_og_image/config.rb

@@ -5,6 +5,18 @@ require "anyway_config"
 class JekyllOgImage::Config < Anyway::Config
   attr_config output_dir: "assets/images/og"
   attr_config force: false
+  attr_config verbose: false
+  attr_config canvas: {
+    background_color: "#FFFFFF"
+  }
+  attr_config header: {
+    font_family: "Helvetica, Bold",
+    color: "#2f313d"
+  }
+  attr_config content: {
+    font_family: "Helvetica, Regular",
+    color: "#535358"
+  }
   attr_config :image
   attr_config :domain
   attr_config border_bottom: {
@@ -12,6 +24,20 @@ class JekyllOgImage::Config < Anyway::Config
     fill: [ "#211F1F", "#F4CBB2", "#AD5C51", "#9CDAF1", "#7DBBE6" ]
   }
 
+  coerce_types canvas: {
+    background_color: { type: :string }
+  }
+
+  coerce_types header: {
+    font_family: { type: :string },
+    color: { type: :string }
+  }
+
+  coerce_types content: {
+    font_family: { type: :string },
+    color: { type: :string }
+  }
+
   coerce_types image: { type: :string }
 
   coerce_types border_bottom: {

data/lib/jekyll_og_image/element/base.rb

@@ -21,4 +21,20 @@ class JekyllOgImage::Element::Base
       raise ArgumentError, "Invalid gravity: #{@gravity.inspect}"
     end
   end
+
+  def composite_with_gravity(canvas, overlay, x, y)
+    if gravity_nw?
+      canvas.composite(overlay, :over, x: [ x ], y: [ y ]).flatten
+    elsif gravity_ne?
+      x = canvas.width - overlay.width - x
+      canvas.composite(overlay, :over, x: [ x ], y: [ y ]).flatten
+    elsif gravity_sw?
+      y = canvas.height - overlay.height - y
+      canvas.composite(overlay, :over, x: [ x ], y: [ y ]).flatten
+    elsif gravity_se?
+      x = canvas.width - overlay.width - x
+      y = canvas.height - overlay.height - y
+      canvas.composite(overlay, :over, x: [ x ], y: [ y ]).flatten
+    end
+  end
 end

data/lib/jekyll_og_image/element/border.rb

@@ -4,43 +4,57 @@ class JekyllOgImage::Element::Border < JekyllOgImage::Element::Base
   class Part < Data.define(:rgb, :width, :height, :offset)
   end
 
-  def initialize(canvas, size, position: :bottom, fill: "#000000")
-    @canvas = canvas
+  def initialize(size, position: :bottom, fill: "#000000")
     @size = size
     @position = position
     @fill = fill
 
     validate_position!
+  end
 
-    @border = Vips::Image.black(*dimensions)
+  def apply_to(canvas, &block)
+    border = Vips::Image.black(*dimensions(canvas))
 
-    parts.each.with_index do |part, index|
-      border = Vips::Image.black(part.width, part.height).ifthenelse([ 0, 0, 0 ], part.rgb)
+    parts(canvas).each.with_index do |part, index|
+      image = Vips::Image.black(part.width, part.height).ifthenelse([ 0, 0, 0 ], part.rgb)
 
       if vertical?
-        @border = @border.composite(border, :over, x: [ 0 ], y: [ part.offset ]).flatten
+        border = border.composite(image, :over, x: [ 0 ], y: [ part.offset ]).flatten
       else
-        @border = @border.composite(border, :over, x: [ part.offset ], y: [ 0 ]).flatten
+        border = border.composite(image, :over, x: [ part.offset ], y: [ 0 ]).flatten
       end
     end
-  end
 
-  def apply(&block)
-    result = block.call(@canvas, @border) if block_given?
+    result = block.call(canvas, border) if block_given?
+
     x, y = result ? [ result.fetch(:x, 0), result.fetch(:y, 0) ] : [ 0, 0 ]
 
     if vertical?
-      x = @position == :left ? x : @canvas.width - @size - x
-      @canvas.composite(@border, :over, x: [ x ], y: [ 0 ]).flatten
+      x = @position == :left ? x : canvas.width - @size - x
+      canvas.composite(border, :over, x: [ x ], y: [ 0 ]).flatten
     else
-      y = @position == :top ? y : @canvas.height - @size - y
-      @canvas.composite(@border, :over, x: [ 0 ], y: [ y ]).flatten
+      y = @position == :top ? y : canvas.height - @size - y
+      canvas.composite(border, :over, x: [ 0 ], y: [ y ]).flatten
     end
   end
 
-  def parts
+  private
+
+  def hex_to_rgb(hex)
+    hex.match(/#(..)(..)(..)/)[1..3].map { |x| x.hex }
+  end
+
+  def dimensions(canvas)
+    if vertical?
+      [ @size, canvas.height ]
+    else
+      [ canvas.width, @size ]
+    end
+  end
+
+  def parts(canvas)
     if @fill.is_a?(Array)
-      width, height = vertical? ? [ @size, (@canvas.height / @fill.size) ] : [ (@canvas.width / @fill.size), @size ]
+      width, height = vertical? ? [ @size, (canvas.height / @fill.size) ] : [ (canvas.width / @fill.size), @size ]
 
       @fill.map.with_index do |item, index|
         Part.new(
@@ -51,26 +65,12 @@ class JekyllOgImage::Element::Border < JekyllOgImage::Element::Base
         )
       end
     else
-      length = vertical? ? @canvas.height : @canvas.width
+      length = vertical? ? canvas.height : canvas.width
 
       [ Part.new(rgb: hex_to_rgb(@fill), length: length, offset: 0) ]
     end
   end
 
-  private
-
-  def hex_to_rgb(hex)
-    hex.match(/#(..)(..)(..)/)[1..3].map { |x| x.hex }
-  end
-
-  def dimensions
-    if vertical?
-      [ @size, @canvas.height ]
-    else
-      [ @canvas.width, @size ]
-    end
-  end
-
   def vertical?
     @position == :left || @position == :right
   end

data/lib/jekyll_og_image/element/canvas.rb

@@ -8,31 +8,22 @@ class JekyllOgImage::Element::Canvas < JekyllOgImage::Element::Base
   end
 
   def image(source, **opts, &block)
-    image = JekyllOgImage::Element::Image.new(
-      @canvas, source, **opts
-    )
-
-    @canvas = image.apply(&block)
+    image = JekyllOgImage::Element::Image.new(source, **opts)
+    @canvas = image.apply_to(@canvas, &block)
 
     self
   end
 
   def text(message, **opts, &block)
-    text = JekyllOgImage::Element::Text.new(
-      @canvas, message, **opts
-    )
-
-    @canvas = text.apply(&block)
+    text = JekyllOgImage::Element::Text.new(message, **opts)
+    @canvas = text.apply_to(@canvas, &block)
 
     self
   end
 
-  def border(width, position: :bottom, fill: "#000000")
-    @canvas = JekyllOgImage::Element::Border.new(
-      @canvas, width,
-      position: position,
-      fill: fill
-    ).apply
+  def border(width, **opts, &block)
+    border = JekyllOgImage::Element::Border.new(width, **opts)
+    @canvas = border.apply_to(@canvas, &block)
 
     self
   end

data/lib/jekyll_og_image/element/image.rb

@@ -1,19 +1,21 @@
 # frozen_string_literal: true
 
 class JekyllOgImage::Element::Image < JekyllOgImage::Element::Base
-  def initialize(canvas, source, gravity: :nw, width:, height:)
-    @canvas = canvas
+  def initialize(source, gravity: :nw, width:, height:, radius:)
     @gravity = gravity
     @source = source
     @width = width
     @height = height
+    @radius = radius
 
     validate_gravity!
   end
 
-  def apply(&block)
+  def apply_to(canvas, &block)
     image = Vips::Image.new_from_buffer(@source, "")
-    result = block.call(@canvas, image) if block_given?
+    image = round_corners(image) if @radius
+
+    result = block.call(canvas, image) if block_given?
 
     if @width && @height
       ratio = calculate_ratio(image, @width, @height, :min)
@@ -22,19 +24,7 @@ class JekyllOgImage::Element::Image < JekyllOgImage::Element::Base
 
     x, y = result ? [ result.fetch(:x, 0), result.fetch(:y, 0) ] : [ 0, 0 ]
 
-    if gravity_nw?
-      @canvas.composite(image, :over, x: [ x ], y: [ y ]).flatten
-    elsif gravity_ne?
-      x = @canvas.width - image.width - x
-      @canvas.composite(image, :over, x: [ x ], y: [ y ]).flatten
-    elsif gravity_sw?
-      y = @canvas.height - image.height - y
-      @canvas.composite(image, :over, x: [ x ], y: [ y ]).flatten
-    elsif gravity_se?
-      x = @canvas.width - image.width - x
-      y = @canvas.height - image.height - y
-      @canvas.composite(image, :over, x: [ x ], y: [ y ]).flatten
-    end
+    composite_with_gravity(canvas, image, x, y)
   end
 
   private
@@ -45,6 +35,25 @@ class JekyllOgImage::Element::Image < JekyllOgImage::Element::Base
     end
   end
 
+  def round_corners(image)
+    mask = %(
+      <svg viewBox="0 0 #{image.width} #{image.height}">
+        <rect
+          rx="#{@radius}"
+          ry="#{@radius}"
+          x="0"
+          y="0"
+          width="#{image.width}"
+          height="#{image.height}"
+          fill="#fff"
+        />
+      </svg>
+    )
+
+    mask = Vips::Image.new_from_buffer(mask, "")
+    image.bandjoin mask[3]
+  end
+
   def calculate_ratio(image, width, height, mode)
     if mode == :min
       [ width.to_f / image.width, height.to_f / image.height ].min

data/lib/jekyll_og_image/element/text.rb

@@ -1,43 +1,36 @@
 # frozen_string_literal: true
 
 class JekyllOgImage::Element::Text < JekyllOgImage::Element::Base
-  def initialize(canvas, message, gravity: :nw, width: nil, dpi: nil, color: "#000000", font: nil)
-    @canvas = canvas
+  def initialize(message, gravity: :nw, width: nil, dpi: nil, color: "#000000", font: nil)
+    @message = message
     @gravity = gravity
+    @width = width
+    @dpi = dpi
+    @color = color
+    @font = font
 
     validate_gravity!
+  end
 
-    text = Vips::Image.text(message,
-      font: font,
-      width: width,
-      dpi: dpi,
+  def apply_to(canvas, &block)
+    text = Vips::Image.text(@message,
+      font: @font,
+      width: @width,
+      dpi: @dpi,
       wrap: :word,
       align: :low
     )
 
-    @text = text
-      .new_from_image(hex_to_rgb(color))
+    text = text
+      .new_from_image(hex_to_rgb(@color))
       .copy(interpretation: :srgb)
       .bandjoin(text)
-  end
 
-  def apply(&block)
-    result = block.call(@canvas, @text) if block_given?
+    result = block.call(canvas, text) if block_given?
+
     x, y = result ? [ result.fetch(:x, 0), result.fetch(:y, 0) ] : [ 0, 0 ]
 
-    if gravity_nw?
-      @canvas.composite(@text, :over, x: [ x ], y: [ y ]).flatten
-    elsif gravity_ne?
-      x = @canvas.width - @text.width - x
-      @canvas.composite(@text, :over, x: [ x ], y: [ y ]).flatten
-    elsif gravity_sw?
-      y = @canvas.height - @text.height - y
-      @canvas.composite(@text, :over, x: [ x ], y: [ y ]).flatten
-    elsif gravity_se?
-      x = @canvas.width - @text.width - x
-      y = @canvas.height - @text.height - y
-      @canvas.composite(@text, :over, x: [ x ], y: [ y ]).flatten
-    end
+    composite_with_gravity(canvas, text, x, y)
   end
 
   private

data/lib/jekyll_og_image/generator.rb

@@ -15,10 +15,10 @@ class JekyllOgImage::Generator < Jekyll::Generator
       path = File.join(site.config["source"], base_path, "#{post.data['slug']}.png")
 
       if !File.exist?(path) || JekyllOgImage.config.force?
-        Jekyll.logger.info "Jekyll Og Image:", "Generating image #{path}"
+        Jekyll.logger.info "Jekyll Og Image:", "Generating image #{path}" if JekyllOgImage.config.verbose?
         generate_image_for_post(site, post, path)
       else
-        Jekyll.logger.info "Jekyll Og Image:", "Skipping image generation #{path} as it already exists."
+        Jekyll.logger.info "Jekyll Og Image:", "Skipping image generation #{path} as it already exists." if JekyllOgImage.config.verbose?
       end
 
       post.data["image"] ||= {
@@ -35,7 +35,9 @@ class JekyllOgImage::Generator < Jekyll::Generator
   def generate_image_for_post(site, post, path)
     date = post.date.strftime("%B %d, %Y")
 
-    canvas = JekyllOgImage::Element::Canvas.new(1200, 600)
+    canvas = JekyllOgImage::Element::Canvas.new(1200, 600,
+        color: JekyllOgImage.config.canvas["background_color"]
+      )
       .border(JekyllOgImage.config.border_bottom["width"],
         position: :bottom,
         fill: JekyllOgImage.config.border_bottom["fill"]
@@ -46,22 +48,23 @@ class JekyllOgImage::Generator < Jekyll::Generator
         File.read(File.join(site.config["source"], JekyllOgImage.config.image)),
         gravity: :ne,
         width: 150,
-        height: 150
+        height: 150,
+        radius: 50
       ) { |_canvas, _text| { x: 80, y: 100 } }
     end
 
     canvas = canvas.text(post.data["title"],
       width: JekyllOgImage.config.image ? 870 : 1040,
-      color: "#2f313d",
+      color: JekyllOgImage.config.header["color"],
       dpi: 400,
-      font: "Helvetica, Bold"
+      font: JekyllOgImage.config.header["font_family"]
     ) { |_canvas, _text| { x: 80, y: 100 } }
 
     canvas = canvas.text(date,
       gravity: :sw,
-      color: "#535358",
+      color: JekyllOgImage.config.content["color"],
       dpi: 150,
-      font: "Helvetica, Regular"
+      font: JekyllOgImage.config.content["font_family"]
     ) { |_canvas, _text| { x: 80, y: post.data["tags"].any? ? 150 : 100 } }
 
     if post.data["tags"].any?
@@ -69,14 +72,19 @@ class JekyllOgImage::Generator < Jekyll::Generator
 
       canvas = canvas.text(tags,
         gravity: :sw,
-        color: "#535358",
+        color: JekyllOgImage.config.content["color"],
         dpi: 150,
-        font: "Helvetica, Regular"
+        font: JekyllOgImage.config.content["font_family"]
       ) { |_canvas, _text| { x: 80, y: 100 } }
     end
 
     if JekyllOgImage.config.domain
-      canvas = canvas.text(JekyllOgImage.config.domain, gravity: :se, color: "#535358", dpi: 150, font: "Helvetica, Regular") do |_canvas, _text|
+      canvas = canvas.text(JekyllOgImage.config.domain,
+        gravity: :se,
+        color: JekyllOgImage.config.content["color"],
+        dpi: 150,
+        font: JekyllOgImage.config.content["font_family"]
+      ) do |_canvas, _text|
         {
           x: 80,
           y: post.data["tags"].any? ? 150 : 100

data/lib/jekyll_og_image/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module JekyllOgImage
-  VERSION = "1.0.4"
+  VERSION = "1.1.0"
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: jekyll-og-image
 version: !ruby/object:Gem::Version
-  version: 1.0.4
+  version: 1.1.0
 platform: ruby
 authors:
 - Igor Alexandrov
-autorequire:
+autorequire: 
 bindir: bin
 cert_chain: []
-date: 2024-02-05 00:00:00.000000000 Z
+date: 2024-02-13 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: jekyll-seo-tag
@@ -86,7 +86,7 @@ dependencies:
     - - "<"
       - !ruby/object:Gem::Version
         version: '5.0'
-description:
+description: 
 email:
 - igor.alexandrov@gmail.com
 executables: []
@@ -102,7 +102,7 @@ files:
 - Rakefile
 - examples/1.png
 - examples/2.png
-- jekyll-og-image.gemspec
+- examples/3.png
 - lib/jekyll-og-image.rb
 - lib/jekyll_og_image.rb
 - lib/jekyll_og_image/config.rb
@@ -118,7 +118,7 @@ licenses:
 - MIT
 metadata:
   homepage_uri: https://github.com/igor-alexandrov/jekyll-og-image
-post_install_message:
+post_install_message: 
 rdoc_options: []
 require_paths:
 - lib
@@ -133,8 +133,8 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubygems_version: 3.5.4
-signing_key:
+rubygems_version: 3.5.3
+signing_key: 
 specification_version: 4
 summary: Jekyll plugin to generate GitHub-style open graph images
 test_files: []

data/jekyll-og-image.gemspec

@@ -1,34 +0,0 @@
-# frozen_string_literal: true
-
-require_relative "lib/jekyll_og_image/version"
-
-Gem::Specification.new do |spec|
-  spec.name = "jekyll-og-image"
-  spec.version = JekyllOgImage::VERSION
-  spec.authors = [ "Igor Alexandrov" ]
-  spec.email = [ "igor.alexandrov@gmail.com" ]
-
-  spec.summary = "Jekyll plugin to generate GitHub-style open graph images"
-  spec.homepage = "https://github.com/igor-alexandrov/jekyll-og-image"
-  spec.license = "MIT"
-  spec.required_ruby_version = ">= 3.2.0"
-
-  spec.metadata["homepage_uri"] = spec.homepage
-
-  # Specify which files should be added to the gem when it is released.
-  # The `git ls-files -z` loads the files in the RubyGem that have been added into git.
-  spec.files = Dir.chdir(__dir__) do
-    `git ls-files -z`.split("\x0").reject do |f|
-      (File.expand_path(f) == __FILE__) ||
-        f.start_with?(*%w[bin/ test/ spec/ features/ .git .github appveyor Gemfile])
-    end
-  end
-
-  spec.require_paths = [ "lib" ]
-
-  spec.add_dependency "jekyll-seo-tag", "~> 2.8"
-  spec.add_dependency "zeitwerk", "~> 2.6"
-  spec.add_dependency "anyway_config", "~> 2.6"
-  spec.add_dependency "ruby-vips", "~> 2.2.0"
-  spec.add_runtime_dependency "jekyll", ">= 3.4", "< 5.0"
-end