From 1a616adbfcfc099576684a9e780c4cdf6a0d7236 Mon Sep 17 00:00:00 2001 From: Manish Yadav Date: Mon, 3 Jun 2019 17:41:06 +0530 Subject: [PATCH 1/3] feat: Webp images with fallback --- Gemfile | 1 + Gemfile.lock | 4 +++- _config.yml | 31 +++++++++++++++++++++++++++++++ _includes/footer.html | 26 ++++++++++++++++++++++---- _plugins/srcset.rb | 15 +++++++++++++++ 5 files changed, 72 insertions(+), 5 deletions(-) create mode 100644 _plugins/srcset.rb diff --git a/Gemfile b/Gemfile index 5320534..ccac8e3 100644 --- a/Gemfile +++ b/Gemfile @@ -18,6 +18,7 @@ gem "jekyll", "~> 3.7.2" group :jekyll_plugins do gem "jekyll-feed", "~> 0.6" gem "jekyll-assets" + gem "jekyll-webp" end # Windows does not include zoneinfo files, so bundle the tzinfo-data gem diff --git a/Gemfile.lock b/Gemfile.lock index b81d227..9007ce5 100644 --- a/Gemfile.lock +++ b/Gemfile.lock @@ -55,6 +55,7 @@ GEM sass (~> 3.4) jekyll-watch (2.1.2) listen (~> 3.0) + jekyll-webp (1.0.0) kramdown (1.17.0) liquid (4.0.3) liquid-tag-parser (1.9.0) @@ -98,7 +99,8 @@ DEPENDENCIES jekyll (~> 3.7.2) jekyll-assets jekyll-feed (~> 0.6) + jekyll-webp tzinfo-data BUNDLED WITH - 1.16.1 + 2.0.1 diff --git a/_config.yml b/_config.yml index 7cdfbc9..5829cd1 100644 --- a/_config.yml +++ b/_config.yml @@ -46,3 +46,34 @@ exclude: - CONTRIBUTING.md - LICENSE.md - WEBSITE-CODE-OF-CONDUCT.md + +############################################################ +# Site configuration for the WebP Generator Plugin +# The values here represent the defaults if nothing is set +webp: + enabled: true + + # The quality of the webp conversion 0 to 100 (where 100 is least lossy) + quality: 75 + + # List of directories containing images to optimize, nested directories will not be checked + # By default the generator will search for a folder called `/img` under the site root and process all jpg, png and tiff image files found there. + img_dir: ["/assets/images"] + + # add ".gif" to the format list to generate webp for animated gifs as well + formats: [".jpeg", ".jpg", ".png", ".tiff"] + + # File extensions for animated gif files + gifs: [".gif"] + + # Set to true to always regenerate existing webp files + regenerate: false + + # Local path to the WebP utilities to use (relative or absolute) + # Omit or leave as nil to use the utilities shipped with the gem, override only to use your local install + webp_path: nil + + # List of files or directories to exclude + # e.g. custom or hand generated webp conversion files + exclude: [] +############################################################ \ No newline at end of file diff --git a/_includes/footer.html b/_includes/footer.html index 16721fe..08d22ed 100644 --- a/_includes/footer.html +++ b/_includes/footer.html @@ -3,17 +3,35 @@
contact@in.pycon.org
- {% asset logo-small.png alt="PyCon India 2019 Logo" width="70%" %} + + {% srcset logo-small.png %} + {% asset logo-small.png alt="PyCon India 2019 Logo" width="70%" %} +

Design by

- {% asset wclogo.png alt="Webchirpy Logo" width="40%" %} + + + {% srcset wclogo.png %} + {% asset wclogo.png alt="Webchirpy Logo" width="40%" %} + +
diff --git a/_plugins/srcset.rb b/_plugins/srcset.rb new file mode 100644 index 0000000..fe859c9 --- /dev/null +++ b/_plugins/srcset.rb @@ -0,0 +1,15 @@ +module Jekyll +class RenderTimeTag < Liquid::Tag + + def initialize(tag_name, src, tokens) + super + @src = src + end + + def render(context) + "" + end +end +end + +Liquid::Template.register_tag('srcset', Jekyll::RenderTimeTag) \ No newline at end of file From f1660f43c89fdd2c0f0cb843434ecab63ea844bb Mon Sep 17 00:00:00 2001 From: Manish Yadav Date: Wed, 5 Jun 2019 22:34:25 +0530 Subject: [PATCH 2/3] fix: Added picture tag implementation using liquid --- _includes/footer.html | 20 ++++---------------- _plugins/picture.rb | 22 ++++++++++++++++++++++ _plugins/srcset.rb | 15 --------------- 3 files changed, 26 insertions(+), 31 deletions(-) create mode 100644 _plugins/picture.rb delete mode 100644 _plugins/srcset.rb diff --git a/_includes/footer.html b/_includes/footer.html index 08d22ed..68b97ca 100644 --- a/_includes/footer.html +++ b/_includes/footer.html @@ -4,33 +4,21 @@
contact@in.pycon.org
- - {% srcset logo-small.png %} - {% asset logo-small.png alt="PyCon India 2019 Logo" width="70%" %} - + {% picture src=logo-small alt="Twitter" width="70%"%}

Design by

- - {% srcset wclogo.png %} - {% asset wclogo.png alt="Webchirpy Logo" width="40%" %} - + {% picture src=wclogo alt="Webchirpy Logo" width="40%"%}
diff --git a/_plugins/picture.rb b/_plugins/picture.rb new file mode 100644 index 0000000..e5c9df0 --- /dev/null +++ b/_plugins/picture.rb @@ -0,0 +1,22 @@ +module Jekyll +class RenderTimeTag < Liquid::Tag + + def initialize(tag_name, markup, tokens) + super + @args = Parser.new(markup) + end + + def render(context) + width = "width=#{@args[:width]}" + tag = " + + #{@args[:alt] unless @args[:alt].nil?} + + " + + return tag + end +end +end + +Liquid::Template.register_tag('picture', Jekyll::RenderTimeTag) \ No newline at end of file diff --git a/_plugins/srcset.rb b/_plugins/srcset.rb deleted file mode 100644 index fe859c9..0000000 --- a/_plugins/srcset.rb +++ /dev/null @@ -1,15 +0,0 @@ -module Jekyll -class RenderTimeTag < Liquid::Tag - - def initialize(tag_name, src, tokens) - super - @src = src - end - - def render(context) - "" - end -end -end - -Liquid::Template.register_tag('srcset', Jekyll::RenderTimeTag) \ No newline at end of file From 30a404d1304f5f9f6d55fe84ba19b5a73e301697 Mon Sep 17 00:00:00 2001 From: Manish Yadav Date: Thu, 6 Jun 2019 21:06:26 +0530 Subject: [PATCH 3/3] fix(picture.rb): loop over all attributes and add them --- _plugins/picture.rb | 14 ++++++++++---- 1 file changed, 10 insertions(+), 4 deletions(-) diff --git a/_plugins/picture.rb b/_plugins/picture.rb index e5c9df0..087330a 100644 --- a/_plugins/picture.rb +++ b/_plugins/picture.rb @@ -7,16 +7,22 @@ def initialize(tag_name, markup, tokens) end def render(context) - width = "width=#{@args[:width]}" + attributes = "" + @args.each do |key, value| + if key == :src + attributes.concat("#{key}='./assets/images/#{value}.png'") + else + attributes.concat("#{key}='#{value}' "); + end + end tag = " - #{@args[:alt] unless @args[:alt].nil?} + " - return tag end end end -Liquid::Template.register_tag('picture', Jekyll::RenderTimeTag) \ No newline at end of file +Liquid::Template.register_tag('picture', Jekyll::RenderTimeTag)