jekyll-responsive_image 0.9.0 → 0.9.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: b473c6730697db2d34bf8a02b5c715abe4a35149
-  data.tar.gz: aa1bfa551cd86999fa2cb4b253b038c1d7ce7185
+  metadata.gz: dc0a20c9cc1f1bfd10aef481ca55672377b9379f
+  data.tar.gz: 60044f0efde1042917c727817d597e11e38ca40a
 SHA512:
-  metadata.gz: 5e22114a262175eea4826c6d73419c9709bc936507b7b5a2c13c26c9510a5bb44611308a44b64c379936a760b1e3188efd145c3fc52e3914a6c4bbcd78c60a23
-  data.tar.gz: 37da18d95c3579ba4cea87190dca29c2e76936e9181ca9af678993b3e69dce6b222d905c73e0be43c2dcc0aca7aaf87434360c045864e23c1b432689fbce5c5c
+  metadata.gz: 2c21adf98bc2bd32e379bb7721f7ff2ce9149f2a351dd00f99ead6f52b935ae82a30ce1d62fb76abbef567c5d0ad701e36ffc31617bef6b609ce316ae6c23d1d
+  data.tar.gz: fb4cd91b2570b517e2e05662e1117adce75616b973a48faf6147e3f4ecc802be260e81e7e74a49b4be166025160c826cf3a4a6f7d1ea3dbe29519dd4419a5bc4

data/.gitignore

@@ -1 +1,2 @@
+coverage
 Gemfile.lock

data/README.md

@@ -8,18 +8,19 @@ Jekyll Responsive Images is a [Jekyll](http://jekyllrb.com/) plugin and utility
 
 ## Installation
 
-Install the gem yourself
+You can either use the gem and update your `_config.yml`:
 
 ```
 $ gem install jekyll-responsive_image
 ```
 
-Or simply add it to your Jekyll `_config.yml`:
-
 ```yaml
+# _config.yml
 gems: [jekyll-responsive_image]
 ```
 
+Or you can simply copy [`responsive_image.rb`](lib/jekyll/responsive_image.rb) into your `_plugins` directory.
+
 ## Configuration
 
 An example configuration is below.
@@ -33,30 +34,38 @@ responsive_image:
   sizes:
     - width: 480 # How wide the resized image will be. Required
     - width: 800
-      quality: 90 # JPEG quality. Optional.
+      quality: 90 # Override JPEG quality (default is 85). Optional.
     - width: 1400
 ```
 
 ## Usage
 
-Replace your images with the `responsive_image` tag, specifying a path to the image.
+Replace your images with the `responsive_image` tag, specifying the path to the image in the `path` attribute.
 
 ```
 {% responsive_image path: assets/my-file.jpg %}
 ```
 
-Any extra attributes will be passed to the template.
+You can override the template on a per-image basis by specifying the `template` attribute.
+
+```
+{% responsive_image path: assets/my-file.jpg template: _includes/another-template.html %}
+```
+
+Any extra attributes will be passed straight to the template as variables.
 
 ```
 {% responsive_image path: assets/image.jpg alt: "Lorem ipsum..." title: "Lorem ipsum..." %}
 ```
 
-Create a template to suit your needs. A basic template example is below.
+### Template
+
+You will need to create a template in order to use the `responsive_image` tag. A sample template is below.
 
 ```html
 <img src="/{{ path }}"
      alt="{{ alt }}"
-     title="{{ title }}
+     title="{{ title }}"
 
      {% if resized %}
          srcset="{% for i in resized %}
@@ -65,3 +74,21 @@ Create a template to suit your needs. A basic template example is below.
      {% endif %}
 >
 ```
+
+#### Template Variables
+
+The following variables are available in the template:
+
+| Variable  | Type   | Description                                                                                          |
+|-----------|--------|------------------------------------------------------------------------------------------------------|
+| `path`    | String | The path of the unmodified image. This is always the same as the `path` attribute passed to the tag. |
+| `resized` | Array  | An array of all the resized images. Each image contains the properties listed below.                 |
+| `*`       | String | Any other attributes will be passed to the template verbatim as strings.                             |
+
+Each element in the `resized` array contains the following properties:
+
+| Variable | Type     | Description                      |
+|----------|----------|----------------------------------|
+| `path`   | String   | The path of the resized image.   |
+| `width`  | Integer  | The width of the resized image.  |
+| `height` | Integer  | The height of the resized image. |

data/Rakefile

@@ -22,7 +22,7 @@ task :default => [:features]
 
 task :release do |t|
   system "gem build jekyll-responsive_image.gemspec"
-  system "git tag v#{Jekyll::ResponsiveImage::VERSION}"
+  system "git tag v#{Jekyll::ResponsiveImage::VERSION} -a -m 'Tagged release of jekyll-responsive_image-#{Jekyll::ResponsiveImage::VERSION}.gem'"
   system "git push --tags"
   system "gem push jekyll-responsive_image-#{Jekyll::ResponsiveImage::VERSION}.gem"
 end

data/features/fixtures/_includes/custom-template.html

@@ -0,0 +1 @@
+{{ resized | map: 'width' }}

data/features/fixtures/_includes/responsive-image.html

@@ -1,4 +1,4 @@
-<img alt="{{ alt }}" src="/{{ path }}"{% if resized %} srcset="
+<img alt="{{ alt }}" src="/{{ path }}" title="{{ title }}"{% if resized %} srcset="
     {% for i in resized %}
         /{{ i.path }} {{ i.width }}w{% if forloop.last == false %},{% endif %}
     {% endfor %}

data/features/responsive-image.feature

@@ -13,9 +13,21 @@ Feature: Jekyll responsive-image tag
       {% responsive_image path: assets/test.png alt: Foobar %}
       """
     When I run Jekyll
-    Then I should see "<img alt=\"Foobar\" src=\"/assets/test.png\">" in "_site/index.html"
+    Then I should see "<img alt=\"Foobar\" src=\"/assets/test.png\"" in "_site/index.html"
 
-  Scenario: UTF-8 alt attribute
+  Scenario: Adding custom attributes
+    Given I have a responsive_image configuration with:
+      """
+        template: _includes/responsive-image.html
+      """
+    And I have a file "index.html" with:
+      """
+      {% responsive_image path: assets/test.png alt: Foobar title: "Lorem Ipsum" %}
+      """
+    When I run Jekyll
+    Then I should see "<img alt=\"Foobar\" src=\"/assets/test.png\" title=\"Lorem Ipsum\"" in "_site/index.html"
+
+  Scenario: UTF-8 attributes
     Given I have a responsive_image configuration with:
       """
         template: _includes/responsive-image.html
@@ -25,7 +37,7 @@ Feature: Jekyll responsive-image tag
       {% responsive_image path: assets/test.png alt: "かっこいい！ ジェケルが好きです！" %}
       """
     When I run Jekyll
-    Then I should see "<img alt=\"かっこいい！ ジェケルが好きです！\" src=\"/assets/test.png\">" in "_site/index.html"
+    Then I should see "<img alt=\"かっこいい！ ジェケルが好きです！\" src=\"/assets/test.png\"" in "_site/index.html"
 
   Scenario: Image with multiple sizes
     Given I have a responsive_image configuration with:
@@ -45,3 +57,18 @@ Feature: Jekyll responsive-image tag
     And I should see "/assets/resized/test-200x100.png 200w" in "_site/index.html"
     And the file "assets/resized/test-100x50.png" should exist
     And the file "assets/resized/test-200x100.png" should exist
+
+  Scenario: Overriding the template
+    Given I have a responsive_image configuration with:
+      """
+        template: _includes/responsive-image.html
+        sizes:
+          - width: 100
+          - width: 200
+      """
+    And I have a file "index.html" with:
+      """
+      {% responsive_image path: assets/test.png template: _includes/custom-template.html %}
+      """
+    When I run Jekyll
+    Then I should see "100200" in "_site/index.html"

data/features/support/env.rb

@@ -1,7 +1,6 @@
-begin
-  require 'coveralls' if ENV['CI']
-rescue LoadError
-  # ignore
+if ENV['CI']
+  require 'coveralls'
+  Coveralls.wear!
 end
 
 require 'test/unit'

data/lib/jekyll/responsive_image.rb

@@ -86,9 +86,10 @@ module Jekyll
         config['output_dir'] ||= 'assets/resized'
         config['sizes'] ||= []
 
+        @attributes['template'] ||= config['template']
         @attributes['resized'] = resize_image(@attributes['path'], config)
 
-        partial = File.read(config['template'])
+        partial = File.read(@attributes['template'])
         template = Liquid::Template.parse(partial)
 
         template.render!(@attributes)

data/lib/jekyll/responsive_image/version.rb

@@ -1,5 +1,5 @@
 module Jekyll
   class ResponsiveImage
-    VERSION = '0.9.0'.freeze
+    VERSION = '0.9.1'.freeze
   end
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: jekyll-responsive_image
 version: !ruby/object:Gem::Version
-  version: 0.9.0
+  version: 0.9.1
 platform: ruby
 authors:
 - Joseph Wynn
@@ -54,6 +54,7 @@ files:
 - LICENSE
 - README.md
 - Rakefile
+- features/fixtures/_includes/custom-template.html
 - features/fixtures/_includes/responsive-image.html
 - features/fixtures/assets/test.png
 - features/responsive-image.feature