Skip to content

Commit

Permalink
Merge branch 'release/11.0.6'
Browse files Browse the repository at this point in the history
  • Loading branch information
@verlok
verlok committed Mar 23, 2019
2 parents b5dc48b + 2d6976d commit 1a69fdb
Show file tree
Hide file tree
Showing 15 changed files with 40 additions and 24 deletions.
6 changes: 5 additions & 1 deletion CHANGELOG.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,10 @@

## Version 11

#### 11.0.6

Restored the `callback_set` callback as **deprecated**, in order to make the upgrade from v.10 easier.

#### 11.0.5

Fixed the `module` property of this package.json, which was pointing to a non-existing dist file.
Expand Down Expand Up @@ -31,7 +35,7 @@ Squashed a nasty bug that occurred on IE 11 and Safari when the `IntersectionObs
- Callback `callback_enter` has **changed** its meaning! It is now called whenever an element enters the viewport, even if `load_delay` is set
- Callback `callback_exit` (**new**) is called whenever an element exits the viewport, even if `load_delay` is set
- Callback `callback_reveal` (**new**) is called when an element is about to be revealed, and its attribute values were copied from the `data-` attributes to the actual ones.
- Callback `callback_set` was **removed**. You can use `callback_reveal` instead.
- Callback `callback_set` is now **deprecated**. Use `callback_reveal` instead.
- Private methods like `_setObserver`, `_onIntersection` etc. are now hidden and protected.
- Added the `auto_unobserve` boolean option.
- Bugfix: `loadAll()` didn't unobserve elements.
Expand Down
13 changes: 7 additions & 6 deletions README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -105,7 +105,7 @@ Notes:

## 👩‍💻 Getting started - Script

The latest, recommended version of LazyLoad is **11.0.5**, which leverages the power and speed of the browser's **IntersectionObserver** API.
The latest, recommended version of LazyLoad is **11.0.6**, which leverages the power and speed of the browser's **IntersectionObserver** API.

### To polyfill or not to polyfill IntersectionObserver?

Expand All @@ -120,14 +120,14 @@ If you prefer to load a polyfill, the regular LazyLoad behaviour is granted.
The easiest way to use LazyLoad is to include the script from a CDN:

```html
<script src="https://cdn.jsdelivr.net/npm/vanilla-lazyload@11.0.5/dist/lazyload.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vanilla-lazyload@11.0.6/dist/lazyload.min.js"></script>
```

Or, with the IntersectionObserver polyfill:

```html
<script src="https://cdn.jsdelivr.net/npm/intersection-observer@0.5.1/intersection-observer.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vanilla-lazyload@11.0.5/dist/lazyload.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vanilla-lazyload@11.0.6/dist/lazyload.min.js"></script>
```

Then, in your javascript code:
Expand Down Expand Up @@ -162,7 +162,7 @@ Include RequireJS:
Then `require` the AMD version of LazyLoad, like this:

```js
var lazyLoadAmdUrl = "https://cdn.jsdelivr.net/npm/vanilla-lazyload@11.0.5/dist/lazyload.amd.min.js";
var lazyLoadAmdUrl = "https://cdn.jsdelivr.net/npm/vanilla-lazyload@11.0.6/dist/lazyload.amd.min.js";
var polyfillAmdUrl = "https://cdn.jsdelivr.net/npm/intersection-observer-amd@1.0.0/intersection-observer-amd.js";

/// Dynamically define the dependencies
Expand Down Expand Up @@ -207,7 +207,7 @@ To do so, **you must define the options before including the script**. You can p
Then include the script.
```html
<script async src="https://cdn.jsdelivr.net/npm/vanilla-lazyload@11.0.5/dist/lazyload.min.js"></script>
<script async src="https://cdn.jsdelivr.net/npm/vanilla-lazyload@11.0.6/dist/lazyload.min.js"></script>
```
**Possibly place the script tag right before the closing `</body>` tag**. If you can't do that, LazyLoad could be executed before the browser has loaded all the DOM, and you'll need to call its `update()` method to make it check the DOM again.
Expand All @@ -233,7 +233,7 @@ Same as above, but you must put the `addEventListener` code shown below before i
Then include the script.
```html
<script async src="https://cdn.jsdelivr.net/npm/vanilla-lazyload@11.0.5/dist/lazyload.min.js"></script>
<script async src="https://cdn.jsdelivr.net/npm/vanilla-lazyload@11.0.6/dist/lazyload.min.js"></script>
```
Now you'll be able to call its methods, like:
Expand Down Expand Up @@ -642,6 +642,7 @@ Here's the list of the options.
| `callback_enter` | A callback function which is called when an element enters the viewport. | `null` | `(el)=>{console.log("Entered", el)}` |
| `callback_exit` | A callback function which is called when an element exits the viewport. | `null` | `(el)=>{console.log("Exited", el)}` |
| `callback_reveal` | A callback function which is called when an element is activated (usually when it starts loading). | `null` | `(el)=>{console.log("Loading", el)}` |
| `callback_set` | **Deprecated from v.11** &rarr; Use `callback_reveal` instead. | `null` | `(el)=>{console.log("Loading", el)}` |
| `callback_loaded` | A callback function which is called when an element was loaded. | `null` | `(el)=>{console.log("Loaded", el)}` |
| `callback_error` | A callback function which is called when an element triggered an error. | `null` | `(el)=>{console.log("Error", el)}` |
| `callback_finish` | A callback function which is called when there are no more elements to load and all elements have been downloaded. | `null` | `()=>{console.log("Finish")}` |
Expand Down
7 changes: 5 additions & 2 deletions dist/lazyload.amd.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -367,6 +367,7 @@ define(function () {
setSources(element, instance);
setWasProcessedData(element);
callbackIfSet(settings.callback_reveal, element);
callbackIfSet(settings.callback_set, element);
};

var isIntersecting = function isIntersecting(entry) {
Expand Down Expand Up @@ -405,8 +406,10 @@ define(function () {
var _this = this;

var settings = this._settings;
var nodeSet = elements || settings.container.querySelectorAll(settings.elements_selector);
this._elements = purgeProcessedElements(Array.prototype.slice.call(nodeSet) // NOTE: nodeset to array for IE compatibility

var _elements = elements || settings.container.querySelectorAll(settings.elements_selector);

this._elements = purgeProcessedElements(Array.prototype.slice.call(_elements) // NOTE: nodeset to array for IE compatibility
);

if (isBot || !this._observer) {
Expand Down
2 changes: 1 addition & 1 deletion dist/lazyload.amd.min.js
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion dist/lazyload.amd.min.js.map
View file

Large diffs are not rendered by default.

5 changes: 3 additions & 2 deletions dist/lazyload.esm.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -346,6 +346,7 @@ const revealElement = (element, instance, force) => {
setSources(element, instance);
setWasProcessedData(element);
callbackIfSet(settings.callback_reveal, element);
callbackIfSet(settings.callback_set, element);
};

const isIntersecting = entry =>
Expand Down Expand Up @@ -380,12 +381,12 @@ const LazyLoad = function(customSettings, elements) {
LazyLoad.prototype = {
update: function(elements) {
const settings = this._settings;
const nodeSet =
const _elements =
elements ||
settings.container.querySelectorAll(settings.elements_selector);

this._elements = purgeProcessedElements(
Array.prototype.slice.call(nodeSet) // NOTE: nodeset to array for IE compatibility
Array.prototype.slice.call(_elements) // NOTE: nodeset to array for IE compatibility
);

if (isBot || !this._observer) {
Expand Down
7 changes: 5 additions & 2 deletions dist/lazyload.iife.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -367,6 +367,7 @@ var LazyLoad = function () {
setSources(element, instance);
setWasProcessedData(element);
callbackIfSet(settings.callback_reveal, element);
callbackIfSet(settings.callback_set, element);
};

var isIntersecting = function isIntersecting(entry) {
Expand Down Expand Up @@ -405,8 +406,10 @@ var LazyLoad = function () {
var _this = this;

var settings = this._settings;
var nodeSet = elements || settings.container.querySelectorAll(settings.elements_selector);
this._elements = purgeProcessedElements(Array.prototype.slice.call(nodeSet) // NOTE: nodeset to array for IE compatibility

var _elements = elements || settings.container.querySelectorAll(settings.elements_selector);

this._elements = purgeProcessedElements(Array.prototype.slice.call(_elements) // NOTE: nodeset to array for IE compatibility
);

if (isBot || !this._observer) {
Expand Down
Loading

0 comments on commit 1a69fdb

Please sign in to comment.