Skip to content

Commit

Permalink
1.7.6
Browse files Browse the repository at this point in the history 
- fixed bug where items where not correctly filtered in _prepareItems
- added support for imageBase config to picture plugin
- updated jsdeliver links to github format
- updated dev dependencies
- some code style update in edited files
  • Loading branch information
@dkern
dkern committed Oct 24, 2017
1 parent b9a600d commit 11ebed9
Show file tree
Hide file tree
Showing 11 changed files with 182 additions and 82 deletions.
8 changes: 4 additions & 4 deletions README.md
View file
Expand Up @@ -65,12 +65,12 @@ Some examples below:
Lazy and all plugins are available over [cdnjs](http://cdnjs.com) and [jsDelivr](http://jsdelivr.com) CDN and can directly included to every page.
```HTML
<!-- jsDeliver -->
<script type="text/javascript" src="//cdn.jsdelivr.net/jquery.lazy/1.7.5/jquery.lazy.min.js"></script>
<script type="text/javascript" src="//cdn.jsdelivr.net/jquery.lazy/1.7.5/jquery.lazy.plugins.min.js"></script>
<script type="text/javascript" src="//cdn.jsdelivr.net/gh/eisbehr-/jquery.lazy@1.7.6/jquery.lazy.min.js"></script>
<script type="text/javascript" src="//cdn.jsdelivr.net/gh/eisbehr-/jquery.lazy@1.7.6/jquery.lazy.plugins.min.js"></script>

<!-- cdnjs -->
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery.lazy/1.7.5/jquery.lazy.min.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery.lazy/1.7.5/jquery.lazy.plugins.min.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery.lazy/1.7.6/jquery.lazy.min.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery.lazy/1.7.6/jquery.lazy.plugins.min.js"></script>
```

#### Self-Hosted
Expand Down
2 changes: 1 addition & 1 deletion bower.json
View file
@@ -1,7 +1,7 @@
{
"name": "jquery-lazy",
"description": "Lazy is a fast, feature-rich and lightweight delayed content loading plugin for jQuery and Zepto. It's designed to speed up page loading times and decrease traffic to your users by only loading the content in view. You can use Lazy in all vertical and horizontal scroll ways. It supports images in 'img' tags and backgrounds, supplied with css like 'background-image', by default. On those elements Lazy can set an default image or a placeholder while loading and supports retina displays as well. But Lazy is even able to load any other content you want by plugins and custom loaders.",
"version": "1.7.5",
"version": "1.7.6",
"main": "jquery.lazy.min.js",
"license": [
"MIT",
Expand Down
102 changes: 71 additions & 31 deletions jquery.lazy.js
View file
@@ -1,5 +1,5 @@
/*!
* jQuery & Zepto Lazy - v1.7.5
* jQuery & Zepto Lazy - v1.7.6
* http://jquery.eisbehr.de/lazy/
*
* Copyright 2012 - 2017, Daniel 'Eisbehr' Kern
Expand Down Expand Up @@ -61,7 +61,9 @@
}

// exit here if parameter is not a callable function
if( !$.isFunction(loader) ) return;
if( !$.isFunction(loader) ) {
return;
}

// make parameters an array of names to be sure
names = $.isArray(names) ? names : [names];
Expand All @@ -71,13 +73,16 @@
forced = config._f || (config._f = {});

// add the loader plugin for every name
for( var i = 0, l = names.length; i < l; i++ )
if( config[names[i]] === undefined || $.isFunction(config[names[i]]) )
for( var i = 0, l = names.length; i < l; i++ ) {
if( config[names[i]] === undefined || $.isFunction(config[names[i]]) ) {
config[names[i]] = loader;
}
}

// add forced elements loader
for( var c = 0, a = elements.length; c < a; c++ )
for( var c = 0, a = elements.length; c < a; c++ ) {
forced[elements[c]] = names[0];
}
};

/**
Expand Down Expand Up @@ -189,26 +194,31 @@
_isRetinaDisplay = window.devicePixelRatio > 1;

// prepare all initial items
_prepareItems(items);
items = _prepareItems(items);

// if delay time is set load all items at once after delay time
if( config.delay >= 0 ) setTimeout(function() { _lazyLoadItems(true); }, config.delay);
if( config.delay >= 0 ) {
setTimeout(function() {
_lazyLoadItems(true);
}, config.delay);
}

// if no delay is set or combine usage is active bind events
if( config.delay < 0 || config.combined ) {
// create unique event function
events.e = _throttle(config.throttle, function(event) {
// reset detected window size on resize event
if( event.type === "resize" )
if( event.type === "resize" ) {
_actualWidth = _actualHeight = -1;
}

// execute 'lazy magic'
_lazyLoadItems(event.all);
});

// create function to add new items to instance
events.a = function(additionalItems) {
_prepareItems(additionalItems);
additionalItems = _prepareItems(additionalItems);
items.push.apply(items, additionalItems);
};

Expand Down Expand Up @@ -250,7 +260,7 @@
* prepare items before handle them
* @access private
* @param {Array|object|jQuery} items
* @return void
* @return {Array|object|jQuery}
*/
function _prepareItems(items) {
// fetch used configurations before loops
Expand Down Expand Up @@ -279,21 +289,27 @@
elementImageBase = element.attr(config.imageBaseAttribute) || imageBase;

// generate and update source set if an image base is set
if( tag === _img && elementImageBase && element.attr(srcsetAttribute) )
if( tag === _img && elementImageBase && element.attr(srcsetAttribute) ) {
element.attr(srcsetAttribute, _getCorrectedSrcSet(element.attr(srcsetAttribute), elementImageBase));
}

// add loader to forced element types
if( forcedTags[tag] !== undefined && !element.attr(loaderAttribute) )
if( forcedTags[tag] !== undefined && !element.attr(loaderAttribute) ) {
element.attr(loaderAttribute, forcedTags[tag]);
}

// set default image on every element without source
if( tag === _img && defaultImage && !element.attr(_src) )
if( tag === _img && defaultImage && !element.attr(_src) ) {
element.attr(_src, defaultImage);
}

// set placeholder on every element without background image
else if( tag !== _img && placeholder && (!element.css(_backgroundImage) || element.css(_backgroundImage) === "none") )
else if( tag !== _img && placeholder && (!element.css(_backgroundImage) || element.css(_backgroundImage) === "none") ) {
element.css(_backgroundImage, "url('" + placeholder + "')");
}
}

return items;
}

/**
Expand All @@ -307,9 +323,10 @@
// skip if no items where left
if( !items.length ) {
// destroy instance if option is enabled
if( config.autoDestroy )
if( config.autoDestroy ) {
// noinspection JSUnresolvedFunction
instance.destroy();
}

return;
}
Expand Down Expand Up @@ -339,7 +356,7 @@
// and is image tag where attribute is not equal source or source set
(tag === _img && (elementImageBase + attribute !== element.attr(_src) || element.attr(srcsetAttribute) !== element.attr(_srcset))) ||
// or is non image tag where attribute is not equal background
(tag !== _img && elementImageBase + attribute !== element.css(_backgroundImage))
(tag !== _img && elementImageBase + attribute !== element.css(_backgroundImage))
) ||
// or custom loader is available
customLoader ))
Expand All @@ -355,10 +372,11 @@
}

// when something was loaded remove them from remaining items
if( loadTriggered )
if( loadTriggered ) {
items = $(items).filter(function() {
return !$(this).data(handledName);
});
}
}

/**
Expand Down Expand Up @@ -400,8 +418,9 @@
// on load callback
var loadCallback = function() {
// remove attribute from element
if( removeAttribute )
if( removeAttribute ) {
element.removeAttr(config.loaderAttribute);
}

// mark element as loaded
element.data(loadedName, true);
Expand Down Expand Up @@ -451,12 +470,14 @@

// set image back to element
// do it as single 'attr' calls, to be sure 'src' is set after 'srcset'
if( tag === _img )
if( tag === _img ) {
element.attr(_sizes, imageObj.attr(_sizes))
.attr(_srcset, imageObj.attr(_srcset))
.attr(_src, imageObj.attr(_src));
else
}
else {
element.css(_backgroundImage, "url('" + imageObj.attr(_src) + "')");
}

// bring it back with some effect!
element[config.effect](config.effectTime);
Expand All @@ -466,8 +487,9 @@
element.removeAttr(srcAttribute + " " + srcsetAttribute + " " + retinaAttribute + " " + config.imageBaseAttribute);

// only remove 'sizes' attribute, if it was a custom one
if( sizesAttribute !== _sizes )
if( sizesAttribute !== _sizes ) {
element.removeAttr(sizesAttribute);
}
}

// mark element as loaded
Expand Down Expand Up @@ -514,8 +536,12 @@
// check if element is even in loadable area from right
(-threshold < elementBound.right);

if( direction === "vertical" ) return vertical;
else if( direction === "horizontal" ) return horizontal;
if( direction === "vertical" ) {
return vertical;
}
else if( direction === "horizontal" ) {
return horizontal;
}

return vertical && horizontal;
}
Expand Down Expand Up @@ -561,8 +587,9 @@
var entries = srcset.split(",");
srcset = "";

for( var i = 0, l = entries.length; i < l; i++ )
for( var i = 0, l = entries.length; i < l; i++ ) {
srcset += imageBase + entries[i].trim() + (i !== l - 1 ? "," : "");
}
}

return srcset;
Expand All @@ -584,13 +611,18 @@

function run() {
lastExecute = +new Date();
// noinspection JSUnresolvedFunction
callback.call(instance, event);
}

timeout && clearTimeout(timeout); // jshint ignore : line

if( elapsed > delay || !config.enableThrottle || ignoreThrottle ) run();
else timeout = setTimeout(run, delay - elapsed);
if( elapsed > delay || !config.enableThrottle || ignoreThrottle ) {
run();
}
else {
timeout = setTimeout(run, delay - elapsed);
}
};
}

Expand All @@ -603,7 +635,9 @@
--_awaitingAfterLoad;

// if no items were left trigger finished event
if( !items.length && !_awaitingAfterLoad ) _triggerCallback("onFinishedAll");
if( !items.length && !_awaitingAfterLoad ) {
_triggerCallback("onFinishedAll");
}
}

/**
Expand All @@ -626,12 +660,15 @@
}

// if event driven or window is already loaded don't wait for page loading
if( config.bind === "event" || windowLoaded )
if( config.bind === "event" || windowLoaded ) {
_initialize();
}

// otherwise load initial items and start lazy after page load
else // noinspection JSUnresolvedVariable
else {
// noinspection JSUnresolvedVariable
$(window).on(_load + "." + namespace, _initialize);
}
}

/**
Expand Down Expand Up @@ -683,8 +720,9 @@
* @return {LazyPlugin|*}
*/
_instance.config = function(entryName, value) {
if( value === undefined )
if( value === undefined ) {
return _config[entryName];
}

_config[entryName] = value;
return _instance;
Expand Down Expand Up @@ -826,5 +864,7 @@

// register window load event globally to prevent not loading elements
// since jQuery 3.X ready state is fully async and may be executed after 'load'
$(window).on("load", function() { windowLoaded = true; });
$(window).on("load", function() {
windowLoaded = true;
});
})(window);

0 comments on commit 11ebed9

Please sign in to comment.