jekyll-srcset2 0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
checksums.yaml ADDED
@@ -0,0 +1,7 @@
1
+ ---
2
+ SHA1:
3
+ metadata.gz: 250ccab63573fe6b70eb82aa4a1f2d8ec4c9dd3c
4
+ data.tar.gz: c451c1f25a511cd331aaf2146046a508078ba02c
5
+ SHA512:
6
+ metadata.gz: 8754d391e0b766382c2311fc05216fbf9c2171ce4c828b6a19ae35bf8f450d363d2e33067adacb59eea5f700c4b909df35afde81e3bf59955888da28f55f2048
7
+ data.tar.gz: bae0d544248ed7cdea6b54a7a57270b720fd290b8487e901cb493d2fbedd22c20198ffc133df9f529e3b46f7964a30a0f589af5b012a0498f3f498ec1fc1738b
data/.gitignore ADDED
@@ -0,0 +1,14 @@
1
+ /.bundle/
2
+ /.yardoc
3
+ /Gemfile.lock
4
+ /_yardoc/
5
+ /coverage/
6
+ /doc/
7
+ /pkg/
8
+ /spec/reports/
9
+ /tmp/
10
+ *.bundle
11
+ *.so
12
+ *.o
13
+ *.a
14
+ mkmf.log
data/Gemfile ADDED
@@ -0,0 +1,4 @@
1
+ source 'https://rubygems.org'
2
+
3
+ # Specify your gem's dependencies in jekyll-srcset.gemspec
4
+ gemspec
data/LICENSE.txt ADDED
@@ -0,0 +1,22 @@
1
+ Copyright (c) 2015 Mathias Biilmann Christensen, MakerLoop Inc
2
+
3
+ MIT License
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining
6
+ a copy of this software and associated documentation files (the
7
+ "Software"), to deal in the Software without restriction, including
8
+ without limitation the rights to use, copy, modify, merge, publish,
9
+ distribute, sublicense, and/or sell copies of the Software, and to
10
+ permit persons to whom the Software is furnished to do so, subject to
11
+ the following conditions:
12
+
13
+ The above copyright notice and this permission notice shall be
14
+ included in all copies or substantial portions of the Software.
15
+
16
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
17
+ EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
18
+ MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
19
+ NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
20
+ LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
21
+ OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
22
+ WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
data/README.md ADDED
@@ -0,0 +1,120 @@
1
+ # Jekyll Srcset
2
+
3
+ This Jekyll plugin makes it very easy to send larger images to devices with high pixel densities.
4
+
5
+ The plugin adds an `image_tag` Liquid tag that can be used like this:
6
+
7
+ ```html
8
+ {% image_tag src="/image.png" width="100" %}
9
+ ```
10
+
11
+ This will generate the right images and output something like:
12
+
13
+ ```html
14
+ <img src="/image-100x50.png" srcset="/image-100x50.png 1x, /image-200x100.png 2x, /image-300x150.png 3x" width="100">
15
+ ```
16
+
17
+ ## Installation
18
+
19
+ Add this line to your Gemfile:
20
+
21
+ ```ruby
22
+ gem 'jekyll-srcset2'
23
+ ```
24
+
25
+ And then execute:
26
+
27
+ $ bundle
28
+
29
+ Or install it yourself as:
30
+
31
+ $ gem install jekyll-srcset2
32
+
33
+ Then add the gem to your Jekyll `_config.yml`:
34
+
35
+ ```yml
36
+ gems:
37
+ - jekyll-srcset
38
+ ```
39
+
40
+ ## Usage
41
+
42
+ Use it like this in any Liquid template:
43
+
44
+ ```html
45
+ {% image_tag src="/image.png" width="100" %}
46
+ ```
47
+
48
+ You must specify either a `width` or a `height`, but never both. The width or height will be used to determine the smallest version of the image to use (for 1x pixel density devices). Based on this minimum size, the plugin will generate up to 3 versions of the image, one that matches the dimension specified, one that's twice the size and one that's 3 times the size. The plugin never upscales an image.
49
+
50
+ The plugin sets these as a srcset attribute on the final image tag, and modern browsers will then use this information to determine which version of the image to load based on the pixel density of the device (and in the future, potentially based on bandwidth or user settings).
51
+
52
+ This makes it a really straight forward way to serve the right size of image in all modern browsers and in works fine in older browsers without any polyfill (there's not a lot of high pixel density devices out there that runs old browsers, so simply serving the smallest version to the ones that don't understand srcset is fine).
53
+
54
+ To use variables for the image or the dimensions, simply leave out the quotes:
55
+
56
+ ```html
57
+ {% image_tag src=page.cover_image height=page.cover_image_height %}
58
+ ```
59
+
60
+ ## Optipng
61
+
62
+ If you have `optipng` installed and in your PATH, you can tell the plugin to run it on all generated png images.
63
+
64
+ Just add:
65
+
66
+ ```
67
+ srcset:
68
+ optipng: true
69
+ ```
70
+
71
+ To your \_config.yml
72
+
73
+ ## Mozjpeg
74
+
75
+ If you have `cjpeg` installed and added to your PATH, you can tell the plugin to optimize all output jpegs.
76
+ If you get the error `Unrecognized input file format --- perhaps you need -targa`, you have a different
77
+ cjpeg binary in your PATH. Make sure the Mozjpeg version is before it.
78
+
79
+ Just add:
80
+
81
+ ```
82
+ srcset:
83
+ cjpeg: true
84
+ ```
85
+
86
+ To your \_config.yml
87
+
88
+ **Note**: This can increase the generation time of your site significantly depending on how many images you have.
89
+ Also, you may want to bump the quality setting if you see more artifacts in the Mozjpeg-generated version.
90
+
91
+ ## Caching images
92
+
93
+ Optimizing and resizing can take a while for some images. You can specify a cache folder in your Jekyll config to let jekyll-srcset cache images between runs.
94
+
95
+ ```
96
+ srcset:
97
+ cache: "/tmp/images"
98
+ ```
99
+
100
+ ## JPEG quality
101
+ If you need to set jpeg quality you can use this option (default is 80).
102
+
103
+ ```
104
+ srcset:
105
+ jpeg_quality: 60
106
+ ```
107
+
108
+ ## Contributing
109
+
110
+ 1. Fork it ( https://github.com/[my-github-username]/jekyll-srcset/fork )
111
+ 2. Create your feature branch (`git checkout -b my-new-feature`)
112
+ 3. Commit your changes (`git commit -am 'Add some feature'`)
113
+ 4. Push to the branch (`git push origin my-new-feature`)
114
+ 5. Create a new Pull Request
115
+
116
+ ## Host your Jekyll sites with netlify
117
+
118
+ This plugin is developed by netlify, [the premium hosting for static websites](https://www.netlify.com).
119
+
120
+ You can use netlify if you're using custom plugins with your Jekyll sites. When you push to git, netlify will build your Jekyll site and deploy the result to a global CDN, while handling asset fingerprinting, caching headers, bundling, minification and true instant cache invalidation. A 1-click operation with no other setup needed.
data/Rakefile ADDED
@@ -0,0 +1,2 @@
1
+ require "bundler/gem_tasks"
2
+
@@ -0,0 +1,32 @@
1
+ # coding: utf-8
2
+ lib = File.expand_path('../lib', __FILE__)
3
+ $LOAD_PATH.unshift(lib) unless $LOAD_PATH.include?(lib)
4
+ require 'jekyll/srcset/version'
5
+
6
+ Gem::Specification.new do |spec|
7
+ spec.name = "jekyll-srcset2"
8
+ spec.version = Jekyll::Srcset::VERSION
9
+ spec.authors = ["Jason Gabriele", "Mathias Biilmann Christensen"]
10
+ spec.email = ["jason.gabriele@gmail.com", "info@mathias-biilmann.net"]
11
+ spec.summary = %q{This Jekyll plugin ads an image_tag that will generate responsive img tags}
12
+ spec.description = %q{
13
+ This Jekyll plugin makes it very easy to send larger images to devices with high pixel densities.
14
+
15
+ The plugin adds an `image_tag` Liquid tag that can be used like this:
16
+
17
+ \{% image_tag src="/image.png" width="100" %\}
18
+ }
19
+ spec.homepage = "https://github.com/niveus/jekyll-srcset"
20
+ spec.license = "MIT"
21
+
22
+ spec.files = `git ls-files -z`.split("\x0")
23
+ spec.executables = spec.files.grep(%r{^bin/}) { |f| File.basename(f) }
24
+ spec.test_files = spec.files.grep(%r{^(test|spec|features)/})
25
+ spec.require_paths = ["lib"]
26
+
27
+ spec.add_dependency "rmagick"
28
+
29
+ spec.add_development_dependency "bundler", "~> 1.7"
30
+ spec.add_development_dependency "rake", "~> 10.0"
31
+ spec.add_runtime_dependency 'jekyll', '~> 3.0'
32
+ end
@@ -0,0 +1,3 @@
1
+ require "jekyll/srcset"
2
+
3
+ Liquid::Template.register_tag('image_tag', Jekyll::SrcsetTag)
@@ -0,0 +1,8 @@
1
+ require "jekyll/srcset/version"
2
+ require "jekyll/srcset/tag"
3
+ require "jekyll"
4
+
5
+ module Jekyll
6
+ module Srcset
7
+ end
8
+ end
@@ -0,0 +1,156 @@
1
+ require "RMagick"
2
+ require "digest/sha1"
3
+
4
+ module Jekyll
5
+ class SrcsetTag < Liquid::Tag
6
+ include Magick
7
+ attr_accessor :markup
8
+
9
+ # Default quality
10
+ DEFAULT_QUALITY = 80
11
+
12
+ def self.optipng?
13
+ @optinpng ||= system("which", "optipng", :out => File::NULL)
14
+ end
15
+
16
+ def self.cjpeg?
17
+ @cjpeg ||= system("which", "cjpeg", :out => File::NULL)
18
+ end
19
+
20
+ def initialize(tag_name, markup, _)
21
+ @markup = markup
22
+ super
23
+ end
24
+
25
+ def render(context)
26
+ options = parse_options(markup, context)
27
+
28
+ return "Bad options to image_tag, syntax is: {% image_tag src=\"image.png\" width=\"100\"}" unless options["src"]
29
+ return "Error resizing - can't set both width and height" if options["width"] && options["height"]
30
+
31
+ site = context.registers[:site]
32
+ img_attrs = generate_image(site, options["src"], options)
33
+
34
+ srcset = []
35
+ (1..3).each do |factor|
36
+ srcset << {:factor => factor, :img => generate_image(site, options["src"], options.merge("factor" => factor))}
37
+ end
38
+ img_attrs["srcset"] = srcset.map {|i| "#{i[:img]["src"]} #{i[:factor]}x"}.join(", ")
39
+
40
+ "<img #{options.merge(img_attrs).map {|k,v| "#{k}=\"#{v}\""}.join(" ")}>"
41
+ end
42
+
43
+ def parse_options(markup, context)
44
+ options = {}
45
+ markup.scan(/(\w+)=((?:"[^"]+")|(?:'[^']+')|[\w\.\_-]+)/) do |key,value|
46
+ if (value[0..0] == "'" && value[-1..-1]) == "'" || (value[0..0] == '"' && value[-1..-1] == '"')
47
+ options[key] = value[1..-2]
48
+ else
49
+ options[key] = context[value]
50
+ end
51
+ end
52
+ options
53
+ end
54
+
55
+ def config(site)
56
+ site.config['srcset'] || {}
57
+ end
58
+
59
+ def optimize?(site)
60
+ config(site)['optipng']
61
+ end
62
+
63
+ def cjpeg?(site)
64
+ config(site)['cjpeg']
65
+ end
66
+
67
+ def cache_dir(site)
68
+ config(site)['cache']
69
+ end
70
+
71
+ def jpeg_quality(site)
72
+ if config(site).key? 'jpeg_quality'
73
+ config(site)['jpeg_quality']
74
+ else
75
+ DEFAULT_QUALITY
76
+ end
77
+ end
78
+
79
+ def generate_image(site, src, attrs)
80
+ cache = cache_dir(site)
81
+ sha = cache && Digest::SHA1.hexdigest(attrs.sort.inspect + File.read(File.join(site.source, src)) + (optimize?(site) ? "optimize" : ""))
82
+ if sha
83
+ if File.exists?(File.join(cache, sha))
84
+ img_attrs = JSON.parse(File.read(File.join(cache,sha,"json")))
85
+ filename = img_attrs["src"].sub(/^\//, '')
86
+ dest = File.join(site.dest, filename)
87
+ FileUtils.mkdir_p(File.dirname(dest))
88
+ FileUtils.cp(File.join(cache,sha,"img"), dest)
89
+
90
+ site.config['keep_files'] << filename unless site.config['keep_files'].include?(filename)
91
+
92
+ return img_attrs
93
+ end
94
+ end
95
+
96
+ img = Image.read(File.join(site.source, src)).first
97
+ img_attrs = {}
98
+
99
+ if attrs["height"]
100
+ scale = attrs["height"].to_f * (attrs["factor"] || 1) / img.rows.to_f
101
+ elsif attrs["width"]
102
+ scale = attrs["width"].to_f * (attrs["factor"] || 1) / img.columns.to_f
103
+ else
104
+ scale = attrs["factor"] || 1
105
+ end
106
+
107
+ img_attrs["height"] = attrs["height"] if attrs["height"]
108
+ img_attrs["width"] = attrs["width"] if attrs["width"]
109
+ img_width = img.columns * scale
110
+ img_height = img.rows * scale
111
+ img_attrs["src"] = src.sub(/(\.\w+)$/, "-" + (img_width.to_int.to_s) + "x" + (img_height.to_int.to_s) + '\1')
112
+
113
+ filename = img_attrs["src"].sub(/^\//, '')
114
+ dest = File.join(site.dest, filename)
115
+ FileUtils.mkdir_p(File.dirname(dest))
116
+
117
+ unless File.exist?(dest)
118
+ img.scale!(scale) if scale <= 1
119
+ img.strip!
120
+
121
+ # Write resized file
122
+ if dest.match(/\.jpe?g$/)
123
+ quality = jpeg_quality(site)
124
+ img.write(dest) do self.quality = quality end
125
+ else
126
+ img.write(dest)
127
+ end
128
+
129
+ # Optimize pngs
130
+ if dest.match(/\.png$/) && optimize?(site) && self.class.optipng?
131
+ IO.popen(["optipng", dest])
132
+ end
133
+
134
+ # Optimize jpegs using Mozjpeg
135
+ if dest.match(/\.jpe?g$/) && cjpeg?(site) && self.class.cjpeg?
136
+ IO.popen(["cjpeg", "-quality", jpeg_quality(site).to_s, dest])
137
+ end
138
+ end
139
+
140
+ site.config['keep_files'] << filename unless site.config['keep_files'].include?(filename)
141
+
142
+ # Keep files around for incremental builds in Jekyll 3
143
+ site.regenerator.add(filename) if site.respond_to?(:regenerator)
144
+
145
+ if sha
146
+ FileUtils.mkdir_p(File.join(cache, sha))
147
+ FileUtils.cp(dest, File.join(cache, sha, "img"))
148
+ File.open(File.join(cache, sha, "json"), "w") do |f|
149
+ f.write(JSON.generate(img_attrs))
150
+ end
151
+ end
152
+
153
+ img_attrs
154
+ end
155
+ end
156
+ end
@@ -0,0 +1,5 @@
1
+ module Jekyll
2
+ module Srcset
3
+ VERSION = "0.2"
4
+ end
5
+ end
metadata ADDED
@@ -0,0 +1,118 @@
1
+ --- !ruby/object:Gem::Specification
2
+ name: jekyll-srcset2
3
+ version: !ruby/object:Gem::Version
4
+ version: '0.2'
5
+ platform: ruby
6
+ authors:
7
+ - Jason Gabriele
8
+ - Mathias Biilmann Christensen
9
+ autorequire:
10
+ bindir: bin
11
+ cert_chain: []
12
+ date: 2017-06-03 00:00:00.000000000 Z
13
+ dependencies:
14
+ - !ruby/object:Gem::Dependency
15
+ name: rmagick
16
+ requirement: !ruby/object:Gem::Requirement
17
+ requirements:
18
+ - - ">="
19
+ - !ruby/object:Gem::Version
20
+ version: '0'
21
+ type: :runtime
22
+ prerelease: false
23
+ version_requirements: !ruby/object:Gem::Requirement
24
+ requirements:
25
+ - - ">="
26
+ - !ruby/object:Gem::Version
27
+ version: '0'
28
+ - !ruby/object:Gem::Dependency
29
+ name: bundler
30
+ requirement: !ruby/object:Gem::Requirement
31
+ requirements:
32
+ - - "~>"
33
+ - !ruby/object:Gem::Version
34
+ version: '1.7'
35
+ type: :development
36
+ prerelease: false
37
+ version_requirements: !ruby/object:Gem::Requirement
38
+ requirements:
39
+ - - "~>"
40
+ - !ruby/object:Gem::Version
41
+ version: '1.7'
42
+ - !ruby/object:Gem::Dependency
43
+ name: rake
44
+ requirement: !ruby/object:Gem::Requirement
45
+ requirements:
46
+ - - "~>"
47
+ - !ruby/object:Gem::Version
48
+ version: '10.0'
49
+ type: :development
50
+ prerelease: false
51
+ version_requirements: !ruby/object:Gem::Requirement
52
+ requirements:
53
+ - - "~>"
54
+ - !ruby/object:Gem::Version
55
+ version: '10.0'
56
+ - !ruby/object:Gem::Dependency
57
+ name: jekyll
58
+ requirement: !ruby/object:Gem::Requirement
59
+ requirements:
60
+ - - "~>"
61
+ - !ruby/object:Gem::Version
62
+ version: '3.0'
63
+ type: :runtime
64
+ prerelease: false
65
+ version_requirements: !ruby/object:Gem::Requirement
66
+ requirements:
67
+ - - "~>"
68
+ - !ruby/object:Gem::Version
69
+ version: '3.0'
70
+ description: |2
71
+
72
+ This Jekyll plugin makes it very easy to send larger images to devices with high pixel densities.
73
+
74
+ The plugin adds an `image_tag` Liquid tag that can be used like this:
75
+
76
+ {% image_tag src="/image.png" width="100" %}
77
+ email:
78
+ - jason.gabriele@gmail.com
79
+ - info@mathias-biilmann.net
80
+ executables: []
81
+ extensions: []
82
+ extra_rdoc_files: []
83
+ files:
84
+ - ".gitignore"
85
+ - Gemfile
86
+ - LICENSE.txt
87
+ - README.md
88
+ - Rakefile
89
+ - jekyll-srcset.gemspec
90
+ - lib/jekyll-srcset.rb
91
+ - lib/jekyll/srcset.rb
92
+ - lib/jekyll/srcset/tag.rb
93
+ - lib/jekyll/srcset/version.rb
94
+ homepage: https://github.com/niveus/jekyll-srcset
95
+ licenses:
96
+ - MIT
97
+ metadata: {}
98
+ post_install_message:
99
+ rdoc_options: []
100
+ require_paths:
101
+ - lib
102
+ required_ruby_version: !ruby/object:Gem::Requirement
103
+ requirements:
104
+ - - ">="
105
+ - !ruby/object:Gem::Version
106
+ version: '0'
107
+ required_rubygems_version: !ruby/object:Gem::Requirement
108
+ requirements:
109
+ - - ">="
110
+ - !ruby/object:Gem::Version
111
+ version: '0'
112
+ requirements: []
113
+ rubyforge_project:
114
+ rubygems_version: 2.6.10
115
+ signing_key:
116
+ specification_version: 4
117
+ summary: This Jekyll plugin ads an image_tag that will generate responsive img tags
118
+ test_files: []