Skip to content

Commit 1ef31f6

Browse files
fiegfieg
committed
Preparation for 3.1.0 release
* Added upwards scroll documentation * Updated changelog and upgrade docs * Other documentation fixes * Bumped versions
1 parent ce84547 commit 1ef31f6

File tree

10 files changed

+101
-13
lines changed

10 files changed

+101
-13
lines changed

‎CHANGELOG.md‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,11 @@ All notable changes to this project will be documented in this file.
66
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
77
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
88

9+
## [3.1.0]
10+
11+
* Adds all features from 3.1.0-beta.1
12+
* Added [`upwards`](docs/advanced/upwards.md) documentation
13+
914
## [3.1.0-beta.1]
1015

1116
This version introduces upwards scroll support (fixes [#466](https://github.com/webcreate/infinite-ajax-scroll/issues/466)). See documentation on the [`prev`](docs/options.md#prev) option on how to enable this feature.
@@ -123,7 +128,8 @@ See [LICENSE](LICENSE) for more details.
123128
* Extensible through events
124129
* Added an extensive test suite
125130

126-
[3.1.0-beta.1]: https://github.com/webcreate/infinite-ajax-scroll/compare/3.0.0...3.1.0-beta.1
131+
[3.1.0]: https://github.com/webcreate/infinite-ajax-scroll/compare/3.0.1...3.1.0
132+
[3.1.0-beta.1]: https://github.com/webcreate/infinite-ajax-scroll/compare/3.0.1...3.1.0-beta.1
127133
[3.0.1]: https://github.com/webcreate/infinite-ajax-scroll/compare/3.0.0...3.0.1
128134
[3.0.0]: https://github.com/webcreate/infinite-ajax-scroll/compare/3.0.0-rc.1...3.0.0
129135
[3.0.0-rc.1]: https://github.com/webcreate/infinite-ajax-scroll/compare/v2.3.1...3.0.0-rc.1

‎README.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,7 @@ Infinite Ajax Scroll works on a container with item elements which get appended.
5050

5151
<div class="pagination">
5252
<a href="page1.html" class="prev">Prev</a>
53-
<span class="current">1</span>
53+
<span class="current">2</span>
5454
<a href="page3.html" class="next">Next</a>
5555
</div>
5656
```

‎UPGRADE.md‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,8 @@
1+
Upgrade from 3.0.x to 3.1.0
2+
===========================
3+
4+
Version 3.1.0 is backwards-compatible with 3.0.x.
5+
16
Upgrade from 2.3.x to 3.0
27
=========================
38

‎docs/README.md‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,3 +18,4 @@
1818
* [Last page message](advanced/last-page-message.md)
1919
* [History](advanced/history.md)
2020
* [Overflow](advanced/overflow.md)
21+
* [Upward scroll](advanced/upwards.md)

‎docs/advanced/history.md‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@ ias.on('page', (event) => {
2323

2424
## Loading previous pages
2525

26-
{% hint style='working' %}
27-
This feature is still work in progress
28-
{% endhint %}
26+
Infinite Ajax Scroll can also be used to load items above the current scroll position. This is useful when you want to load older items first.
27+
28+
[View upwards infinite scroll documentation](upwards.md)
29+

‎docs/advanced/upwards.md‎

Lines changed: 61 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
# Upward Infinite Scroll
2+
3+
Infinite Ajax Scroll can also be used to load items above the current scroll position. This is useful when you want to load older items first.
4+
5+
*Introduced in Infinite Ajax Scroll 3.1.0*
6+
7+
## Caveats
8+
9+
### Fixed height images
10+
11+
Upward scroll works by calculation screen height and content height. Due to they way browser load content, especially images, this could cause incorrect measurements. This can be solved by using fixed height images.
12+
13+
## Setup
14+
15+
1. Add a previous page link to your pagination.
16+
17+
```html
18+
<div class="pagination">
19+
<a href="page1.html" class="prev">Prev</a>
20+
<span class="current">2</span>
21+
<a href="page3.html" class="next">Next</a>
22+
</div>
23+
```
24+
25+
2. Configure the [`prev`](../options.md#prev) option.
26+
27+
```javascript
28+
// import if you use the NPM package
29+
import InfiniteAjaxScroll from '@webcreate/infinite-ajax-scroll';
30+
31+
let ias = new InfiniteAjaxScroll('.container', {
32+
item: '.item',
33+
next: '.next',
34+
prev: '.prev',
35+
pagination: '.pagination'
36+
});
37+
```
38+
39+
## Hook into upward scroll with events
40+
41+
In this example we notify the user about loading the previous page.
42+
43+
```js
44+
ias.on('prev', function(event) {
45+
// pageIndex is 0-indexed, so we add 1
46+
alert(`Page ${event.pageIndex+1} is loading...`);
47+
});
48+
ias.on('preved', function(event) {
49+
alert(`Page ${event.pageIndex+1} is loaded and prepended to the page.`);
50+
});
51+
```
52+
53+
## Inform user about first page reached
54+
55+
In this example we notify the user when the first page is reached.
56+
57+
```javascript
58+
ias.on('first', () => {
59+
console.log('User has reached the first page');
60+
})
61+
```

‎docs/events.md‎

Lines changed: 18 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -65,6 +65,8 @@ Triggered when the user has hit the scroll threshold for the next page due to sc
6565

6666
### top
6767

68+
*Introduced in Infinite Ajax Scroll 3.1.0*
69+
6870
Triggered when the user has hit the top of the scroll area for the previous page due to scrolling or resizing.
6971

7072
| property | type | description |
@@ -103,15 +105,17 @@ Trigger when loading and appending the next page is completed.
103105

104106
### prev
105107

108+
*Introduced in Infinite Ajax Scroll 3.1.0*
109+
106110
Triggered right after the `top` event. Indicating that the previous page will be loaded.
107111

108-
| property | type | description |
109-
| :--- | :--- | :--- |
110-
| pageIndex | int | The page index of the next page (the page that is about to be loaded) |
112+
| property | type | description |
113+
| :--- | :--- |:----------------------------------------------------------------------|
114+
| pageIndex | int | The page index of the prev page (the page that is about to be loaded) |
111115

112116
> pageIndex is zero indexed. This means the index starts at 0 on the first page.
113117
114-
For example to notify the user about loading the next page, you can do:
118+
For example to notify the user about loading the previous page, you can do:
115119

116120
```js
117121
ias.on('prev', function(event) {
@@ -125,6 +129,8 @@ ias.on('preved', function(event) {
125129

126130
### preved
127131

132+
*Introduced in Infinite Ajax Scroll 3.1.0*
133+
128134
Trigger when loading and prepending the previous page is completed.
129135

130136
| property | type | description |
@@ -198,18 +204,22 @@ This event is triggered after the items have been appended.
198204

199205
### prepend
200206

207+
*Introduced in Infinite Ajax Scroll 3.1.0*
208+
201209
This event is triggered before the items are about to be prepended.
202210

203211
| property | type | description |
204212
| :--- | :--- |:-------------------------------------------------|
205213
| items | array | Array of items that will be prepended |
206214
| parent | Element | The element to which the items will be prepended |
207-
| prependFn | function | Function used to append items to the container |
215+
| prependFn | function | Function used to prepend items to the container |
208216

209-
See [src/append.js](../src/append.js) for the default append function.
217+
See [src/prepend.js](../src/prepend.js) for the default prepend function.
210218

211219
### prepended
212220

221+
*Introduced in Infinite Ajax Scroll 3.1.0*
222+
213223
This event is triggered after the items have been prepended.
214224

215225
| property | type | description |
@@ -231,6 +241,8 @@ ias.on('last', () => {
231241

232242
### first
233243

244+
*Introduced in Infinite Ajax Scroll 3.1.0*
245+
234246
Triggered when the last page is appended.
235247

236248
```javascript

‎docs/options.md‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,8 @@ let ias = new InfiniteAjaxScroll(/*..*/, {
4646

4747
## prev
4848

49+
*Introduced in Infinite Ajax Scroll 3.1.0*
50+
4951
**Type:** `string`<br>
5052
**Default:** `undefined`<br>
5153
**Required:** no

‎examples/articles/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@
2929
"jquery-ias"
3030
],
3131
"dependencies": {
32-
"@webcreate/infinite-ajax-scroll": "^3.1.0-beta.1"
32+
"@webcreate/infinite-ajax-scroll": "^3.1.0"
3333
},
3434
"devDependencies": {
3535
"parcel": "^2.0.0"

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@webcreate/infinite-ajax-scroll",
3-
"version": "3.1.0-beta.1",
3+
"version": "3.1.0",
44
"title": "Infinite Ajax Scroll",
55
"description": "Turn your existing pagination into infinite scrolling pages with ease",
66
"license": "AGPL-3.0-only",

0 commit comments

Comments
 (0)