mirror of
https://github.com/danbee/danbarber.me
synced 2025-03-04 08:59:10 +00:00
Update picture tag
This commit is contained in:
parent
9925ba1df5
commit
ba8d038d91
1
Gemfile
1
Gemfile
@ -2,6 +2,7 @@ source 'https://rubygems.org'
|
|||||||
|
|
||||||
gem 'rake'
|
gem 'rake'
|
||||||
|
|
||||||
|
gem 'fastimage'
|
||||||
gem 'mini_magick'
|
gem 'mini_magick'
|
||||||
|
|
||||||
gem 'jekyll'
|
gem 'jekyll'
|
||||||
|
|||||||
@ -85,6 +85,7 @@ PLATFORMS
|
|||||||
DEPENDENCIES
|
DEPENDENCIES
|
||||||
bourbon
|
bourbon
|
||||||
facets
|
facets
|
||||||
|
fastimage
|
||||||
jekyll
|
jekyll
|
||||||
jekyll-archives
|
jekyll-archives
|
||||||
jekyll-assets
|
jekyll-assets
|
||||||
|
|||||||
@ -20,6 +20,7 @@ require 'fileutils'
|
|||||||
require 'pathname'
|
require 'pathname'
|
||||||
require 'digest/md5'
|
require 'digest/md5'
|
||||||
require 'mini_magick'
|
require 'mini_magick'
|
||||||
|
require 'fastimage'
|
||||||
|
|
||||||
module Jekyll
|
module Jekyll
|
||||||
|
|
||||||
@ -38,6 +39,7 @@ module Jekyll
|
|||||||
# Gather settings
|
# Gather settings
|
||||||
site = context.registers[:site]
|
site = context.registers[:site]
|
||||||
settings = site.config['picture']
|
settings = site.config['picture']
|
||||||
|
url = site.config['url']
|
||||||
markup = /^(?:(?<preset>[^\s.:\/]+)\s+)?(?<image_src>[^\s]+\.[a-zA-Z0-9]{3,4})\s*(?<source_src>(?:(source_[^\s.:\/]+:\s+[^\s]+\.[a-zA-Z0-9]{3,4})\s*)+)?(?<html_attr>[\s\S]+)?$/.match(render_markup)
|
markup = /^(?:(?<preset>[^\s.:\/]+)\s+)?(?<image_src>[^\s]+\.[a-zA-Z0-9]{3,4})\s*(?<source_src>(?:(source_[^\s.:\/]+:\s+[^\s]+\.[a-zA-Z0-9]{3,4})\s*)+)?(?<html_attr>[\s\S]+)?$/.match(render_markup)
|
||||||
preset = settings['presets'][ markup[:preset] ] || settings['presets']['default']
|
preset = settings['presets'][ markup[:preset] ] || settings['presets']['default']
|
||||||
|
|
||||||
@ -149,17 +151,26 @@ module Jekyll
|
|||||||
if settings['markup'] == 'picture'
|
if settings['markup'] == 'picture'
|
||||||
|
|
||||||
source_tags = ''
|
source_tags = ''
|
||||||
source_keys.each { |source|
|
source_keys.each do |source|
|
||||||
media = " media=\"#{instance[source]['media']}\"" unless source == 'source_default'
|
media = " media=\"#{instance[source]['media']}\"" unless source == 'source_default'
|
||||||
source_tags += "#{markdown_escape * 4}<source srcset=\"#{instance[source][:generated_src]}\"#{media}>\n"
|
source_tags += "#{markdown_escape * 4}<source srcset=\"#{url}#{instance[source][:generated_src]}\"#{media}>\n"
|
||||||
}
|
end
|
||||||
|
|
||||||
# Note: we can't indent html output because markdown parsers will turn 4 spaces into code blocks
|
# Note: we can't indent html output because markdown parsers will turn 4 spaces into code blocks
|
||||||
# Note: Added backslash+space escapes to bypass markdown parsing of indented code below -WD
|
# Note: Added backslash+space escapes to bypass markdown parsing of indented code below -WD
|
||||||
picture_tag = "<picture>\n"\
|
picture_tag = "<picture>\n"\
|
||||||
"#{source_tags}"\
|
"#{source_tags}"\
|
||||||
"#{markdown_escape * 4}<img srcset=\"#{instance['source_default'][:generated_src]}\" #{html_attr_string}>\n"\
|
"#{markdown_escape * 4}<img src=\"#{url}#{instance['source_default'][:generated_src]}\" #{html_attr_string}>\n"\
|
||||||
"#{markdown_escape * 2}</picture>\n"
|
"#{markdown_escape * 2}</picture>\n"
|
||||||
|
elsif settings['markup'] == 'interchange'
|
||||||
|
|
||||||
|
interchange_data = Array.new
|
||||||
|
source_keys.reverse.each do |source|
|
||||||
|
interchange_data << "[#{url}#{instance[source][:generated_src]}, #{source == 'source_default' ? '(default)' : instance[source]['media']}]"
|
||||||
|
end
|
||||||
|
|
||||||
|
picture_tag = %Q{<img data-interchange="#{interchange_data.join ', '}" #{html_attr_string} />\n}
|
||||||
|
picture_tag += %Q{<noscript><img src="#{url}#{instance['source_default'][:generated_src]}" #{html_attr_string} /></noscript>}
|
||||||
|
|
||||||
elsif settings['markup'] == 'img'
|
elsif settings['markup'] == 'img'
|
||||||
# TODO implement <img srcset/sizes>
|
# TODO implement <img srcset/sizes>
|
||||||
@ -170,16 +181,21 @@ module Jekyll
|
|||||||
end
|
end
|
||||||
|
|
||||||
def generate_image(instance, site_source, site_dest, image_source, image_dest, baseurl)
|
def generate_image(instance, site_source, site_dest, image_source, image_dest, baseurl)
|
||||||
image = MiniMagick::Image.open(File.join(site_source, image_source, instance[:src]))
|
begin
|
||||||
digest = Digest::MD5.hexdigest(image.to_blob).slice!(0..5)
|
digest = Digest::MD5.hexdigest(File.read(File.join(site_source, image_source, instance[:src]))).slice!(0..5)
|
||||||
|
rescue Errno::ENOENT
|
||||||
|
warn "Warning:".yellow + " source image #{instance[:src]} is missing."
|
||||||
|
return ""
|
||||||
|
end
|
||||||
|
|
||||||
image_dir = File.dirname(instance[:src])
|
image_dir = File.dirname(instance[:src])
|
||||||
ext = File.extname(instance[:src])
|
ext = File.extname(instance[:src])
|
||||||
basename = File.basename(instance[:src], ext)
|
basename = File.basename(instance[:src], ext)
|
||||||
|
|
||||||
orig_width = image[:width].to_f
|
size = FastImage.size(File.join(site_source, image_source, instance[:src]))
|
||||||
orig_height = image[:height].to_f
|
orig_width = size[0]
|
||||||
orig_ratio = orig_width/orig_height
|
orig_height = size[1]
|
||||||
|
orig_ratio = orig_width*1.0/orig_height
|
||||||
|
|
||||||
gen_width = if instance[:width]
|
gen_width = if instance[:width]
|
||||||
instance[:width].to_f
|
instance[:width].to_f
|
||||||
@ -219,6 +235,7 @@ module Jekyll
|
|||||||
# Let people know their images are being generated
|
# Let people know their images are being generated
|
||||||
puts "Generating #{gen_name}"
|
puts "Generating #{gen_name}"
|
||||||
|
|
||||||
|
image = MiniMagick::Image.open(File.join(site_source, image_source, instance[:src]))
|
||||||
# Scale and crop
|
# Scale and crop
|
||||||
image.combine_options do |i|
|
image.combine_options do |i|
|
||||||
i.resize "#{gen_width}x#{gen_height}^"
|
i.resize "#{gen_width}x#{gen_height}^"
|
||||||
@ -226,7 +243,7 @@ module Jekyll
|
|||||||
i.crop "#{gen_width}x#{gen_height}+0+0"
|
i.crop "#{gen_width}x#{gen_height}+0+0"
|
||||||
end
|
end
|
||||||
|
|
||||||
image.quality 85
|
image.quality 75
|
||||||
|
|
||||||
image.write gen_dest_file
|
image.write gen_dest_file
|
||||||
end
|
end
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user