# js-pull-to-refresh

> A small 'Pull To Refresh' plugin, written by native javascript

Latest version **1.0.14** (published 2019-11-27) · ISC license · 0 weekly downloads

## Install

```sh
npm install js-pull-to-refresh
pnpm add js-pull-to-refresh
yarn add js-pull-to-refresh
bun add js-pull-to-refresh
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.14 |
| Published | 2019-11-27 |
| First published | 2019-07-01 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 50.4 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Scott Tian |
| Maintainers | scotttian |

## Links

- npm: https://www.npmjs.com/package/js-pull-to-refresh
- Repository: https://github.com/mrscotttian/js-pull-to-refresh
- Homepage: https://github.com/mrscotttian/js-pull-to-refresh#readme
- Issues: https://github.com/mrscotttian/js-pull-to-refresh/issues
- npm.io page: https://npm.io/package/js-pull-to-refresh

## Recent versions

- 1.0.14 (latest) — 2019-11-27
- 1.0.13 — 2019-11-27
- 1.0.12 — 2019-11-27
- 1.0.11 — 2019-11-27
- 1.0.10 — 2019-11-27
- 1.0.9 — 2019-11-27
- 1.0.8 — 2019-11-25
- 1.0.7 — 2019-07-10
- 1.0.6 — 2019-07-09
- 1.0.5 — 2019-07-09
- 1.0.4 — 2019-07-09
- 1.0.3 — 2019-07-09
- 1.0.2 — 2019-07-04
- 1.0.1 — 2019-07-01
- 1.0.0 — 2019-07-01

## README

# js-pull-to-refresh

A small 'Pull To Refresh' plugin, written by native javascript

## Install

Download by npm

```bash
npm install --save js-pull-to-refresh
```

## How To Use

Directly, import it by the `<script>` tag.

```html
<script src='js-pull-to-refresh/dist/index.umd.js'></script>
<script>
    PullToRefresh.init(yourOptions);
</script>
```

OR

Use your bundler, such as `Webpack`, to import it with `ES6`, `AMD` or `CMD` syntax.

```javascript
import {init as initPullToRefresh} from "js-pull-to-refresh"
// const {init : initPullToRefresh} = require('js-pull-to-refresh');

const { destroy } = initPullToRefresh(yourOptions);
```

## API

* `init(options)` Currentlly, this is the only public method used to initiate the PullToRefresh instance. It receives a plain object which can help to config the plugin ( See [Options](#Options) ), and returns a plain object which can be used to control the the initiated plugin ( See [Returns](#Returns) ).

## Options

| Name                | Type                           | Default                                                                                                       | Detail                                                                                                                                           |
| ------------------- | ------------------------------ | ------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------ |
| mainElement         | String or Element              | 'body'                                                                                                        | Class name string, like '.example'. Or an Element pointer which is already in the document.                                                      |
| triggerElement      | String or Element              | 'body'                                                                                                        | Class name string, like '.example'. Or an Element pointer which is already in the document.                                                      |
| ptrContent          | String or Element              | See [src/default-ptr.js](https://github.com/mrscotttian/js-pull-to-refresh/blob/master/src/defult-ptr.js#L15) | String which content is HTML. Or Element pointer  to customized content. the value will be give by the 'onChange' like hook method as parameter. |
| pullThreshold       | Number                         | 100                                                                                                           | Minimum distance which user pulled required to trigger refreshing.                                                                               |
| pullLimit           | Number                         | 200                                                                                                           | Maximum distance when the map ratio down to the 'resistMinRatio'. And it must be larger than 'pullThreshold'.                                    |
| refreshHeight       | Number                         | 70                                                                                                            | The height when user let go, it will change to.                                                                                                  |
| resistMaxRatio      | Number                         | 0.7                                                                                                           | The ratio when the distance user pulled is between  0 and 'pullThreshold'.(Must be between 'resistMinRatio' and 1)                               |
| resistMinRatio      | Number                         | 0.1                                                                                                           | The ratio when the distance user pulled is larger than 'pullLimit'.(Must be between 0 and 'resistMaxRatio')                                      |
| onChangeToInit      | (ptrContentElement) => void    | See [src/default-ptr.js](https://github.com/mrscotttian/js-pull-to-refresh/blob/master/src/defult-ptr.js#L21) | The hook will be called when the state change to 'init'.                                                                                         |
| onChangeToPulling   | (ptrContentElement) => void    | See [src/default-ptr.js](https://github.com/mrscotttian/js-pull-to-refresh/blob/master/src/defult-ptr.js#L25) | The hook will be called when the state change to 'pulling' .                                                                                     |
| onChangeToResisting | (ptrContentElement) => void    | See [src/default-ptr.js](https://github.com/mrscotttian/js-pull-to-refresh/blob/master/src/defult-ptr.js#L29) | The hook will be called when the state change to 'resisting'.                                                                                    |
| onChangeToRefresh   | (ptrContentElement) => Promise | See [src/default-ptr.js](https://github.com/mrscotttian/js-pull-to-refresh/blob/master/src/defult-ptr.js#L33) | The hook will be called when the state change to 'refresh'. Support async with promise                                                           |
| onPulling           | (userPullDist) => void         | See [src/default-ptr.js](https://github.com/mrscotttian/js-pull-to-refresh/blob/master/src/defult-ptr.js#L50) | The hook will be called when user is pulling. Recommend use it to make the 'ptrContent' animating. But do not do heavy work in the method.       |

## Returns
| Name           | Function Signature | Detail                                                        |
| -------------- | ------------------ | ------------------------------------------------------------- |
| destroy        | ()=>void           | Remove all related thing including element and event listener |
| disable        | ()=>void           | Forbid to trigger the plugin                                  |
| forceToRefresh | ()=>void           | Force to refresh with code                                    |

---
_Source: https://npm.io/package/js-pull-to-refresh · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._