lazy_img_rails 0.0.1

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA1:
+  metadata.gz: 39840ac81c2219c9d99b90c523527fe9d4c0e87f
+  data.tar.gz: 93006a07afaf56e8f0cd53a1a70e5e27ae1091d6
+SHA512:
+  metadata.gz: ccd26a8a4b2f828ca364354a18cb853b8595a6a813157ca95c64713527b296aef36ed8a1b585d816b12371211b1499989073c2310818ce6136908f211705e395
+  data.tar.gz: 62b360069d2b9f6c3dda0776596b3f9ccdc9fefff02dd020dd9cf276cc4dc7fd43e4ed55e895a4bd090ef063cfde0779af0599a5dca6285e66e0571eca7f4f56

data/README.md

@@ -0,0 +1,41 @@
+# LazyImgRails
+
+Fork of https://github.com/angelodlfrtr/lazyloadjs
+which use https://github.com/vvo/lazyload/ js lib
+
+## Installation
+
+Add this line to your application's Gemfile:
+
+    gem 'lazy_img_rails'
+
+And then execute:
+
+    $ bundle install
+
+Or install it yourself as:
+
+    $ gem install lazy_img_rails
+
+## Usage
+
+Add lazyloadjs in Assets Pipeline (e.g. `app/assets/javascripts/application.js`)
+
+    # Add it after all your others scripts
+    //= lazyload
+
+Restart your application. Done.
+
+This gem provides a helper that allows you to render `<img>` tag
+
+    # image_tag_lazy 'image_url', *options
+    # eg
+    = image_tag_lazy image_url("my_logo.png"), style: "height: 200px;", alt: "My logo"
+
+## Contributing
+
+1. Fork it ( https://github.com/trrbl/lazy_img_rails/fork )
+2. Create your feature branch (`git checkout -b my-new-feature`)
+3. Commit your changes (`git commit -am 'Add some feature'`)
+4. Push to the branch (`git push origin my-new-feature`)
+5. Create new Pull Request

data/lib/lazy_img_rails.rb

@@ -0,0 +1,9 @@
+require "lazy_img_rails/version"
+require 'lazy_img_rails/railtie' if defined?(Rails)
+
+module LazyImgRails
+  module Rails
+    class Engine < ::Rails::Engine
+    end
+  end
+end

data/lib/lazy_img_rails/railtie.rb

@@ -0,0 +1,9 @@
+require 'lazy_img_rails/view_helpers'
+
+module LazyImgRails
+  class Railtie < Rails::Railtie
+    initializer "lazy_img_rails.view_helpers" do
+      ActionView::Base.send :include, ViewHelpers
+    end
+  end
+end

data/lib/lazy_img_rails/version.rb

@@ -0,0 +1,3 @@
+module LazyImgRails
+  VERSION = "0.0.1"
+end

data/lib/lazy_img_rails/view_helpers.rb

@@ -0,0 +1,10 @@
+module LazyImgRails
+  module ViewHelpers
+    def image_tag_lazy image_path, args = {}
+      options = ''
+      args.each{|arg| options += "#{arg[0]}='#{arg[1]}'"}
+
+      raw "<img data-src='#{image_path}' src=data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw== onload=lzld(this) onerror=lzld(this) #{options} />"
+    end
+  end
+end

data/vendor/assets/javascripts/lazyload.js

@@ -0,0 +1,337 @@
+/**
+* @license in-viewport v0.4.1 | github.com/vvo/in-viewport#license
+*/
+
+(function(win, doc){
+  var instances = [];
+
+  win['inViewport'] = inViewport;
+
+  function inViewport(elt, params, cb) {
+    var opts = {
+      container: doc.body,
+      offset: 0
+    };
+
+    if (params === undefined || typeof params === 'function') {
+      cb = params;
+      params = {};
+    }
+
+    var container = opts.container = params['container'] || opts.container;
+    var offset = opts.offset = params['offset'] || opts.offset;
+
+    for (var i = 0; i < instances.length; i++) {
+      if (instances[i].container === container) {
+        return instances[i].inViewport(elt, offset, cb);
+      }
+    }
+
+    return instances[
+      instances.push(createInViewport(container)) - 1
+    ].inViewport(elt, offset, cb)
+  }
+
+  function addEvent( el, type, fn ) {
+    if (el.attachEvent) {
+      el.attachEvent( 'on' + type, fn );
+    } else {
+      el.addEventListener( type, fn, false );
+    }
+  }
+
+  function debounce(func, wait, immediate) {
+    var timeout;
+    return function() {
+      var context = this, args = arguments;
+      var later = function() {
+        timeout = null;
+        if (!immediate) func.apply(context, args);
+      };
+      var callNow = immediate && !timeout;
+      clearTimeout(timeout);
+      timeout = setTimeout(later, wait);
+      if (callNow) func.apply(context, args);
+    }
+  }
+
+  // https://github.com/jquery/sizzle/blob/3136f48b90e3edc84cbaaa6f6f7734ef03775a07/sizzle.js#L708
+  var contains = document.documentElement.compareDocumentPosition ?
+    function( a, b ) {
+      return !!(a.compareDocumentPosition( b ) & 16);
+    } :
+    document.documentElement.contains ?
+    function( a, b ) {
+      return a !== b && ( a.contains ? a.contains( b ) : false );
+    } :
+    function( a, b ) {
+      while ( (b = b.parentNode) ) {
+        if ( b === a ) {
+          return true;
+        }
+      }
+      return false;
+    };
+
+  function createInViewport(container) {
+    var watches = [];
+    var watching = [];
+
+    var scrollContainer = container === doc.body ? win : container;
+    var debouncedCheck = debounce(checkElements, 15);
+
+    addEvent(scrollContainer, 'scroll', debouncedCheck);
+
+
+    if (scrollContainer === win) {
+      addEvent(win, 'resize', debouncedCheck);
+    }
+
+    if (typeof window['MutationObserver'] === 'function') {
+      observeDOM(watching, container, debouncedCheck);
+    }
+
+    function inViewport(elt, offset, cb) {
+      if (!contains(doc.documentElement, elt) ||
+          !contains(doc.documentElement, container)) {
+          if (cb) {
+            return setTimeout(addWatch(elt, offset, cb), 0);
+          } else {
+            return false;
+          }
+      }
+
+      var eltRect = elt.getBoundingClientRect();
+      var containerRect = container.getBoundingClientRect();
+
+      var pos = {
+        left: eltRect.left,
+        top: eltRect.top
+      };
+
+      var viewport = {
+        width: offset,
+        height: offset
+      };
+
+      if (container === doc.body) {
+        viewport.width += doc.documentElement.clientWidth;
+        viewport.height += doc.documentElement.clientHeight;
+
+        // We update body rect computing because
+        // when you have relative/absolute childs, you get bad compute
+        // we need to create a new Object, because it's read only
+        containerRect = {
+          bottom: container.scrollHeight,
+          top: 0,
+          left: 0,
+          right: container.scrollWidth
+        };
+      } else {
+        pos.left -= containerRect.left;
+        pos.top -= containerRect.top;
+        viewport.width += container.clientWidth;
+        viewport.height += container.clientHeight;
+      }
+
+      var visible =
+      // 1. They must overlap
+      !(
+        eltRect.right < containerRect.left ||
+        eltRect.left > containerRect.right ||
+        eltRect.bottom < containerRect.top ||
+        eltRect.top > containerRect.bottom
+      ) && (
+      // 2. They must be visible in the viewport
+        pos.top <= viewport.height &&
+        pos.left <= viewport.width
+      );
+
+      if (visible) {
+        if (cb) {
+          watching.splice(indexOf.call(watching, elt), 1);
+          cb(elt);
+        } else {
+          return true;
+        }
+      } else {
+        if (cb) {
+          setTimeout(addWatch(elt, offset, cb), 0);
+        } else {
+          return false;
+        }
+      }
+    }
+
+    function addWatch(elt, offset, cb) {
+      if (indexOf.call(watching, elt) === -1) {
+        watching.push(elt);
+      }
+
+      return function() {
+        watches.push(function() {
+          inViewport(elt, offset, cb);
+        });
+      }
+    }
+
+    function checkElements() {
+      var cb;
+      while(cb = watches.shift()) {
+        cb();
+      }
+    }
+
+    return {
+      container: container,
+      inViewport: inViewport
+    }
+  }
+
+  function indexOf(value) {
+    for (var i = this.length; i-- && this[i] !== value;) {}
+    return i;
+  }
+
+  function observeDOM(elements, container, cb) {
+    var observer = new MutationObserver(watch);
+    var filter = Array.prototype.filter;
+
+    observer.observe(container, {
+      childList: true,
+      subtree: true
+    });
+
+    function watch(mutations) {
+      // some new DOM nodes where previously watched
+      // we should check their positions
+      if (mutations.some(knownNodes) === true) {
+        setTimeout(cb, 0);
+      }
+    }
+
+    function isWatched(node) {
+      return indexOf.call(elements, node) !== -1;
+    }
+
+    function knownNodes(mutation) {
+      return filter.call(mutation.addedNodes, isWatched).length > 0
+    }
+  }
+
+})(window, document);
+/**
+* @license lazyload v2.1.1 | github.com/vvo/lazyload#license
+*/
+
+(function(window, document){
+
+  var lazyAttrs = ['data-src'];
+
+  window['lazyload'] = lazyload;
+  window['lzld'] = lazyload();
+
+  // Provide libs using getAttribute early to get the good src
+  // and not the fake data-src
+  replaceGetAttribute('Image');
+  replaceGetAttribute('IFrame');
+
+  function registerLazyAttr(attr) {
+    if (indexOf.call(lazyAttrs, attr) === -1) {
+      lazyAttrs.push(attr);
+    }
+  }
+
+  function lazyload(opts) {
+
+    if (arguments.length > 1) {
+      return inViewport.apply(undefined, arguments);
+    }
+
+    opts = merge({
+      'offset': 333,
+      'src': 'data-src',
+      'container': false
+    }, opts || {});
+
+    if (typeof opts['src'] === 'string') {
+      registerLazyAttr(opts['src']);
+    }
+
+    var elts = [];
+
+    function show(elt) {
+      var src = findRealSrc(elt);
+
+      if (src) {
+        elt.src = src;
+      }
+
+      elt['data-lzled'] = true;
+      elts[indexOf.call(elts, elt)] = null;
+    }
+
+    function findRealSrc(elt) {
+      if (typeof opts['src'] === 'function') {
+        return opts['src'](elt);
+      } else {
+        return elt.getAttribute(opts['src']);
+      }
+    }
+
+    function register(elt) {
+      // unsubscribe onload
+      // needed by IE < 9, otherwise we get another onload when changing the src
+      elt.onload = null;
+      elt.removeAttribute('onload');
+
+      if (indexOf.call(elts, elt) === -1) {
+        inViewport(elt, opts, show);
+      }
+    }
+
+    return register;
+  }
+
+  function replaceGetAttribute(elementName) {
+    var fullname = 'HTML' + elementName + 'Element';
+    if (fullname in window === false) {
+      return;
+    }
+
+    var original = window[fullname].prototype.getAttribute;
+    window[fullname].prototype.getAttribute = function(name) {
+      if(name === 'src') {
+        var realSrc;
+        for (var i = 0, max = lazyAttrs.length; i < max; i++) {
+          if (realSrc = original.call(this, lazyAttrs[i])) {
+            break;
+          }
+        }
+
+        return realSrc || original.call(this, name);
+      } else {
+        // our own lazyloader will go through theses lines
+        // because we use getAttribute(opts.src)
+        return original.call(this, name);
+      }
+    }
+  }
+
+  function merge(defaults, opts) {
+    for (var name in defaults) {
+      if (opts[name] === undefined) {
+        opts[name] = defaults[name];
+      }
+    }
+
+    return opts;
+  }
+
+  // http://webreflection.blogspot.fr/2011/06/partial-polyfills.html
+  function indexOf(value) {
+      for (var i = this.length; i-- && this[i] !== value;) {}
+      return i;
+  }
+
+}(window, document));

metadata

@@ -0,0 +1,93 @@
+--- !ruby/object:Gem::Specification
+name: lazy_img_rails
+version: !ruby/object:Gem::Version
+  version: 0.0.1
+platform: ruby
+authors:
+- Stanislav Schultz
+autorequire: 
+bindir: bin
+cert_chain: []
+date: 2014-07-04 00:00:00.000000000 Z
+dependencies:
+- !ruby/object:Gem::Dependency
+  name: bundler
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '1.5'
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '1.5'
+- !ruby/object:Gem::Dependency
+  name: rake
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+- !ruby/object:Gem::Dependency
+  name: railties
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+description: Implementing LazyLoad ( https://github.com/vvo/lazyload/ ) for Ruby on
+  Rails
+email:
+- trrblspirit@gmail.com
+executables: []
+extensions: []
+extra_rdoc_files: []
+files:
+- README.md
+- lib/lazy_img_rails.rb
+- lib/lazy_img_rails/railtie.rb
+- lib/lazy_img_rails/version.rb
+- lib/lazy_img_rails/view_helpers.rb
+- vendor/assets/javascripts/lazyload.js
+homepage: http://github.com/trrbl/lazy_img_rails/
+licenses:
+- MIT
+metadata: {}
+post_install_message: 
+rdoc_options: []
+require_paths:
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+required_rubygems_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+requirements: []
+rubyforge_project: 
+rubygems_version: 2.2.2
+signing_key: 
+specification_version: 4
+summary: Implementing LazyLoad ( https://github.com/vvo/lazyload/ ) for Ruby on Rails
+test_files: []