mirror of
https://github.com/wildlyinaccurate/jekyll-responsive-image.git
synced 2025-07-04 00:00:41 -04:00
Compare commits
1 Commits
Author | SHA1 | Date | |
---|---|---|---|
|
682beff7b5 |
@ -35,15 +35,11 @@ For more advanced templates, see the [**Templates**](#templates) section below.
|
||||
|
||||
### 3. Configure the plugin
|
||||
|
||||
You **must** have a `responsive_image` block in your `_config.yml` for this plugin to work. At a minimum, your `responsive_image` configuration should have a template path and a list of sizes.
|
||||
You **must** have a `responsive_image` block in your `_config.yml` for this plugin to work. The minimum required configuration is a `template` path:
|
||||
|
||||
```yaml
|
||||
responsive_image:
|
||||
template: _includes/responsive-image.html
|
||||
sizes:
|
||||
- width: 320
|
||||
- width: 480
|
||||
- width: 800
|
||||
```
|
||||
|
||||
For a list of all the available configuration options, see the [**All configuration options**](#all-configuration-options) section below.
|
||||
|
@ -13,20 +13,6 @@ Feature: Jekyll responsive_image_block tag
|
||||
When I run Jekyll
|
||||
Then I should see "<img alt=\"Lorem ipsum\" src=\"/assets/everybody-loves-jalapeño-pineapple-cornbread.png\" title=\"Magic rainbow adventure!\"" in "_site/index.html"
|
||||
|
||||
Scenario: Tabs for indentation
|
||||
Given I have a responsive_image configuration with "template" set to "_includes/responsive-image.html"
|
||||
And I have a file "index.html" with:
|
||||
"""
|
||||
{% assign path = 'assets/everybody-loves-jalapeño-pineapple-cornbread.png' %}
|
||||
{% responsive_image_block %}
|
||||
path: {{ path }}
|
||||
title: Magic rainbow adventure!
|
||||
alt: Lorem ipsum
|
||||
{% endresponsive_image_block %}
|
||||
"""
|
||||
When I run Jekyll
|
||||
Then I should see "<img alt=\"Lorem ipsum\" src=\"/assets/everybody-loves-jalapeño-pineapple-cornbread.png\" title=\"Magic rainbow adventure!\"" in "_site/index.html"
|
||||
|
||||
Scenario: Global variables available in templates
|
||||
Given I have a file "index.html" with:
|
||||
"""
|
||||
|
@ -1,3 +1 @@
|
||||
{% assign largest = resized | sort: 'width' | last %}
|
||||
|
||||
<img alt="{{ alt }}" src="/{{ original.path }}" title="{{ title }}" srcset="{% for i in resized %}/{{ i.path }} {{ i.width }}w,{% endfor %}/{{ original.path }} {{ original.width }}w">
|
||||
|
@ -4,13 +4,7 @@ module Jekyll
|
||||
include Jekyll::ResponsiveImage::Utils
|
||||
|
||||
def render(context)
|
||||
content = super
|
||||
|
||||
if content.include?("\t")
|
||||
content = content.lines.map {|line| line.gsub(/\G[\t ]/, " ")}.join("\n")
|
||||
end
|
||||
|
||||
attributes = YAML.load(content)
|
||||
attributes = YAML.load(super)
|
||||
Renderer.new(context.registers[:site], attributes).render_responsive_image
|
||||
end
|
||||
end
|
||||
|
@ -8,11 +8,12 @@ module Jekyll
|
||||
|
||||
Jekyll.logger.warn "Invalid image path specified: #{image_path.inspect}" unless File.file?(absolute_image_path)
|
||||
|
||||
resize_handler = ResizeHandler.new(absolute_image_path, config)
|
||||
resize_handler = ResizeHandler.new
|
||||
img = Magick::Image::read(absolute_image_path).first
|
||||
|
||||
{
|
||||
original: image_hash(config, image_path, resize_handler.original_image.columns, resize_handler.original_image.rows),
|
||||
resized: resize_handler.resize_image,
|
||||
original: image_hash(config, image_path, img.columns, img.rows),
|
||||
resized: resize_handler.resize_image(img, config),
|
||||
}
|
||||
end
|
||||
|
||||
|
@ -25,11 +25,7 @@ module Jekyll
|
||||
partial = File.read(image_template)
|
||||
template = Liquid::Template.parse(partial)
|
||||
|
||||
info = {
|
||||
registers: { site: @site }
|
||||
}
|
||||
|
||||
result = template.render!(@attributes.merge(@site.site_payload), info)
|
||||
result = template.render!(@attributes.merge(@site.site_payload))
|
||||
|
||||
RenderCache.set(cache_key, result)
|
||||
end
|
||||
|
@ -3,39 +3,26 @@ module Jekyll
|
||||
class ResizeHandler
|
||||
include ResponsiveImage::Utils
|
||||
|
||||
attr_reader :original_image
|
||||
def resize_image(img, config)
|
||||
img.auto_orient! if config['auto_rotate']
|
||||
|
||||
def initialize(original_image_absolute_path, config)
|
||||
@config = config
|
||||
|
||||
@original_image_absolute_path = original_image_absolute_path
|
||||
|
||||
if @config['auto_rotate']
|
||||
load_full_image
|
||||
@original_image.auto_orient!
|
||||
else
|
||||
load_image_properties_only
|
||||
end
|
||||
end
|
||||
|
||||
def resize_image
|
||||
resized = []
|
||||
|
||||
@config['sizes'].each do |size|
|
||||
config['sizes'].each do |size|
|
||||
width = size['width']
|
||||
ratio = width.to_f / @original_image.columns.to_f
|
||||
height = (@original_image.rows.to_f * ratio).round
|
||||
ratio = width.to_f / img.columns.to_f
|
||||
height = (img.rows.to_f * ratio).round
|
||||
|
||||
next unless needs_resizing?(width)
|
||||
next unless needs_resizing?(img, width)
|
||||
|
||||
image_path = @original_image.filename.force_encoding(Encoding::UTF_8)
|
||||
filepath = format_output_path(@config['output_path_format'], @config, image_path, width, height)
|
||||
resized.push(image_hash(@config, filepath, width, height))
|
||||
image_path = img.filename.force_encoding(Encoding::UTF_8)
|
||||
filepath = format_output_path(config['output_path_format'], config, image_path, width, height)
|
||||
resized.push(image_hash(config, filepath, width, height))
|
||||
|
||||
site_source_filepath = File.expand_path(filepath, @config[:site_source])
|
||||
site_dest_filepath = File.expand_path(filepath, @config[:site_dest])
|
||||
site_source_filepath = File.expand_path(filepath, config[:site_source])
|
||||
site_dest_filepath = File.expand_path(filepath, config[:site_dest])
|
||||
|
||||
if @config['save_to_source']
|
||||
if config['save_to_source']
|
||||
target_filepath = site_source_filepath
|
||||
else
|
||||
target_filepath = site_dest_filepath
|
||||
@ -49,22 +36,16 @@ module Jekyll
|
||||
|
||||
Jekyll.logger.info "Generating #{target_filepath}"
|
||||
|
||||
load_full_image unless @original_image_pixels_loaded
|
||||
|
||||
if @config['strip']
|
||||
@original_image.strip!
|
||||
if config['strip']
|
||||
img.strip!
|
||||
end
|
||||
|
||||
i = @original_image.scale(ratio)
|
||||
|
||||
quality = size['quality'] || @config['default_quality']
|
||||
|
||||
i = img.scale(ratio)
|
||||
i.write(target_filepath) do |f|
|
||||
f.interlace = i.interlace
|
||||
f.quality = quality
|
||||
f.quality = size['quality'] || config['default_quality']
|
||||
end
|
||||
|
||||
if @config['save_to_source']
|
||||
if config['save_to_source']
|
||||
# Ensure the generated file is copied to the _site directory
|
||||
Jekyll.logger.info "Copying resized image to #{site_dest_filepath}"
|
||||
FileUtils.copy_file(site_source_filepath, site_dest_filepath)
|
||||
@ -73,7 +54,7 @@ module Jekyll
|
||||
i.destroy!
|
||||
end
|
||||
|
||||
@original_image.destroy!
|
||||
img.destroy!
|
||||
|
||||
resized
|
||||
end
|
||||
@ -84,18 +65,8 @@ module Jekyll
|
||||
Pathname.new(format % params).cleanpath.to_s
|
||||
end
|
||||
|
||||
def needs_resizing?(width)
|
||||
@original_image.columns > width
|
||||
end
|
||||
|
||||
def load_full_image
|
||||
@original_image = Magick::Image::read(@original_image_absolute_path).first
|
||||
@original_image_pixels_loaded = true
|
||||
end
|
||||
|
||||
def load_image_properties_only
|
||||
@original_image = Magick::Image::ping(@original_image_absolute_path).first
|
||||
@original_image_pixels_loaded = false
|
||||
def needs_resizing?(img, width)
|
||||
img.columns > width
|
||||
end
|
||||
|
||||
def ensure_output_dir_exists!(path)
|
||||
|
@ -1,5 +1,5 @@
|
||||
module Jekyll
|
||||
module ResponsiveImage
|
||||
VERSION = '1.6.0'.freeze
|
||||
VERSION = '1.5.4'.freeze
|
||||
end
|
||||
end
|
||||
|
Loading…
x
Reference in New Issue
Block a user