├── .gitignore ├── .travis.yml ├── Gemfile ├── MIT-LICENSE ├── README.md ├── Rakefile ├── layzr-rails.gemspec └── lib ├── layzr-rails.rb └── layzr-rails ├── configuration.rb └── version.rb /.gitignore: -------------------------------------------------------------------------------- 1 | *.gem 2 | .bundle 3 | .DS_Store 4 | bin 5 | Gemfile.lock 6 | pkg 7 | -------------------------------------------------------------------------------- /.travis.yml: -------------------------------------------------------------------------------- 1 | language: ruby 2 | rvm: 3 | - 2.1.0 4 | - 1.9.3 5 | -------------------------------------------------------------------------------- /Gemfile: -------------------------------------------------------------------------------- 1 | source "http://rubygems.org" 2 | 3 | gemspec 4 | 5 | group :test do 6 | gem "rake" 7 | end 8 | -------------------------------------------------------------------------------- /MIT-LICENSE: -------------------------------------------------------------------------------- 1 | Copyright 2013 YOURNAME 2 | 3 | Permission is hereby granted, free of charge, to any person obtaining 4 | a copy of this software and associated documentation files (the 5 | "Software"), to deal in the Software without restriction, including 6 | without limitation the rights to use, copy, modify, merge, publish, 7 | distribute, sublicense, and/or sell copies of the Software, and to 8 | permit persons to whom the Software is furnished to do so, subject to 9 | the following conditions: 10 | 11 | The above copyright notice and this permission notice shall be 12 | included in all copies or substantial portions of the Software. 13 | 14 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, 15 | EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF 16 | MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND 17 | NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE 18 | LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION 19 | OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION 20 | WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. 21 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | ## Layzr-Rails 2 | 3 | This project integrates the pure vanilla JS [Layzr Plugin](https://github.com/callmecavs/layzr.js) for Rails `image_tag` helpers 4 | 5 | ### What's Layzr Plugin? 6 | 7 | From the project page: 8 | 9 | *A small, fast, and modern library for lazy loading images, its written in vanilla JS so don't need any Jquery or other js library.* 10 | 11 | See [live demo](http://callmecavs.com/layzr.js/). 12 | 13 | ## Documentation 14 | 15 | ### Installation 16 | 17 | Add it in your gemfile 18 | 19 | ```ruby 20 | gem 'layzr-rails' 21 | ``` 22 | 23 | Create a configuration file and put it in your initializers `config/initializers/layzr.rb` 24 | 25 | ```ruby 26 | Layzr::Rails.configure do |config| 27 | config.placeholder = "/assets/some-default-image.png" 28 | end 29 | ``` 30 | 31 | Add Layzr js and require layzr library in application.js ie: 32 | 33 | ```sass 34 | //= require layzr 35 | ``` 36 | 37 | And place the javascript code: 38 | 39 | ```js 40 | $(document).ready(function() { 41 | const instance = Layzr() 42 | }); 43 | ``` 44 | 45 | ### Features 46 | 47 | * Add `lazy: true` option to Rails `image_tag` helpers to render layzr-friendly img tags. 48 | * Simple (really). That's pretty much it. 49 | 50 | ### Example 51 | 52 | ```erb 53 | <%= image_tag "kittenz.png", alt: "OMG a cat!", lazy: true %> 54 | ``` 55 | 56 | Equals: 57 | 58 | ```html 59 | OMG a cat! 60 | ``` 61 | 62 | ### More options 63 | 64 | ```erb 65 | <%= image_tag "normal.jpg", lazy: true, layzr: { retina: "retina.jpg", srcset: "small.jpg 320w, medium.jpg 768w, large.jpg 1024w"} %> 66 | ``` 67 | 68 | Equals: 69 | 70 | ```html 71 | 72 | ``` 73 | 74 | 75 | ## License 76 | 77 | Layzr-Rails is released under the [MIT License](http://www.opensource.org/licenses/MIT). 78 | -------------------------------------------------------------------------------- /Rakefile: -------------------------------------------------------------------------------- 1 | require "bundler/gem_tasks" 2 | require "rake/testtask" 3 | 4 | Rake::TestTask.new do |t| 5 | t.libs << "test" 6 | t.warning = true 7 | end 8 | 9 | task :default => :test -------------------------------------------------------------------------------- /layzr-rails.gemspec: -------------------------------------------------------------------------------- 1 | $:.push File.expand_path("../lib", __FILE__) 2 | require "layzr-rails/version" 3 | 4 | Gem::Specification.new do |gem| 5 | gem.name = "layzr-rails" 6 | gem.version = Layzr::Rails::VERSION 7 | gem.summary = "Layzr JS Wrapper for Rails image_tag helpers" 8 | gem.description = "layzr-rails project integrates Layzr JS for Rails image_tag helpers" 9 | gem.license = "MIT" 10 | 11 | gem.files = Dir["README.md", "MIT-LICENSE", "lib/**/*.rb"] 12 | 13 | gem.add_dependency "nokogiri", "~> 1.5" 14 | gem.add_development_dependency "actionpack", ">= 3.1" 15 | 16 | gem.author = "Mohit Jain" 17 | gem.email = "jain.mohit27@gmail.com" 18 | gem.homepage = "https://github.com/mohitjain/layzr-rails" 19 | end 20 | -------------------------------------------------------------------------------- /lib/layzr-rails.rb: -------------------------------------------------------------------------------- 1 | require "nokogiri" 2 | require "action_view" 3 | 4 | require "layzr-rails/version" 5 | require "layzr-rails/configuration" 6 | 7 | module Layzr 8 | module Rails 9 | 10 | def self.configuration 11 | @configuration ||= Layzr::Rails::Configuration.new 12 | end 13 | 14 | def self.configuration=(new_configuration) 15 | @configuration = new_configuration 16 | end 17 | 18 | # Yields the global configuration to a block. 19 | # 20 | # Example: 21 | # Layzr::Rails.configure do |config| 22 | # config.placeholder = '/public/images/foo.gif' 23 | # end 24 | def self.configure 25 | yield configuration if block_given? 26 | end 27 | 28 | def self.reset 29 | @configuration = nil 30 | end 31 | end 32 | end 33 | 34 | ActionView::Helpers::AssetTagHelper.module_eval do 35 | alias :rails_image_tag :image_tag 36 | 37 | def image_tag(*attrs) 38 | options, args, layzr_options = extract_options_and_args(*attrs) 39 | image_html = rails_image_tag(*args) 40 | 41 | if options[:lazy] 42 | to_lazy_image(image_html, layzr_options) 43 | else 44 | image_html 45 | end 46 | end 47 | 48 | private 49 | 50 | def to_lazy_image(image_html, layzr_options) 51 | img = Nokogiri::HTML::DocumentFragment.parse(image_html).at_css("img") 52 | 53 | img["data-normal"] = img["src"] 54 | unless layzr_options.nil? 55 | img['data-retina'] = layzr_options[:retina] unless layzr_options[:retina].blank? 56 | img['data-srcset'] = layzr_options[:srcset] unless layzr_options[:srcset].blank? 57 | end 58 | img["src"] = Layzr::Rails.configuration.placeholder 59 | 60 | img.to_s.html_safe 61 | end 62 | 63 | def extract_options_and_args(*attrs) 64 | args = attrs 65 | if args.size > 1 66 | options = attrs.last.dup 67 | args.last.delete(:lazy) 68 | layzr_options = args.last.delete(:layzr) || {} 69 | else 70 | layzr_options = {} 71 | options = {} 72 | end 73 | 74 | [options, args, layzr_options] 75 | end 76 | 77 | end 78 | -------------------------------------------------------------------------------- /lib/layzr-rails/configuration.rb: -------------------------------------------------------------------------------- 1 | # -*- coding: utf-8 -*- 2 | module Layzr 3 | module Rails 4 | 5 | # Stores runtime configuration information. 6 | # 7 | # Example settings 8 | # Layzr::Rails.configure do |c| 9 | # c.placeholder = "/public/img/grey.gif" 10 | # end 11 | class Configuration 12 | attr_accessor :placeholder 13 | end 14 | end 15 | end 16 | -------------------------------------------------------------------------------- /lib/layzr-rails/version.rb: -------------------------------------------------------------------------------- 1 | module Layzr 2 | module Rails 3 | VERSION = "0.1.0" 4 | end 5 | end 6 | --------------------------------------------------------------------------------