Socket
Socket
Sign inDemoInstall

sweet-scroll

Package Overview
Dependencies
Maintainers
1
Versions
37
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

sweet-scroll - npm Package Compare versions

Comparing version 2.2.1 to 3.0.0

decls/__tests__/coordinate.browser.spec.d.ts
decls/__tests__/fixture.d.ts
decls/__tests__/index.browser.spec.d.ts
decls/__tests__/index.node.spec.d.ts
decls/animation/easings.d.ts
decls/animation/requestAnimationFrame.d.ts
decls/coordinate.d.ts
decls/dom/dimensions.d.ts
decls/dom/events.d.ts
decls/dom/offsets.d.ts
decls/dom/selectors.d.ts
decls/index.d.ts
decls/options.d.ts
decls/utils/__tests__/supports.browser.spec.d.ts
decls/utils/__tests__/supports.node.spec.d.ts
decls/utils/lang.d.ts
decls/utils/supports.d.ts
sweet-scroll.d.ts

55

CHANGELOG.md

@@ -0,1 +1,56 @@

## 3.0.0
TypeScript support and file size down are the main changes. `3.x` is a version that contains many destructive changes.
### New features
* Support TypeScript :tada:
* Reduce file size by 43.04% !
- We reviewed many options and functions and cut unnecessary items.
* Add factory method (`SweetScroll.create(options?: PartialOptions, container?: string | Element)`)
- This is useful if you do not like the coding style using `new` or you do not need to manage instances.
### Breaking changes
* IE9 was excluded from browser support
- It can correspond by using polyfill of `requestAnimationFrame`.
* Remove options
- `delay`
- `outputLog`
* Rename options
- `verticalScroll` -> `vertical`
- `horizontalScroll` -> `horizontal`
- `stopScroll` -> `cancellable`
- `beforeScroll` -> `before`
- `afterScroll` -> `after`
- `canelScroll` -> `canel`
- `completeScroll` -> `complete`
- `stepScroll` -> `step`
* Remove easings (You can use the same easing by passing the function described in README instead.)
- `easeInElastic`
- `easeOutElastic`
- `easeInOutElastic`
- `easeInBack`
- `easeOutBack`
- `easeInOutBack`
- `easeInBounce`
- `easeOutBounce`
- `easeInOutBounce`
* Remove `distance` argument pattern
- Object like string (`top:0, left:100`)
* Rename callback methods
- `beforeScroll` -> `onBefore`
- `afterScroll` -> `onAfter`
- `cancelScroll` -> `onCancel`
- `completeScroll` -> `onComplete`
- `stepScroll` -> `onStep`
### Minor changes
* Fixed headers can now be specified from elements. (`header`)
* Add an instance to the final argument to the optional callback.
- It corresponds to a problem that can not refer to `this` when using arrow function.
## 2.2.0

@@ -2,0 +57,0 @@

105

package.json
{
"name": "sweet-scroll",
"version": "2.2.1",
"version": "3.0.0",
"description": "Modern and the sweet smooth scroll library.",
"main": "sweet-scroll.js",
"types": "sweet-scroll.d.ts",
"scripts": {
"start": "npm-run-all --parallel watch docs",
"test": "npm-run-all lint karma",
"build": "npm-run-all build:* docs:build",
"build:js": "NODE_ENV=production rollup -c rollup.config.js && uglifyjs --compress --mangle -o sweet-scroll.min.js --comments -- sweet-scroll.js",
"watch": "npm-run-all --parallel watch:*",
"watch:js": "onchange 'src/**/*.js' -- npm run build:js",
"watch:test": "onchange 'test/**/*.js' -- npm run karma",
"lint": "eslint src/**/*.js test/**/*.js .eslintrc.js --no-ignore",
"karma": "NODE_ENV=test karma start karma.conf.js --single-run",
"docs": "npm-run-all --parallel docs:watch:*",
"docs:build": "npm run docs:build:js && npm run docs:build:sass",
"docs:build:js": "copyfiles sweet-scroll.js docs/js/",
"docs:build:sass": "node-sass docs/sass/ -o docs/css/ --output-style compressed && postcss docs/css/*.css --use autoprefixer -d docs/css/",
"docs:watch:server": "browser-sync start -s 'docs/' -f 'docs/**/*,!docs/sass/**/*' --no-notify --no-open --no-ghost-mode",
"docs:watch:js": "onchange 'sweet-scroll.js' -- npm run docs:build:js",
"docs:watch:sass": "onchange 'docs/sass/**/*.scss' -- npm run docs:build:sass"
"start": "npm run build:watch & npm run docs",
"build": "npm run build:bundle && npm run build:minify && npm run build:decls",
"build:bundle": "rollup -c",
"build:minify": "uglifyjs -c -m --comments -o sweet-scroll.min.js -- sweet-scroll.js",
"build:decls": "dts-bundle --baseDir ./ --name sweet-scroll --main decls/index.d.ts",
"build:watch": "npm run build:bundle -- --watch",
"prebuild": "npm run clean",
"clean": "rm -rf decls .rpt2_cache",
"test": "npm run test:lint && npm run test:unit",
"test:unit": "npm run test:browser && npm run test:node",
"test:browser": "jest --setupTestFrameworkScriptFile=./jest/setup-for-browser.js --testPathPattern \"browser.spec.ts\"",
"test:browser:watch": "npm run test:browser -- --watch",
"test:node": "jest --env=node \"**/__tests__/*.node.spec.ts\" --testPathPattern \"node.spec.ts\"",
"test:node:watch": "npm run test:node -- --watch",
"test:lint": "tslint -c tslint.json \"src/**/*.ts\"",
"docs": "npm run docs:server & npm run docs:watch",
"docs:server": "browser-sync start -s docs -f \"docs/**/*\" --no-notify --no-ghost-mode --no-open",
"docs:build": "cpx sweet-scroll.js docs",
"docs:watch": "npm run docs:build -- --watch",
"docs:deploy": "gh-pages -t -d docs",
"predocs:deploy": "npm run docs:build",
"prepublishOnly": "npm run build"
},
"files": [
"src",
"test",
"decls",
"sweet-scroll.js",
"sweet-scroll.min.js"
"sweet-scroll.min.js",
"sweet-scroll.d.ts"
],
"keywords": [
"smooth scroll",
"sweet scroll",
"sweet",
"scroll",

@@ -46,34 +55,28 @@ "animation"

"devDependencies": {
"autoprefixer": "^7.0.1",
"babel-eslint": "^7.2.3",
"babel-plugin-espower": "^2.3.2",
"babel-plugin-external-helpers": "^6.22.0",
"babel-preset-es2015": "^6.24.1",
"babel-preset-stage-0": "^6.24.1",
"babelify": "^7.3.0",
"browser-sync": "^2.18.8",
"browserify": "^14.3.0",
"copyfiles": "^1.2.0",
"eslint": "^3.19.0",
"karma": "^1.7.0",
"karma-browserify": "^5.1.1",
"karma-cli": "^1.0.1",
"karma-fixture": "^0.2.6",
"karma-html2js-preprocessor": "^1.1.0",
"karma-mocha": "^1.3.0",
"karma-phantomjs-launcher": "^1.0.4",
"karma-phantomjs-shim": "^1.4.0",
"mocha": "^3.3.0",
"node-sass": "^4.5.2",
"npm-run-all": "^4.0.2",
"onchange": "^3.2.1",
"phantomjs-prebuilt": "^2.1.14",
"postcss-cli": "^4.0.0",
"power-assert": "^1.4.2",
"rollup": "^0.41.6",
"rollup-plugin-babel": "^2.7.1",
"sinon": "^2.2.0",
"uglify-js": "^3.0.4",
"watchify": "^3.9.0"
"@types/jest": "^21.1.8",
"browser-sync": "^2.18.13",
"cpx": "^1.5.0",
"dts-bundle": "^0.7.3",
"gh-pages": "^1.1.0",
"jest": "^21.2.1",
"rollup": "^0.52.1",
"rollup-plugin-typescript2": "^0.8.2",
"rollup-watch": "^4.3.1",
"tslint": "^5.8.0",
"typescript": "^2.6.1",
"uglify-es": "^3.2.0"
},
"jest": {
"moduleFileExtensions": [
"ts",
"tsx",
"js"
],
"transform": {
"^.+\\.(ts|tsx)$": "<rootDir>/preprocessor.js"
},
"testMatch": [
"**/__tests__/*.spec.ts?(x)"
]
}
}

621

README.md

@@ -1,2 +0,2 @@

# <img src="https://raw.githubusercontent.com/tsuyoshiwada/sweet-scroll/images/logo.png" width="340" height="135" alt="sweet-scroll.js">
![sweet-scroll](https://raw.githubusercontent.com/tsuyoshiwada/sweet-scroll/artwork/repo-banner.png)

@@ -8,13 +8,14 @@ [![Build Status](http://img.shields.io/travis/tsuyoshiwada/sweet-scroll.svg?style=flat-square)](https://travis-ci.org/tsuyoshiwada/sweet-scroll)

ECMAScript2015 Friendly, dependency-free smooth scroll library.
> ECMAScript2015+ & TypeScript Friendly, dependency-free smooth scroll library.
[See Demo](http://tsuyoshiwada.github.io/sweet-scroll/)
:lollipop: [See Demo](http://tsuyoshiwada.github.io/sweet-scroll/)
## FEATURES
## Features
* Dependecy-free!!
* ECMAScript2015 friendly
* Use `requestAnimationFrame` API (IE9 works in `setTimeout` instead)
* ECMAScript2015+ & TypeScript friendly
* Use `requestAnimationFrame` API
* Supports vertical and horizontal scroll

@@ -28,4 +29,43 @@ * Supports dynamic trigger (event delegation)

## USAGE
## Table of Contents
* [Usage](#usage)
- [1. Install](#1-install)
- [2. Setup of HTML](#2-setup-of-html)
- [3. Initialize SweetScroll](#3-initialize-sweetscroll)
* [Options](#options)
* [Easings](#easings)
- [Built-in (22)](#built-in-22)
- [Advanced (9)](#advanced-9)
* [Customizing Tips](#customizing-tips)
- [Specifying container elements](#specifying-container-elements)
- [Specify fixed header](#specify-fixed-header)
- [Override of options for each element](#override-of-options-for-each-element)
- [if you want to use in non anchor element](#if-you-want-to-use-in-non-anchor-element)
- [Do you feel scrolling is slow?](#do-you-feel-scrolling-is-slow)
- [Scrolling animation in another page](#scrolling-animation-in-another-page)
* [API](#api)
- [new SweetScroll(options?: PartialOptions, container?: string | Element)](#new-sweetscrolloptions-partialoptions-container-string--element)
- [SweetScroll.create(options?: PartialOptions, container?: string | Element)](#sweetscrollcreateoptions-partialoptions-container-string--element)
- [to(distance: any, options?: PartialOptions)](#todistance-any-options-partialoptions)
- [toTop(distance: any, options?: PartialOptions)](#totopdistance-any-options-partialoptions)
- [toLeft(distance: any, options?: PartialOptions)](#toleftdistance-any-options-partialoptions)
- [toElement($el: Element, options?: PartialOptions)](#toelementel-element-options-partialoptions)
- [update(options: PartialOptions)](#updateoptions-partialoptions)
- [stop(gotoEnd: boolean = true)](#stopgotoend-boolean--true)
- [destroy()](#destroy)
- [Callbacks](#callbacks)
* [Browser Support](#browser-support)
- [Scrolling with IE9](#scrolling-with-ie9)
* [CHANGELOG](#changelog)
* [Contibute](#contibute)
- [Development](#development)
* [License](#license)
## Usage
### 1. Install

@@ -41,11 +81,10 @@

```javascript
import SweetScroll from "sweet-scroll"
```typescript
import SweetScroll from 'sweet-scroll';
```
#### via MANUAL
1. Download the [sweet-scroll.min.js](https://raw.githubusercontent.com/tsuyoshiwada/sweet-scroll/master/sweet-scroll.min.js)
2. Load it in the script tag.
1. Load it in the script tag.

@@ -56,3 +95,2 @@ ```html

#### via CDN (UNPKG)

@@ -65,3 +103,2 @@

### 2. Setup of HTML

@@ -76,3 +113,2 @@

### 3. Initialize SweetScroll

@@ -82,5 +118,5 @@

```javascript
document.addEventListener("DOMContentLoaded", () => {
const sweetScroll = new SweetScroll({/* some options */});
```typescript
document.addEventListener('DOMContentLoaded', () => {
const scroller = new SweetScroll({/* some options */});
}, false);

@@ -91,29 +127,28 @@ ```

## OPTIONS
## Options
The following options are applied by default. It can be customized as needed.
```javascript
```typescript
{
trigger: "[data-scroll]", // Selector for trigger (must be a valid css selector)
header: "[data-scroll-header]", // Selector for fixed header (must be a valid css selector)
trigger: '[data-scroll]', // Selector for trigger (must be a valid css selector)
header: '[data-scroll-header]', // Selector or Element for fixed header (Selector of must be a valid css selector)
duration: 1000, // Specifies animation duration in integer
delay: 0, // Specifies timer for delaying the execution of the scroll in milliseconds
easing: "easeOutQuint", // Specifies the pattern of easing
easing: 'easeOutQuint', // Specifies the pattern of easing
offset: 0, // Specifies the value to offset the scroll position in pixels
verticalScroll: true, // Enable the vertical scroll
horizontalScroll: false, // Enable the horizontal scroll
stopScroll: true, // When fired wheel or touchstart events to stop scrolling
updateURL: false, // Update the URL hash on after scroll (true | false | "push" | "replace")
vertical: true, // Enable the vertical scroll
horizontal: false, // Enable the horizontal scroll
cancellable: true, // When fired wheel or touchstart events to stop scrolling
updateURL: false, // Update the URL hash on after scroll (true | false | 'push' | 'replace')
preventDefault: true, // Cancels the container element click event
stopPropagation: true, // Prevents further propagation of the container element click event in the bubbling phase
outputLog: false, // Specify level of output to log
quickMode: false, // Instantly scroll to the destination! (It's recommended to use it with `easeOutExpo`)
// Callbacks
beforeScroll: null,
afterScroll: null,
cancelScroll: null,
completeScroll: null,
stepScroll: null
before: null,
after: null,
cancel: null,
complete: null,
step: null,
}

@@ -123,6 +158,10 @@ ```

### Easings
## Easings
Supports the following easing.
### Built-in (22)
* **Normal**

@@ -158,15 +197,190 @@ - `linear`

- `easeInOutCirc`
* **Elastic**
- `easeInElastic`
- `easeOutElastic`
- `easeInOutElastic`
* **Back**
- `easeInBack`
- `easeOutBack`
- `easeInOutBack`
* **Bounce**
- `easeInBounce`
- `easeOutBounce`
- `easeInOutBounce`
### Advanced (9)
Easing functions that are not built in can pass functions directly.
```typescript
const scroller = new SweetScroll({
easing: advancedEasingFunction,
});
```
#### Elastic
<details>
<summary><code>easeInElastic</code></summary>
```typescript
const easeInElastic = (_, t, b, c, d) => {
let s = 1.70158;
let p = 0;
let a = c;
if (t === 0) return b;
if ((t /= d) === 1) return b + c;
if (!p) p = d * 0.3;
if (a < Math.abs(c)) {
a = c;
s = p / 4;
} else {
s = p / (2 * Math.PI) * asin(c / a);
}
return -(a * Math.pow(2, 10 * (t -= 1)) * Math.sin((t * d - s) * (2 * Math.PI) / p)) + b;
};
```
</details>
<details>
<summary><code>easeOutElastic</code></summary>
```typescript
const easeOutElastic = (_, t, b, c, d) => {
let s = 1.70158;
let p = 0;
let a = c;
if (t === 0) return b;
if ((t /= d) === 1) return b + c;
if (!p) p = d * 0.3;
if (a < Math.abs(c)) {
a = c;
s = p / 4;
} else {
s = p / (2 * Math.PI) * asin(c / a);
}
return a * Math.pow(2, -10 * t) * Math.sin((t * d - s) * (2 * Math.PI) / p) + c + b;
};
```
</details>
<details>
<summary><code>easeInOutElastic</code></summary>
```typescript
const easeInOutElastic = (_, t, b, c, d) => {
let s = 1.70158;
let p = 0;
let a = c;
if (t === 0) return b;
if ((t /= d / 2) === 2) return b + c;
if (!p) p = d * (0.3 * 1.5);
if (a < Math.abs(c)) {
a = c;
s = p / 4;
} else {
s = p / (2 * Math.PI) * Math.asin(c / a);
}
if (t < 1) {
return -0.5 * (a * Math.pow(2, 10 * (t -= 1)) * Math.sin((t * d - s) * (2 * Math.PI) / p)) + b;
}
return a * Math.pow(2, -10 * (t -= 1)) * Math.sin((t * d - s) * (2 * Math.PI) / p) * 0.5 + c + b;
};
```
</details>
#### Back
<details>
<summary><code>easeInBack</code></summary>
```typescript
const easeInBack = (_, t, b, c, d, s = 1.70158) => (
c * (t /= d) * t * ((s + 1) * t - s) + b
);
```
</details>
<details>
<summary><code>easeOutBack</code></summary>
```typescript
const easeOutBack = (_, t, b, c, d, s = 1.70158) => (
c * ((t = t / d - 1) * t * ((s + 1) * t + s) + 1) + b
);
```
</details>
<details>
<summary><code>easeInOutBack</code></summary>
```typescript
const easeInOutBack = (_, t, b, c, d, s = 1.70158) => (
(t /= d / 2) < 1
? c / 2 * (t * t * (((s *= (1.525)) + 1) * t - s)) + b
: c / 2 * ((t -= 2) * t * (((s *= (1.525)) + 1) * t + s) + 2) + b
);
```
</details>
#### Bounce
<details>
<summary><code>easeOutBounce</code></summary>
```typescript
const easeOutBounce = (_, t, b, c, d) => {
if ((t /= d) < (1 / 2.75)) {
return c * (7.5625 * t * t) + b;
} else if (t < (2 / 2.75)) {
return c * (7.5625 * (t -= (1.5 / 2.75)) * t + 0.75) + b;
} else if (t < (2.5 / 2.75)) {
return c * (7.5625 * (t -= (2.25 / 2.75)) * t + 0.9375) + b;
}
return c * (7.5625 * (t -= (2.625 / 2.75)) * t + 0.984375) + b;
};
```
</details>
<details>
<summary><code>easeInBounce</code></summary>
```typescript
const easeOutBounce = (_, t, b, c, d) => {
if ((t /= d) < (1 / 2.75)) {
return c * (7.5625 * t * t) + b;
} else if (t < (2 / 2.75)) {
return c * (7.5625 * (t -= (1.5 / 2.75)) * t + 0.75) + b;
} else if (t < (2.5 / 2.75)) {
return c * (7.5625 * (t -= (2.25 / 2.75)) * t + 0.9375) + b;
}
return c * (7.5625 * (t -= (2.625 / 2.75)) * t + 0.984375) + b;
};
const easeInBounce = (x, t, b, c, d) => (
c - easeOutBounce(x, d - t, 0, c, d) + b
);
```
</details>
<details>
<summary><code>easeInOutBounce</code></summary>
```typescript
const easeOutBounce = (_, t, b, c, d) => {
if ((t /= d) < (1 / 2.75)) {
return c * (7.5625 * t * t) + b;
} else if (t < (2 / 2.75)) {
return c * (7.5625 * (t -= (1.5 / 2.75)) * t + 0.75) + b;
} else if (t < (2.5 / 2.75)) {
return c * (7.5625 * (t -= (2.25 / 2.75)) * t + 0.9375) + b;
}
return c * (7.5625 * (t -= (2.625 / 2.75)) * t + 0.984375) + b;
};
const easeInBounce = (x, t, b, c, d) => (
c - easeOutBounce(x, d - t, 0, c, d) + b
);
const easeInOutBounce = (x, t, b, c, d) => (
t < d / 2
? easeInBounce(x, t * 2, 0, c, d) * 0.5 + b
: easeOutBounce(x, t * 2 - d, 0, c, d) * 0.5 + c * 0.5 + b
);
```
</details>
---
[Live demo](http://tsuyoshiwada.github.io/sweet-scroll/easings.html)

@@ -176,6 +390,7 @@

### Customizing Tips
#### Specifies the container
## Customizing Tips
### Specifying container elements
In the following example we have specified in the container for scrolling the `#container`.

@@ -191,12 +406,12 @@

```javascript
```typescript
// Specified in the CSS Selector
const sweetScroll = new SweetScroll({/* some options */}, "#container");
const scroller = new SweetScroll({/* some options */}, '#container');
// Specified in the Element
const sweetScroll = new SweetScroll({/* some options */}, document.getElementById("container"));
const scroller = new SweetScroll({/* some options */}, document.getElementById('container'));
```
#### Specifies a fixed header
### Specify fixed header

@@ -211,5 +426,5 @@ Add the `data-scroll-header` attribute in order to offset the height of the fixed header.

```javascript
const sweetScroll = new SweetScroll({
header: "#header"
```typescript
const scroller = new SweetScroll({
header: '#header',
});

@@ -219,3 +434,3 @@ ```

#### Override of options for each element
### Override of options for each element

@@ -225,7 +440,7 @@ You can override the default options by passing the option in `JSON` format to the `data-scroll-options`.

```html
<a href="#target" data-scroll data-scroll-options='{"easing": "easeOutBounce"}'>Go to Target</a>
<a href="#target" data-scroll data-scroll-options='{"easing": "easeOutExpo"}'>Go to Target</a>
```
#### if you want to use in non anchor element
### if you want to use in non anchor element

@@ -239,10 +454,10 @@ Will use the data-scroll attribute instead of href.

#### Do you feel scrolling is slow?
### Do you feel scrolling is slow?
You can solve with `quickMode` options!
```javascript
const sweetScroll = new SweetScroll({
```typescript
const scroller = new SweetScroll({
quickMode: true,
easing: "easeOutExpo" // Recommended
easing: 'easeOutExpo', // Recommended
});

@@ -255,9 +470,9 @@ ```

#### Scroll animation in a other page
### Scrolling animation in another page
The following, Introduce one of the mounting method.
```javascript
document.addEventListener("DOMContentLoaded", () => {
const sweetScroll = new SweetScroll();
```typescript
document.addEventListener('DOMContentLoaded', () => {
const scroller = new SweetScroll();
const hash = window.location.hash;

@@ -267,8 +482,8 @@ const needsInitialScroll = document.getElementById(hash.substr(1)) != null;

if (needsInitialScroll) {
window.location.hash = "";
window.location.hash = '';
}
window.addEventListener("load", () => {
window.addEventListener('load', () => {
if (needsInitialScroll) {
sweetScroll.to(hash, { updateURL: "replace" });
scroller.to(hash, { updateURL: 'replace' });
}

@@ -287,81 +502,61 @@ }, false);

* [new SweetScroll(options = {}, container = "body, html")](#new-sweetscrolloptions---container--body-html)
* [to(distance, options = {})](#todistance-options--)
* [toTop(distance, options = {})](#totopdistance-options--)
* [toLeft(distance, options = {})](#toleftdistance-options--)
* [toElement(el, options = {})](#toelementel-options--)
* [update(options = {})](#updateoptions--)
* [stop(gotoEnd = false)](#stopgotoend--true)
* [destroy()](#destroy)
* [Callbacks](#callbacks)
- `beforeScroll(toScroll, trigger) {}`
- `cancelScroll() {}`
- `afterScroll(toScroll, trigger) {}`
- `completeScroll(isCancel) {}`
- `stepScroll(currentTime, props) {}`
`distance` to can specify the CSS Selector or scroll position.
### new SweetScroll(options?: PartialOptions, container?: string | Element)
Will generate a SweetScroll instance.
**Example:**
```javascript
const SweetScroll = new SweetScroll();
```typescript
const scroller = new SweetScroll({
duration: 1200,
easing: 'easeOutExpo',
}, '#container');
```
// CSS Selector of target element
sweetScroll.to("#footer");
// Object
sweetScroll.to({top: 1000, left: 20});
### SweetScroll.create(options?: PartialOptions, container?: string | Element)
// Array (top:0, left:1000)
sweetScroll.to([0, 1000]);
Will generate a SweetScroll instance. (factory method)
// Number (Priority to vertical scroll position. by default.)
sweetScroll.to(500);
**Example:**
// String (Like object syntax)
sweetScroll.to("top: 500, left: 100");
// String (Relative position)
sweetScroll.to("+=500");
sweetScroll.to("-=200");
```typescript
const scroller = SweetScroll.create({
duration: 1200,
easing: 'easeOutExpo',
}, '#container');
```
### new SweetScroll(options = {}, container = "body, html")
### to(distance: any, options?: PartialOptions)
**options: {Object}**
**container: {String | Element}**
Scroll animation to the specified `distance`.
`distance` to can specify the CSS Selector or scroll position.
Will generate a SweetScroll instance.
**Example:**
```javascript
const sweetScroll = new SweetScroll({
duration: 1200,
easing: "easeOutBounce"
}, "#container");
```
```typescript
const scroller = new SweetScroll();
// CSS Selector of target element
scroller.to('#footer');
### to(distance, options = {})
// Object
scroller.to({ top: 1000, left: 20 });
**distance: {String | Array | Object}**
**options: {Object}**
// Array (top:0, left:1000)
scroller.to([0, 1000]);
Scroll animation to the specified `distance`.
// Number (Priority to vertical scroll position. by default.)
scroller.to(500);
**Example:**
```javascript
sweetScroll.to({top: 1500, left: 400});
// String (Relative position)
scroller.to('+=500');
scroller.to('-=200');
```
### toTop(distance, options = {})
### toTop(distance: any, options?: PartialOptions)
**distance: {String | Array | Object}**
**options: {Object}**
Vertical scroll animation to the specified `distance`.

@@ -371,12 +566,9 @@

```javascript
sweetScroll.toTop(0);
```typescript
scroller.toTop(0);
```
### toLeft(distance, options = {})
### toLeft(distance: any, options?: PartialOptions)
**distance: {String | Array | Object}**
**options: {Object}**
Horizontal scroll animation to the specified `distance`.

@@ -386,12 +578,9 @@

```javascript
sweetScroll.toLeft(1500);
```typescript
scroller.toLeft(1500);
```
### toElement(el, options = {})
### toElement($el: Element, options?: PartialOptions)
**el: {Element}**
**options: {Object}**
Scroll animation to the specified `Element`.

@@ -401,11 +590,9 @@

```javascript
sweetScroll.toElement(document.getElementById("content"));
```typescript
scroller.toElement(document.getElementById('content'));
```
### update(options = {})
### update(options: PartialOptions)
**options: {Object}**
Will update the SweetScroll instance.

@@ -416,6 +603,6 @@ Primarily used in the case of option update.

```javascript
sweetScroll.update({
trigger: "a[href^='#']"
duration: 3000
```typescript
scroller.update({
trigger: 'a[href^="#"]',
duration: 3000,
});

@@ -425,3 +612,3 @@ ```

### stop(gotoEnd = true)
### stop(gotoEnd: boolean = true)

@@ -434,4 +621,4 @@ **gotoEnd: {Boolean}**

```javascript
sweetScroll.stop(true);
```typescript
scroller.stop(true);
```

@@ -447,4 +634,4 @@

```javascript
sweetScroll.destory();
```typescript
scroller.destroy();
```

@@ -455,14 +642,14 @@

In `beforeScroll` and `afterScroll`, you will pass the coordinates and the triggering element in the argument.
In addition, you can stop the scrolling by return a `beforeScroll` in `false`.
In `before` and `after`, you will pass the coordinates and the triggering element in the argument.
In addition, you can stop the scrolling by return a `before` in `false`.
**Example:**
```javascript
const sweetScroll = new SweetScroll({
```typescript
const scroller = new SweetScroll({
// Stop scrolling case of trigger element that contains the `is-disabled` class.
beforeScroll(toScroll, trigger) {
console.log("Before!!");
if (trigger && trigger.classList.contains("is-disabled")) {
before: (offset: Offset, $trigger: Element | null, scroller: SweetScroll): boolean | void => {
console.log('Before!!', offset, scroller);
if ($trigger && $trigger.classList.contains('is-disabled')) {
return false;

@@ -473,20 +660,20 @@ }

// If the `wheel` or `touchstart` event is called
cancelScroll() {
console.log("Cancel!!");
cancel: (scroller: SweetScroll): void => {
console.log('Cancel!!', scroller);
},
// Scroll animation is complete
afterScroll(toScroll, trigger) {
console.log("After!!");
after: (offset: Offset, $trigger: Element | null, scroller: SweetScroll): void => {
console.log('After!!', offset, $trigger, scroller);
},
// Scroll animation is complete (`after` or `cancel`)
completeScroll(isCancel) {
console.log("Complete!!", isCancel);
complete: (isCancel: boolean, scroller: SweetScroll): void => {
console.log('Complete!!', isCancel, scroller);
},
// Each animation frame
stepScroll(currentTime, props) {
console.log("step", currentTime, props);
}
step: (time: number, scroller: SweetScroll): void => {
console.log('step', time, scroller);
},
});

@@ -499,8 +686,10 @@ ```

```javascript
```typescript
import SweetScroll, { Offset } from 'sweet-scroll';
class MyScroll extends SweetScroll {
beforeScroll(toScroll, trigger) {
protected onBefore(offset: Offset, $trigger: Element | null): boolean | void {
// Stop scrolling case of trigger element that contains the `is-disabled` class.
console.log("Before!!");
if (trigger && trigger.classList.contains("is-disabled")) {
console.log('Before!!', offset);
if ($trigger && $trigger.classList.contains('is-disabled')) {
return false;

@@ -510,16 +699,16 @@ }

cancelScroll() {
console.log("Canell!!");
protected onCancel(): void {
console.log('Canell!!');
}
afterScroll(toScroll, trigger) {
console.log("After!!");
protected onAfter(offset: Offset, $trigger: Element | null): void {
console.log('After!!', offset, $trigger);
}
completeScroll(isCancel) {
console.log("Complete!!", isCancel);
protected onComplete(isCancel: boolean): void {
console.log('Complete!!', isCancel);
}
stepScroll(currentTime, props) {
console.log("step", currentTime, props);
protected onStep(time: number): void {
console.log('step', time);
}

@@ -529,71 +718,73 @@ }

## BROWSER SUPPORT
Works in `IE9+`, and all modern browsers.
## Browser Support
## CHANGELOG
Works in `IE10+`, and all modern browsers.
See the [CHANGELOG.md](https://github.com/tsuyoshiwada/sweet-scroll/blob/master/CHANGELOG.md)
### Scrolling with IE9
It is necessary to use [polyfill](https://gist.github.com/paulirish/1579671) or ponyfill of `requestAnimationFrame`.
## LICENCE
<details>
<summary>Example ponyfill</summary>
Released under the [MIT Licence](https://raw.githubusercontent.com/tsuyoshiwada/sweet-scroll/master/LICENSE)
Using [raf](https://github.com/chrisdickinson/raf) module.
```typescript
import raf from 'raf';
import SweetScroll from 'sweet-scroll';
SweetScroll.raf = raf;
SweetScroll.caf = raf.cancel;
```
</details>
## AUTHOR
[tsuyoshiwada](https://github.com/tsuyoshiwada)
## CHANGELOG
## DEVELOPMENT
See the [CHANGELOG.md](https://github.com/tsuyoshiwada/sweet-scroll/blob/master/CHANGELOG.md)
Initialization of the project.
```bash
$ cd /your/project/dir
$ git clone https://github.com/tsuyoshiwada/sweet-scroll.git
```
Install some dependencies.
```bash
$ npm install
```
## Contibute
Start the development.
You can access to the `http://localhost:3000/`.
1. Fork it!
1. Create your feature branch: `git checkout -b my-new-feature`
1. Commit your changes: `git commit -am 'Add some feature'`
1. Push to the branch: `git push origin my-new-feature`
1. Submit a pull request :muscle:
```bash
$ npm start
```
Bugs, feature requests and comments are more than welcome in the [issues](https://github.com/tsuyoshiwada/sweet-scroll/issues).
Run lint and testing.
```bash
$ npm test
```
### Development
Generates build file.
We will develop using the following npm scripts.
```bash
$ npm run build
```
#### `npm start`
## CONTRIBUTION
Launch the local server and let the demo run. Opening http://localhost:3000 in your browser.
Thank you for your interest in sweet-scroll.js.
Bugs, feature requests and comments are more than welcome in the [issues](https://github.com/tsuyoshiwada/sweet-scroll/issues).
**Before you open a PR:**
#### `npm run build`
Be careful to follow the code style of the project. Run `npm test` after your changes and ensure you do not introduce any new errors or warnings.
All new features and changes need documentation.
Compile TypeScript and create type definitions.
Thanks!
#### `npm run test`
Run unit testing with Jest.
## License
[MIT © tsuyoshiwada](./LICENSE)

2050

sweet-scroll.js

@@ -1,9 +0,2 @@

/*!
* sweet-scroll
* Modern and the sweet smooth scroll library.
* @author tsuyoshiwada
* @license MIT
* @version 2.2.1
*/
/*! @preserve sweet-scroll v3.0.0 - tsuyoshiwada | MIT License */
(function (global, factory) {

@@ -15,1515 +8,690 @@ typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :

var cos = Math.cos;
var sin = Math.sin;
var pow = Math.pow;
var abs = Math.abs;
var sqrt = Math.sqrt;
var asin = Math.asin;
var PI = Math.PI;
var max = Math.max;
var min = Math.min;
var round = Math.round;
/*! *****************************************************************************
Copyright (c) Microsoft Corporation. All rights reserved.
Licensed under the Apache License, Version 2.0 (the "License"); you may not use
this file except in compliance with the License. You may obtain a copy of the
License at http://www.apache.org/licenses/LICENSE-2.0
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) {
return typeof obj;
} : function (obj) {
return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
};
THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED
WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,
MERCHANTABLITY OR NON-INFRINGEMENT.
See the Apache Version 2.0 License for specific language governing permissions
and limitations under the License.
***************************************************************************** */
/* global Reflect, Promise */
var classCallCheck = function (instance, Constructor) {
if (!(instance instanceof Constructor)) {
throw new TypeError("Cannot call a class as a function");
}
var __assign = Object.assign || function __assign(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
}
return t;
};
var createClass = function () {
function defineProperties(target, props) {
for (var i = 0; i < props.length; i++) {
var descriptor = props[i];
descriptor.enumerable = descriptor.enumerable || false;
descriptor.configurable = true;
if ("value" in descriptor) descriptor.writable = true;
Object.defineProperty(target, descriptor.key, descriptor);
// @link https://github.com/JedWatson/exenv/blob/master/index.js
var canUseDOM = !!(typeof window !== 'undefined' &&
window.document &&
window.document.createElement);
var canUseHistory = !canUseDOM
? false
: (window.history &&
'pushState' in window.history &&
window.location.protocol !== 'file:');
var canUsePassiveOption = (function () {
var support = false;
if (!canUseDOM) {
return support;
}
}
return function (Constructor, protoProps, staticProps) {
if (protoProps) defineProperties(Constructor.prototype, protoProps);
if (staticProps) defineProperties(Constructor, staticProps);
return Constructor;
};
}();
var MAX_ARRAY_INDEX = pow(2, 53) - 1;
var classTypeList = ["Boolean", "Number", "String", "Function", "Array", "Object"];
var classTypes = {};
classTypeList.forEach(function (name) {
classTypes["[object " + name + "]"] = name.toLowerCase();
});
function getType(obj) {
if (obj == null) {
return "";
}
return (typeof obj === "undefined" ? "undefined" : _typeof(obj)) === "object" || typeof obj === "function" ? classTypes[Object.prototype.toString.call(obj)] || "object" : typeof obj === "undefined" ? "undefined" : _typeof(obj);
}
function isNumber(obj) {
return getType(obj) === "number";
}
function isString(obj) {
return getType(obj) === "string";
}
function isFunction(obj) {
return getType(obj) === "function";
}
function isArray(obj) {
return Array.isArray(obj);
}
function isArrayLike(obj) {
var length = obj == null ? null : obj.length;
return isNumber(length) && length >= 0 && length <= MAX_ARRAY_INDEX;
}
function isNumeric(obj) {
return !isArray(obj) && obj - parseFloat(obj) + 1 >= 0;
}
function isObject(obj) {
return !isArray(obj) && getType(obj) === "object";
}
function hasProp(obj, key) {
return obj && obj.hasOwnProperty(key);
}
function each(obj, iterate, context) {
if (obj == null) return obj;
var ctx = context || obj;
if (isObject(obj)) {
for (var key in obj) {
if (!hasProp(obj, key)) continue;
if (iterate.call(ctx, obj[key], key) === false) break;
/* tslint:disable:no-empty */
try {
window.addEventListener('test', null, Object.defineProperty({}, 'passive', {
get: function () {
support = true;
},
}));
}
} else if (isArrayLike(obj)) {
for (var i = 0; i < obj.length; i++) {
if (iterate.call(ctx, obj[i], i) === false) break;
}
}
catch (e) { }
/* tslint:enable */
return support;
})();
return obj;
}
var isString = function (obj) { return typeof obj === 'string'; };
var isFunction = function (obj) { return typeof obj === 'function'; };
var isArray = function (obj) { return Array.isArray(obj); };
var isNumeric = function (obj) { return !isArray(obj) && ((obj - parseFloat(obj)) + 1) >= 0; };
var isElement = function (obj) { return obj instanceof Element; };
var hasProp = function (obj, key) { return (obj && obj.hasOwnProperty(key)); };
function merge(obj) {
for (var _len = arguments.length, sources = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
sources[_key - 1] = arguments[_key];
}
var raf = canUseDOM ? window.requestAnimationFrame.bind(window) : null;
var caf = canUseDOM ? window.cancelAnimationFrame.bind(window) : null;
each(sources, function (source) {
each(source, function (value, key) {
obj[key] = value;
});
});
/* tslint:disable:curly */
/* tslint:disable:no-conditional-assignment */
var cos = Math.cos;
var sin = Math.sin;
var pow = Math.pow;
var sqrt = Math.sqrt;
var PI = Math.PI;
var easings = {
linear: function (p) { return p; },
easeInQuad: function (_, t, b, c, d) { return (c * (t /= d) * t + b); },
easeOutQuad: function (_, t, b, c, d) { return (-c * (t /= d) * (t - 2) + b); },
easeInOutQuad: function (_, t, b, c, d) { return ((t /= d / 2) < 1 ? c / 2 * t * t + b : -c / 2 * ((--t) * (t - 2) - 1) + b); },
easeInCubic: function (_, t, b, c, d) { return (c * (t /= d) * t * t + b); },
easeOutCubic: function (_, t, b, c, d) { return (c * ((t = t / d - 1) * t * t + 1) + b); },
easeInOutCubic: function (_, t, b, c, d) { return ((t /= d / 2) < 1 ? c / 2 * t * t * t + b : c / 2 * ((t -= 2) * t * t + 2) + b); },
easeInQuart: function (_, t, b, c, d) { return (c * (t /= d) * t * t * t + b); },
easeOutQuart: function (_, t, b, c, d) { return (-c * ((t = t / d - 1) * t * t * t - 1) + b); },
easeInOutQuart: function (_, t, b, c, d) { return ((t /= d / 2) < 1 ? c / 2 * t * t * t * t + b : -c / 2 * ((t -= 2) * t * t * t - 2) + b); },
easeInQuint: function (_, t, b, c, d) { return (c * (t /= d) * t * t * t * t + b); },
easeOutQuint: function (_, t, b, c, d) { return (c * ((t = t / d - 1) * t * t * t * t + 1) + b); },
easeInOutQuint: function (_, t, b, c, d) { return ((t /= d / 2) < 1 ? c / 2 * t * t * t * t * t + b : c / 2 * ((t -= 2) * t * t * t * t + 2) + b); },
easeInSine: function (_, t, b, c, d) { return (-c * cos(t / d * (PI / 2)) + c + b); },
easeOutSine: function (_, t, b, c, d) { return (c * sin(t / d * (PI / 2)) + b); },
easeInOutSine: function (_, t, b, c, d) { return (-c / 2 * (cos(PI * t / d) - 1) + b); },
easeInExpo: function (_, t, b, c, d) { return ((t === 0) ? b : c * pow(2, 10 * (t / d - 1)) + b); },
easeOutExpo: function (_, t, b, c, d) { return ((t === d) ? b + c : c * (-pow(2, -10 * t / d) + 1) + b); },
easeInOutExpo: function (_, t, b, c, d) {
if (t === 0)
return b;
if (t === d)
return b + c;
if ((t /= d / 2) < 1)
return c / 2 * pow(2, 10 * (t - 1)) + b;
return c / 2 * (-pow(2, -10 * --t) + 2) + b;
},
easeInCirc: function (_, t, b, c, d) { return (-c * (sqrt(1 - (t /= d) * t) - 1) + b); },
easeOutCirc: function (_, t, b, c, d) { return (c * sqrt(1 - (t = t / d - 1) * t) + b); },
easeInOutCirc: function (_, t, b, c, d) { return ((t /= d / 2) < 1 ? -c / 2 * (sqrt(1 - t * t) - 1) + b : c / 2 * (sqrt(1 - (t -= 2) * t) + 1) + b); },
};
return obj;
}
function removeSpaces(str) {
return str.replace(/\s*/g, "") || "";
}
function warning(message) {
/* eslint-disable no-console */
if (typeof console !== "undefined" && typeof console.error === "function") {
console.error(message);
}
/* eslint-enable no-console */
/* eslint-disable no-empty */
try {
throw new Error(message);
} catch (e) {}
/* eslint-enable no-empty */
}
// @link https://github.com/JedWatson/exenv/blob/master/index.js
var canUseDOM = !!(typeof window !== "undefined" && window.document && window.document.createElement);
// @link https://github.com/Modernizr/Modernizr
var history = function () {
if (!canUseDOM) return false;
var ua = navigator.userAgent;
if ((ua.indexOf("Android 2.") !== -1 || ua.indexOf("Android 4.0") !== -1) && ua.indexOf("Mobile Safari") !== -1 && ua.indexOf("Chrome") === -1 && ua.indexOf("Windows Phone") === -1) {
return false;
}
return window.history && "pushState" in window.history && window.location.protocol !== "file:";
}();
var win = canUseDOM ? window : null;
var doc = canUseDOM ? document : null;
function $(selector) {
var context = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
if (!selector) return;
return (context == null ? doc : context).querySelector(selector);
}
function $$(selector) {
var context = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
if (!selector) return;
return (context == null ? doc : context).querySelectorAll(selector);
}
function matches(el, selector) {
var results = (el.document || el.ownerDocument).querySelectorAll(selector);
var i = results.length;
while (--i >= 0 && results.item(i) !== el) {}
return i > -1;
}
var directionMethodMap = {
y: "scrollTop",
x: "scrollLeft"
y: 'scrollTop',
x: 'scrollLeft',
};
var directionPropMap = {
y: "pageYOffset",
x: "pageXOffset"
y: 'pageYOffset',
x: 'pageXOffset',
};
function isRootContainer(el) {
return el === doc.documentElement || el === doc.body;
}
function getZoomLevel() {
var outerWidth = win.outerWidth,
innerWidth = win.innerWidth;
return outerWidth ? outerWidth / innerWidth : 1;
}
function getScrollable(selectors) {
var direction = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "y";
var all = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
var method = directionMethodMap[direction];
var elements = selectors instanceof Element ? [selectors] : $$(selectors);
var scrollables = [];
var $div = doc.createElement("div");
for (var i = 0; i < elements.length; i++) {
var el = elements[i];
if (el[method] > 0) {
scrollables.push(el);
} else {
$div.style.width = el.clientWidth + 1 + "px";
$div.style.height = el.clientHeight + 1 + "px";
el.appendChild($div);
el[method] = 1.5 / getZoomLevel();
if (el[method] > 0) {
scrollables.push(el);
}
el[method] = 0;
el.removeChild($div);
var getScroll = function ($el, direction) { return ($el[directionMethodMap[direction]]); };
var setScroll = function ($el, offset, direction) {
$el[directionMethodMap[direction]] = offset;
};
var getOffset = function ($el, $context) {
var rect = $el.getBoundingClientRect();
if (rect.width || rect.height) {
var scroll_1 = { top: 0, left: 0 };
var $ctx = void 0;
if (isRootContainer($context)) {
$ctx = document.documentElement;
scroll_1.top = window[directionPropMap.y];
scroll_1.left = window[directionPropMap.x];
}
else {
$ctx = $context;
var cRect = $ctx.getBoundingClientRect();
scroll_1.top = (cRect.top * -1) + $ctx[directionMethodMap.y];
scroll_1.left = (cRect.left * -1) + $ctx[directionMethodMap.x];
}
return {
top: (rect.top + scroll_1.top) - $ctx.clientTop,
left: (rect.left + scroll_1.left) - $ctx.clientLeft,
};
}
return rect;
};
if (!all && scrollables.length > 0) break;
}
return scrollables;
}
function scrollableFind(selectors, direction) {
var scrollables = getScrollable(selectors, direction, false);
return scrollables.length >= 1 ? scrollables[0] : null;
}
function getWindow(el) {
return el != null && el === el.window ? el : el.nodeType === 9 && el.defaultView;
}
function getHeight(el) {
return max(el.scrollHeight, el.clientHeight, el.offsetHeight);
}
function getWidth(el) {
return max(el.scrollWidth, el.clientWidth, el.offsetWidth);
}
function getSize(el) {
return {
width: getWidth(el),
height: getHeight(el)
};
}
function getDocumentSize() {
return {
width: max(getWidth(doc.body), getWidth(doc.documentElement)),
height: max(getHeight(doc.body), getHeight(doc.documentElement))
};
}
function getViewportAndElementSizes(el) {
if (isRootContainer(el)) {
return {
viewport: {
width: min(win.innerWidth, doc.documentElement.clientWidth),
height: win.innerHeight
},
size: getDocumentSize()
};
}
return {
viewport: {
width: el.clientWidth,
height: el.clientHeight
},
size: getSize(el)
};
}
function getScroll(el) {
var direction = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "y";
var currentWindow = getWindow(el);
return currentWindow ? currentWindow[directionPropMap[direction]] : el[directionMethodMap[direction]];
}
function setScroll(el, offset) {
var direction = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : "y";
var currentWindow = getWindow(el);
var top = direction === "y";
if (currentWindow) {
currentWindow.scrollTo(!top ? offset : currentWindow[directionPropMap.x], top ? offset : currentWindow[directionPropMap.y]);
} else {
el[directionMethodMap[direction]] = offset;
}
}
function getOffset(el) {
var context = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
if (!el || el && !el.getClientRects().length) {
return { top: 0, left: 0 };
}
var rect = el.getBoundingClientRect();
if (rect.width || rect.height) {
var scroll = {};
var ctx = null;
if (context == null || isRootContainer(context)) {
ctx = el.ownerDocument.documentElement;
scroll.top = win.pageYOffset;
scroll.left = win.pageXOffset;
} else {
ctx = context;
var ctxRect = ctx.getBoundingClientRect();
scroll.top = ctxRect.top * -1 + ctx.scrollTop;
scroll.left = ctxRect.left * -1 + ctx.scrollLeft;
var $$ = function (selector) { return (Array.prototype.slice.call((!selector ? [] : document.querySelectorAll(selector)))); };
var $ = function (selector) { return ($$(selector).shift() || null); };
var matches = function ($el, selector) {
if (isElement(selector)) {
return $el === selector;
}
var results = $$(selector);
var i = results.length;
// tslint:disable-next-line no-empty
while (--i >= 0 && results[i] !== $el) { }
return i > -1;
};
var isRootContainer = function ($el) { return ($el === document.documentElement || $el === document.body); };
var findScrollable = function (selectors, direction) {
var method = directionMethodMap[direction];
var $elements = isElement(selectors) ? [selectors] : $$(selectors);
var $div = document.createElement('div');
for (var i = 0; i < $elements.length; i += 1) {
var $el = $elements[i];
var $result = null;
if ($el[method] > 0) {
$result = $el;
}
else {
var outerWidth_1 = window.outerWidth, innerWidth_1 = window.innerWidth;
var zoom = outerWidth_1 ? outerWidth_1 / innerWidth_1 : 1;
$div.style.width = $el.clientWidth + 1 + "px";
$div.style.height = $el.clientHeight + 1 + "px";
$el.appendChild($div);
$el[method] = 1.5 / zoom;
if ($el[method] > 0) {
$result = $el;
}
$el[method] = 0;
$el.removeChild($div);
}
if ($result) {
return $result;
}
}
return null;
};
var getHeight = function ($el) { return (Math.max($el.scrollHeight, $el.clientHeight, $el.offsetHeight)); };
var getWidth = function ($el) { return (Math.max($el.scrollWidth, $el.clientWidth, $el.offsetWidth)); };
var getSize = function ($el) { return ({
width: getWidth($el),
height: getHeight($el),
}); };
var getViewportAndElementSizes = function ($el) {
var isRoot = isRootContainer($el);
return {
top: rect.top + scroll.top - ctx.clientTop,
left: rect.left + scroll.left - ctx.clientLeft
viewport: {
width: isRoot
? Math.min(window.innerWidth, document.documentElement.clientWidth)
: $el.clientWidth,
height: isRoot ? window.innerHeight : $el.clientHeight,
},
size: isRoot
? {
width: Math.max(getWidth(document.body), getWidth(document.documentElement)),
height: Math.max(getHeight(document.body), getHeight(document.documentElement)),
}
: getSize($el),
};
}
};
return rect;
}
function addEvent(el, event, listener) {
var events = event.split(",");
events.forEach(function (eventName) {
el.addEventListener(eventName.trim(), listener, false);
});
}
function removeEvent(el, event, listener) {
var events = event.split(",");
events.forEach(function (eventName) {
el.removeEventListener(eventName.trim(), listener, false);
});
}
/* eslint-disable no-param-reassign, newline-before-return, max-params, new-cap */
function linear(p) {
return p;
}
function InQuad(x, t, b, c, d) {
return c * (t /= d) * t + b;
}
function OutQuad(x, t, b, c, d) {
return -c * (t /= d) * (t - 2) + b;
}
function InOutQuad(x, t, b, c, d) {
if ((t /= d / 2) < 1) {
return c / 2 * t * t + b;
}
return -c / 2 * (--t * (t - 2) - 1) + b;
}
function InCubic(x, t, b, c, d) {
return c * (t /= d) * t * t + b;
}
function OutCubic(x, t, b, c, d) {
return c * ((t = t / d - 1) * t * t + 1) + b;
}
function InOutCubic(x, t, b, c, d) {
if ((t /= d / 2) < 1) {
return c / 2 * t * t * t + b;
}
return c / 2 * ((t -= 2) * t * t + 2) + b;
}
function InQuart(x, t, b, c, d) {
return c * (t /= d) * t * t * t + b;
}
function OutQuart(x, t, b, c, d) {
return -c * ((t = t / d - 1) * t * t * t - 1) + b;
}
function InOutQuart(x, t, b, c, d) {
if ((t /= d / 2) < 1) {
return c / 2 * t * t * t * t + b;
}
return -c / 2 * ((t -= 2) * t * t * t - 2) + b;
}
function InQuint(x, t, b, c, d) {
return c * (t /= d) * t * t * t * t + b;
}
function OutQuint(x, t, b, c, d) {
return c * ((t = t / d - 1) * t * t * t * t + 1) + b;
}
function InOutQuint(x, t, b, c, d) {
if ((t /= d / 2) < 1) {
return c / 2 * t * t * t * t * t + b;
}
return c / 2 * ((t -= 2) * t * t * t * t + 2) + b;
}
function InSine(x, t, b, c, d) {
return -c * cos(t / d * (PI / 2)) + c + b;
}
function OutSine(x, t, b, c, d) {
return c * sin(t / d * (PI / 2)) + b;
}
function InOutSine(x, t, b, c, d) {
return -c / 2 * (cos(PI * t / d) - 1) + b;
}
function InExpo(x, t, b, c, d) {
return t === 0 ? b : c * pow(2, 10 * (t / d - 1)) + b;
}
function OutExpo(x, t, b, c, d) {
return t === d ? b + c : c * (-pow(2, -10 * t / d) + 1) + b;
}
function InOutExpo(x, t, b, c, d) {
if (t === 0) return b;
if (t === d) return b + c;
if ((t /= d / 2) < 1) return c / 2 * pow(2, 10 * (t - 1)) + b;
return c / 2 * (-pow(2, -10 * --t) + 2) + b;
}
function InCirc(x, t, b, c, d) {
return -c * (sqrt(1 - (t /= d) * t) - 1) + b;
}
function OutCirc(x, t, b, c, d) {
return c * sqrt(1 - (t = t / d - 1) * t) + b;
}
function InOutCirc(x, t, b, c, d) {
if ((t /= d / 2) < 1) {
return -c / 2 * (sqrt(1 - t * t) - 1) + b;
}
return c / 2 * (sqrt(1 - (t -= 2) * t) + 1) + b;
}
function InElastic(x, t, b, c, d) {
var s = 1.70158;
var p = 0;
var a = c;
if (t === 0) return b;
if ((t /= d) === 1) return b + c;
if (!p) p = d * .3;
if (a < abs(c)) {
a = c;
s = p / 4;
} else {
s = p / (2 * PI) * asin(c / a);
}
return -(a * pow(2, 10 * (t -= 1)) * sin((t * d - s) * (2 * PI) / p)) + b;
}
function OutElastic(x, t, b, c, d) {
var s = 1.70158;
var p = 0;
var a = c;
if (t === 0) return b;
if ((t /= d) === 1) return b + c;
if (!p) p = d * .3;
if (a < abs(c)) {
a = c;
s = p / 4;
} else {
s = p / (2 * PI) * asin(c / a);
}
return a * pow(2, -10 * t) * sin((t * d - s) * (2 * PI) / p) + c + b;
}
function InOutElastic(x, t, b, c, d) {
var s = 1.70158;
var p = 0;
var a = c;
if (t === 0) return b;
if ((t /= d / 2) === 2) return b + c;
if (!p) p = d * (.3 * 1.5);
if (a < abs(c)) {
a = c;
s = p / 4;
} else {
s = p / (2 * PI) * asin(c / a);
}
if (t < 1) {
return -.5 * (a * pow(2, 10 * (t -= 1)) * sin((t * d - s) * (2 * PI) / p)) + b;
}
return a * pow(2, -10 * (t -= 1)) * sin((t * d - s) * (2 * PI) / p) * .5 + c + b;
}
function InBack(x, t, b, c, d) {
var s = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : 1.70158;
return c * (t /= d) * t * ((s + 1) * t - s) + b;
}
function OutBack(x, t, b, c, d) {
var s = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : 1.70158;
return c * ((t = t / d - 1) * t * ((s + 1) * t + s) + 1) + b;
}
function InOutBack(x, t, b, c, d) {
var s = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : 1.70158;
if ((t /= d / 2) < 1) {
return c / 2 * (t * t * (((s *= 1.525) + 1) * t - s)) + b;
}
return c / 2 * ((t -= 2) * t * (((s *= 1.525) + 1) * t + s) + 2) + b;
}
function OutBounce(x, t, b, c, d) {
if ((t /= d) < 1 / 2.75) {
return c * (7.5625 * t * t) + b;
} else if (t < 2 / 2.75) {
return c * (7.5625 * (t -= 1.5 / 2.75) * t + .75) + b;
} else if (t < 2.5 / 2.75) {
return c * (7.5625 * (t -= 2.25 / 2.75) * t + .9375) + b;
} else {
return c * (7.5625 * (t -= 2.625 / 2.75) * t + .984375) + b;
}
}
function InBounce(x, t, b, c, d) {
return c - OutBounce(x, d - t, 0, c, d) + b;
}
function InOutBounce(x, t, b, c, d) {
if (t < d / 2) {
return InBounce(x, t * 2, 0, c, d) * .5 + b;
}
return OutBounce(x, t * 2 - d, 0, c, d) * .5 + c * .5 + b;
}
var Easing = Object.freeze({
linear: linear,
InQuad: InQuad,
OutQuad: OutQuad,
InOutQuad: InOutQuad,
InCubic: InCubic,
OutCubic: OutCubic,
InOutCubic: InOutCubic,
InQuart: InQuart,
OutQuart: OutQuart,
InOutQuart: InOutQuart,
InQuint: InQuint,
OutQuint: OutQuint,
InOutQuint: InOutQuint,
InSine: InSine,
OutSine: OutSine,
InOutSine: InOutSine,
InExpo: InExpo,
OutExpo: OutExpo,
InOutExpo: InOutExpo,
InCirc: InCirc,
OutCirc: OutCirc,
InOutCirc: InOutCirc,
InElastic: InElastic,
OutElastic: OutElastic,
InOutElastic: InOutElastic,
InBack: InBack,
OutBack: OutBack,
InOutBack: InOutBack,
OutBounce: OutBounce,
InBounce: InBounce,
InOutBounce: InOutBounce
});
var vendors = ["ms", "moz", "webkit"];
var lastTime = 0;
var raf = canUseDOM ? win.requestAnimationFrame : null;
var caf = canUseDOM ? win.cancelAnimationFrame : null;
if (canUseDOM) {
for (var x = 0; x < vendors.length && !raf; ++x) {
raf = win[vendors[x] + "RequestAnimationFrame"];
caf = win[vendors[x] + "CancelAnimationFrame"] || win[vendors[x] + "CancelRequestAnimationFrame"];
}
if (!raf) {
raf = function raf(callback) {
var currentTime = Date.now();
var timeToCall = max(0, 16 - (currentTime - lastTime));
var id = setTimeout(function () {
callback(currentTime + timeToCall);
}, timeToCall);
lastTime = currentTime + timeToCall;
return id;
};
}
if (!caf) {
caf = function caf(id) {
clearTimeout(id);
};
}
}
var ScrollTween = function () {
function ScrollTween(el) {
classCallCheck(this, ScrollTween);
this.el = el;
this.props = {};
this.options = {};
this.progress = false;
this.easing = null;
this.startTime = null;
this.rafId = null;
}
createClass(ScrollTween, [{
key: "run",
value: function run(x, y, options) {
var _this = this;
if (this.progress) return;
this.props = { x: x, y: y };
this.options = options;
this.easing = isFunction(options.easing) ? options.easing : Easing[options.easing.replace("ease", "")];
this.progress = true;
setTimeout(function () {
_this.startProps = _this.calcStartProps(x, y);
_this.rafId = raf(function (time) {
return _this._loop(time);
});
}, this.options.delay);
var wheelEventName = (function () {
if (!canUseDOM) {
return 'wheel';
}
}, {
key: "stop",
value: function stop() {
var gotoEnd = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
var complete = this.options.complete;
return 'onwheel' in document ? 'wheel' : 'mousewheel';
})();
var eventName = function (name) { return (name === 'wheel' ? wheelEventName : name); };
var apply = function ($el, method, event, listener, passive) {
event.split(' ').forEach(function (name) {
$el[method](eventName(name), listener, canUsePassiveOption ? { passive: passive } : false);
});
};
var addEvent = function ($el, event, listener, passive) {
apply($el, 'addEventListener', event, listener, passive);
};
var removeEvent = function ($el, event, listener, passive) {
apply($el, 'removeEventListener', event, listener, passive);
};
this.startTime = null;
this.progress = false;
caf(this.rafId);
if (gotoEnd) {
setScroll(this.el, this.props.x, "x");
setScroll(this.el, this.props.y, "y");
}
if (isFunction(complete)) {
complete.call(this);
this.options.complete = null;
}
var reRelativeToken = /^(\+|-)=(\d+(?:\.\d+)?)$/;
var parseCoordinate = function (coordinate, enableVertical) {
var res = { top: 0, left: 0, relative: false };
// Object ({ top: {n}, left: {n} })
if (hasProp(coordinate, 'top') || hasProp(coordinate, 'left')) {
res = __assign({}, res, coordinate);
// Array ([{n}, [{n}])
}
}, {
key: "_loop",
value: function _loop(time) {
var _this2 = this;
if (!this.startTime) {
this.startTime = time;
}
if (!this.progress) {
this.stop(false);
return;
}
var el = this.el,
props = this.props,
options = this.options,
startTime = this.startTime,
startProps = this.startProps,
easing = this.easing;
var duration = options.duration,
step = options.step;
var toProps = {};
var timeElapsed = time - startTime;
var t = min(1, max(timeElapsed / duration, 0));
each(props, function (value, key) {
var initialValue = startProps[key];
var delta = value - initialValue;
if (delta === 0) return true;
var val = easing(t, duration * t, 0, 1, duration);
toProps[key] = round(initialValue + delta * val);
});
each(toProps, function (value, key) {
setScroll(el, value, key);
});
if (timeElapsed <= duration) {
step.call(this, t, toProps);
this.rafId = raf(function (currentTime) {
return _this2._loop(currentTime);
});
} else {
this.stop(true);
}
else if (isArray(coordinate)) {
if (coordinate.length > 1) {
res.top = coordinate[0];
res.left = coordinate[1];
}
else if (coordinate.length === 1) {
res.top = enableVertical ? coordinate[0] : 0;
res.left = !enableVertical ? coordinate[0] : 0;
}
else {
return null;
}
// Number
}
}, {
key: "calcStartProps",
value: function calcStartProps(x, y) {
var startProps = {
x: getScroll(this.el, "x"),
y: getScroll(this.el, "y")
};
if (this.options.quickMode) {
var _Dom$getViewportAndEl = getViewportAndElementSizes(this.el),
_Dom$getViewportAndEl2 = _Dom$getViewportAndEl.viewport,
width = _Dom$getViewportAndEl2.width,
height = _Dom$getViewportAndEl2.height;
if (abs(startProps.y - y) > height) {
startProps.y = startProps.y > y ? y + height : y - height;
else if (isNumeric(coordinate)) {
if (enableVertical) {
res.top = coordinate;
}
if (abs(startProps.x - x) > width) {
startProps.x = startProps.x > x ? x + width : x - width;
else {
res.left = coordinate;
}
}
return startProps;
// String ('+={n}', '-={n}')
}
}]);
return ScrollTween;
}();
var WHEEL_EVENT = function () {
if (!canUseDOM) return "wheel";
if ("onwheel" in doc) {
return "wheel";
} else if ("onmousewheel" in doc) {
return "mousewheel";
} else {
return "DOMMouseScroll";
}
}();
var CONTAINER_STOP_EVENTS = WHEEL_EVENT + ", touchstart, touchmove";
var SweetScroll = function () {
/* eslint-enable max-len */
/**
* SweetScroll constructor
* @constructor
* @param {Object} options
* @param {String | Element} container
*/
function SweetScroll() {
var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
var container = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "body, html";
classCallCheck(this, SweetScroll);
this.isSSR = !canUseDOM;
this.options = merge({}, SweetScroll.defaults, options);
this.container = this.getContainer(container);
if (this.container == null) {
this.header = null;
this.tween = null;
if (!this.isSSR) {
if (!/comp|inter|loaded/.test(doc.readyState)) {
this.log("Should be initialize later than DOMContentLoaded.");
} else {
this.log("Not found scrollable container. => \"" + container + "\"");
else if (isString(coordinate)) {
var m = coordinate.trim().match(reRelativeToken);
if (!m) {
return null;
}
}
} else {
this.header = $(this.options.header);
this.tween = new ScrollTween(this.container);
this._trigger = null;
this._shouldCallCancelScroll = false;
this.bindContainerClick();
var op = m[1];
var val = parseInt(m[2], 10);
if (op === '+') {
res.top = enableVertical ? val : 0;
res.left = !enableVertical ? val : 0;
}
else {
res.top = enableVertical ? -val : 0;
res.left = !enableVertical ? -val : 0;
}
res.relative = true;
}
}
/**
* Output log
* @param {String} message
* @return {void}
*/
// Default options
/* eslint-disable max-len */
createClass(SweetScroll, [{
key: "log",
value: function log(message) {
if (this.options.outputLog) {
warning("[SweetScroll] " + message);
}
}
/**
* Get scroll offset
* @param {*} distance
* @param {Object} options
* @return {Object}
* @private
*/
}, {
key: "getScrollOffset",
value: function getScrollOffset(distance, options) {
var container = this.container,
header = this.header;
var offset = this.parseCoodinate(options.offset);
var scroll = this.parseCoodinate(distance);
// Using the coordinates in the case of CSS Selector
if (!scroll && isString(distance)) {
if (distance === "#") {
scroll = {
top: 0,
left: 0
};
} else {
var target = $(distance);
var targetOffset = getOffset(target, container);
if (!targetOffset) return;
scroll = targetOffset;
}
}
if (!scroll) {
else {
return null;
}
// Apply `offset` value
if (offset) {
scroll.top += offset.top;
scroll.left += offset.left;
}
// If the header is present apply the height
if (header) {
scroll.top = max(0, scroll.top - getSize(header).height);
}
return scroll;
}
return res;
};
/**
* Normalize scroll offset
* @param {Ojbect} scroll
* @param {Ojbect} options
* @return {Object}
* @private
*/
var defaultOptions = {
trigger: '[data-scroll]',
header: '[data-scroll-header]',
duration: 1000,
easing: 'easeOutQuint',
offset: 0,
vertical: true,
horizontal: false,
cancellable: true,
updateURL: false,
preventDefault: true,
stopPropagation: true,
quickMode: false,
// Callbacks
before: null,
after: null,
cancel: null,
complete: null,
step: null,
};
}, {
key: "normalizeScrollOffset",
value: function normalizeScrollOffset(scroll, options) {
var container = this.container;
var finalScroll = merge({}, scroll);
// Determine the final scroll coordinates
var _Dom$getViewportAndEl = getViewportAndElementSizes(container),
viewport = _Dom$getViewportAndEl.viewport,
size = _Dom$getViewportAndEl.size;
// Adjustment of the maximum value
finalScroll.top = options.verticalScroll ? max(0, min(size.height - viewport.height, finalScroll.top)) : getScroll(container, "y");
finalScroll.left = options.horizontalScroll ? max(0, min(size.width - viewport.width, finalScroll.left)) : getScroll(container, "x");
return finalScroll;
}
var CONTAINER_CLICK_EVENT = 'click';
var CONTAINER_STOP_EVENT = 'wheel touchstart touchmove';
var SweetScroll = /** @class */ (function () {
/**
* Scroll animation to the specified position
* @param {*} distance
* @param {Object} options
* @return {void}
* Constructor
*/
}, {
key: "to",
value: function to(distance) {
var _this = this;
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
if (this.isSSR) return;
var container = this.container;
var params = merge({}, this.options, options);
var trigger = this._trigger;
var hash = isString(distance) && /^#/.test(distance) ? distance : null;
// Temporary options
this._options = params;
// Remove the triggering elements which has been temporarily retained
this._trigger = null;
// Disable the call flag of `cancelScroll`
this._shouldCallCancelScroll = false;
// Stop current animation
this.stop();
// Does not move if the container is not found
if (!container) {
return this.log("Not found container element.");
}
// Get scroll offset
var scroll = this.getScrollOffset(distance, params);
if (!scroll) {
return this.log("Invalid parameter of distance. => " + distance);
}
// Call `beforeScroll`
// Stop scrolling when it returns false
if (this.hook(params, "beforeScroll", scroll, trigger) === false) {
this._options = null;
return;
}
scroll = this.normalizeScrollOffset(scroll, params);
// Run the animation!!
this.tween.run(scroll.left, scroll.top, {
duration: params.duration,
delay: params.delay,
easing: params.easing,
quickMode: params.quickMode,
complete: function complete() {
// Update URL
if (hash != null && hash !== win.location.hash) {
_this.updateURLHash(hash, params.updateURL);
}
// Unbind the scroll stop events, And call `afterScroll` or `cancelScroll`
_this.unbindContainerStop();
// Remove the temporary options
_this._options = null;
// Call `cancelScroll` or `afterScroll`
if (_this._shouldCallCancelScroll) {
_this.hook(params, "cancelScroll");
} else {
_this.hook(params, "afterScroll", scroll, trigger);
}
// Call `completeScroll`
_this.hook(params, "completeScroll", _this._shouldCallCancelScroll);
},
step: function step(currentTime, props) {
_this.hook(params, "stepScroll", currentTime, props);
function SweetScroll(options, container) {
var _this = this;
this.ctx = {
$trigger: null,
opts: null,
progress: false,
pos: null,
startPos: null,
easing: null,
start: 0,
id: 0,
cancel: false,
hash: null,
};
/**
* Handle each frame of the animation.
*/
this.loop = function (time) {
var _a = _this, $el = _a.$el, ctx = _a.ctx;
if (!ctx.start) {
ctx.start = time;
}
if (!ctx.progress || !$el) {
_this.stop();
return;
}
var options = ctx.opts;
var offset = ctx.pos;
var start = ctx.start;
var startOffset = ctx.startPos;
var easing = ctx.easing;
var duration = options.duration;
var directionMap = { top: 'y', left: 'x' };
var timeElapsed = time - start;
var t = Math.min(1, Math.max(timeElapsed / duration, 0));
Object.keys(offset).forEach(function (key) {
var value = offset[key];
var initial = startOffset[key];
var delta = value - initial;
if (delta !== 0) {
var val = easing(t, duration * t, 0, 1, duration);
setScroll($el, Math.round(initial + delta * val), directionMap[key]);
}
});
if (timeElapsed <= duration) {
_this.hook(options, 'step', t);
ctx.id = SweetScroll.raf(_this.loop);
}
else {
_this.stop(true);
}
};
/**
* Handling of container click event.
*/
this.handleClick = function (e) {
var opts = _this.opts;
var $el = e.target;
for (; $el && $el !== document; $el = $el.parentNode) {
if (!matches($el, opts.trigger)) {
continue;
}
var dataOptions = JSON.parse($el.getAttribute('data-scroll-options') || '{}');
var data = $el.getAttribute('data-scroll');
var to = data || $el.getAttribute('href');
var options = __assign({}, opts, dataOptions);
var preventDefault = options.preventDefault, stopPropagation = options.stopPropagation, vertical = options.vertical, horizontal = options.horizontal;
if (preventDefault) {
e.preventDefault();
}
if (stopPropagation) {
e.stopPropagation();
}
// Passes the trigger element to callback
_this.ctx.$trigger = $el;
if (horizontal && vertical) {
_this.to(to, options);
}
else if (vertical) {
_this.toTop(to, options);
}
else if (horizontal) {
_this.toLeft(to, options);
}
}
};
/**
* Handling of container stop events.
*/
this.handleStop = function (e) {
var ctx = _this.ctx;
var opts = ctx.opts;
if (opts && opts.cancellable) {
ctx.cancel = true;
_this.stop();
}
else {
e.preventDefault();
}
};
var opts = __assign({}, defaultOptions, (options || {}));
var vertical = opts.vertical, horizontal = opts.horizontal;
var selector = container === undefined ? 'body,html' : container;
var $container = null;
if (canUseDOM) {
if (vertical) {
$container = findScrollable(selector, 'y');
}
if (!$container && horizontal) {
$container = findScrollable(selector, 'x');
}
}
});
// Bind the scroll stop events
this.bindContainerStop();
if ($container) {
this.opts = opts;
this.$el = $container;
this.bind(true, false);
}
}
/**
* Scroll animation to the specified top position
* @param {*} distance
* @param {Object} options
* @return {void}
* SweetScroll instance factory.
*/
}, {
key: "toTop",
value: function toTop(distance) {
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
this.to(distance, merge({}, options, {
verticalScroll: true,
horizontalScroll: false
}));
}
SweetScroll.create = function (options, container) {
return new SweetScroll(options, container);
};
/**
* Scroll animation to the specified left position
* @param {*} distance
* @param {Object} options
* @return {void}
* Scroll animation to the specified position.
*/
}, {
key: "toLeft",
value: function toLeft(distance) {
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
this.to(distance, merge({}, options, {
verticalScroll: false,
horizontalScroll: true
}));
}
/**
* Scroll animation to the specified element
* @param {Element} el
* @param {Object} options
* @return {void}
*/
}, {
key: "toElement",
value: function toElement(el) {
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
if (this.isSSR) return;
if (el instanceof Element) {
var offset = getOffset(el, this.container);
this.to(offset, merge({}, options));
} else {
this.log("Invalid parameter.");
}
}
/**
* Stop the current animation
* @param {Boolean} gotoEnd
* @return {void}
*/
}, {
key: "stop",
value: function stop() {
var gotoEnd = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
if (this.isSSR) return;
if (!this.container) {
this.log("Not found scrollable container.");
} else {
if (this._stopScrollListener) {
this._shouldCallCancelScroll = true;
SweetScroll.prototype.to = function (distance, options) {
if (!canUseDOM) {
return;
}
this.tween.stop(gotoEnd);
}
}
/**
* Update the instance
* @param {Object} options
* @return {void}
*/
}, {
key: "update",
value: function update() {
var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
if (!this.container) {
if (!this.isSSR) {
this.log("Not found scrollable container.");
}
} else {
var _a = this, $el = _a.$el, ctx = _a.ctx, currentOptions = _a.opts;
var $trigger = ctx.$trigger;
var opts = __assign({}, currentOptions, options || {});
var optOffset = opts.offset, vertical = opts.vertical, horizontal = opts.horizontal;
var $header = isElement(opts.header) ? opts.header : $(opts.header);
var hash = isString(distance) && /^#/.test(distance) ? distance : null;
ctx.opts = opts; // Temporary options
ctx.cancel = false; // Disable the call flag of `cancel`
ctx.hash = hash;
// Stop current animation
this.stop();
this.unbindContainerClick();
this.unbindContainerStop();
this.options = merge({}, this.options, options);
this.header = $(this.options.header);
this.bindContainerClick();
}
}
/**
* Destroy SweetScroll instance
* @return {void}
*/
}, {
key: "destroy",
value: function destroy() {
if (!this.container) {
if (!this.isSSR) {
this.log("Not found scrollable container.");
// Does not move if the container is not found
if (!$el) {
return;
}
} else {
this.stop();
this.unbindContainerClick();
this.unbindContainerStop();
this.container = null;
this.header = null;
this.tween = null;
}
}
/* eslint-disable no-unused-vars */
// Get scroll offset
var offset = parseCoordinate(optOffset, vertical);
var coordinate = parseCoordinate(distance, vertical);
var scroll = { top: 0, left: 0 };
if (coordinate) {
if (coordinate.relative) {
var current = getScroll($el, vertical ? 'y' : 'x');
scroll.top = vertical ? current + coordinate.top : coordinate.top;
scroll.left = !vertical ? current + coordinate.left : coordinate.left;
}
else {
scroll = coordinate;
}
}
else if (isString(distance) && distance !== '#') {
var $target = $(distance);
if (!$target) {
return;
}
scroll = getOffset($target, $el);
}
if (offset) {
scroll.top += offset.top;
scroll.left += offset.left;
}
if ($header) {
scroll.top = Math.max(0, scroll.top - getSize($header).height);
}
// Normalize scroll offset
var _b = getViewportAndElementSizes($el), viewport = _b.viewport, size = _b.size;
scroll.top = vertical
? Math.max(0, Math.min(size.height - viewport.height, scroll.top))
: getScroll($el, 'y');
scroll.left = horizontal
? Math.max(0, Math.min(size.width - viewport.width, scroll.left))
: getScroll($el, 'x');
// Call `before`
// Stop scrolling when it returns false
if (this.hook(opts, 'before', scroll, $trigger) === false) {
ctx.opts = null;
return;
}
// Set offset
ctx.pos = scroll;
// Run animation!!
this.start(opts);
// Bind stop events
this.bind(false, true);
};
/**
* Called at before of the scroll.
* @param {Object} toScroll
* @param {Element} trigger
* @return {Boolean}
* Scroll animation to specified left position.
*/
}, {
key: "beforeScroll",
value: function beforeScroll(toScroll, trigger) {
return true;
}
SweetScroll.prototype.toTop = function (distance, options) {
this.to(distance, __assign({}, options || {}, { vertical: true, horizontal: false }));
};
/**
* Called at cancel of the scroll.
* @return {void}
* Scroll animation to specified top position.
*/
}, {
key: "cancelScroll",
value: function cancelScroll() {}
SweetScroll.prototype.toLeft = function (distance, options) {
this.to(distance, __assign({}, options || {}, { vertical: false, horizontal: true }));
};
/**
* Called at after of the scroll.
* @param {Object} toScroll
* @param {Element} trigger
* @return {void}
* Scroll animation to specified element.
*/
}, {
key: "afterScroll",
value: function afterScroll(toScroll, trigger) {}
SweetScroll.prototype.toElement = function ($element, options) {
var $el = this.$el;
if (!canUseDOM || !$el) {
return;
}
this.to(getOffset($element, $el), options || {});
};
/**
* Called at complete of the scroll.
* @param {Boolean} isCancel
* @return {void}
* Stop the current scroll animation.
*/
}, {
key: "completeScroll",
value: function completeScroll(isCancel) {}
/**
* Called at each animation frame of the scroll.
* @param {Float} currentTime
* @param {Object} props
* @return {void}
*/
}, {
key: "stepScroll",
value: function stepScroll(currentTime, props) {}
/* eslint-enable no-unused-vars */
/**
* Parse the value of coordinate
* @param {*} coodinate
* @return {Object}
*/
}, {
key: "parseCoodinate",
value: function parseCoodinate(coodinate) {
var enableTop = this._options ? this._options.verticalScroll : this.options.verticalScroll;
var scroll = { top: 0, left: 0 };
// Object
if (hasProp(coodinate, "top") || hasProp(coodinate, "left")) {
scroll = merge(scroll, coodinate);
// Array
} else if (isArray(coodinate)) {
if (coodinate.length === 2) {
scroll.top = coodinate[0];
scroll.left = coodinate[1];
} else {
scroll.top = enableTop ? coodinate[0] : 0;
scroll.left = !enableTop ? coodinate[0] : 0;
SweetScroll.prototype.stop = function (gotoEnd) {
if (gotoEnd === void 0) { gotoEnd = false; }
var _a = this, $el = _a.$el, ctx = _a.ctx;
var pos = ctx.pos;
if (!$el || !ctx.progress) {
return;
}
// Number
} else if (isNumeric(coodinate)) {
scroll.top = enableTop ? coodinate : 0;
scroll.left = !enableTop ? coodinate : 0;
// String
} else if (isString(coodinate)) {
var trimedCoodinate = removeSpaces(coodinate);
// "{n},{n}" (Array like syntax)
if (/^\d+,\d+$/.test(trimedCoodinate)) {
trimedCoodinate = trimedCoodinate.split(",");
scroll.top = trimedCoodinate[0];
scroll.left = trimedCoodinate[1];
// "top:{n}, left:{n}" (Object like syntax)
} else if (/^(top|left):\d+,?(?:(top|left):\d+)?$/.test(trimedCoodinate)) {
var top = trimedCoodinate.match(/top:(\d+)/);
var left = trimedCoodinate.match(/left:(\d+)/);
scroll.top = top ? top[1] : 0;
scroll.left = left ? left[1] : 0;
// "+={n}", "-={n}" (Relative position)
} else if (this.container && /^(\+|-)=(\d+)$/.test(trimedCoodinate)) {
var current = getScroll(this.container, enableTop ? "y" : "x");
var results = trimedCoodinate.match(/^(\+|-)=(\d+)$/);
var op = results[1];
var value = parseInt(results[2], 10);
if (op === "+") {
scroll.top = enableTop ? current + value : 0;
scroll.left = !enableTop ? current + value : 0;
} else {
scroll.top = enableTop ? current - value : 0;
scroll.left = !enableTop ? current - value : 0;
}
} else {
return null;
SweetScroll.caf(ctx.id);
ctx.progress = false;
ctx.start = 0;
ctx.id = 0;
if (gotoEnd && pos) {
setScroll($el, pos.left, 'x');
setScroll($el, pos.top, 'y');
}
} else {
return null;
}
scroll.top = parseInt(scroll.top, 10);
scroll.left = parseInt(scroll.left, 10);
return scroll;
}
this.complete();
};
/**
* Update the Hash of the URL.
* @param {String} hash
* @param {Boolean | String} historyType
* @return {void}
* Update options.
*/
}, {
key: "updateURLHash",
value: function updateURLHash(hash, historyType) {
if (this.isSSR || !history || !historyType) return;
win.history[historyType === "replace" ? "replaceState" : "pushState"](null, null, hash);
}
SweetScroll.prototype.update = function (options) {
if (this.$el) {
var opts = __assign({}, this.opts, options);
this.stop();
this.unbind(true, true);
this.opts = opts;
this.bind(true, false);
}
};
/**
* Get the container for the scroll, depending on the options.
* @param {String | Element} selector
* @return {?Element}
* @private
* Destroy instance.
*/
}, {
key: "getContainer",
value: function getContainer(selector) {
var _options = this.options,
verticalScroll = _options.verticalScroll,
horizontalScroll = _options.horizontalScroll;
var container = null;
if (this.isSSR) return container;
if (verticalScroll) {
container = scrollableFind(selector, "y");
}
if (!container && horizontalScroll) {
container = scrollableFind(selector, "x");
}
return container;
}
SweetScroll.prototype.destroy = function () {
if (this.$el) {
this.stop();
this.unbind(true, true);
this.$el = null;
}
};
/**
* Bind a click event to the container
* @return {void}
* @private
* Callback methods.
*/
}, {
key: "bindContainerClick",
value: function bindContainerClick() {
var container = this.container;
if (!container) return;
this._containerClickListener = this.handleContainerClick.bind(this);
addEvent(container, "click", this._containerClickListener);
}
/* tslint:disable:no-empty */
SweetScroll.prototype.onBefore = function (_, __) { return true; };
SweetScroll.prototype.onStep = function (_) { };
SweetScroll.prototype.onAfter = function (_, __) { };
SweetScroll.prototype.onCancel = function () { };
SweetScroll.prototype.onComplete = function (_) { };
/* tslint:enable */
/**
* Unbind a click event to the container
* @return {void}
* @private
* Start scrolling animation.
*/
}, {
key: "unbindContainerClick",
value: function unbindContainerClick() {
var container = this.container;
if (!container || !this._containerClickListener) return;
removeEvent(container, "click", this._containerClickListener);
this._containerClickListener = null;
}
SweetScroll.prototype.start = function (opts) {
var ctx = this.ctx;
ctx.opts = opts;
ctx.progress = true;
ctx.easing = isFunction(opts.easing)
? opts.easing
: easings[opts.easing];
// Update start offset.
var $container = this.$el;
var offset = ctx.pos;
var start = {
top: getScroll($container, 'y'),
left: getScroll($container, 'x'),
};
if (opts.quickMode) {
var _a = getViewportAndElementSizes($container).viewport, width = _a.width, height = _a.height;
if (Math.abs(start.top - offset.top) > height) {
start.top = start.top > offset.top ? offset.top + height : offset.top - height;
}
if (Math.abs(start.left - offset.left) > width) {
start.left = start.left > offset.left ? offset.left + width : offset.left - width;
}
}
ctx.startPos = start;
// Loop
ctx.id = SweetScroll.raf(this.loop);
};
/**
* Bind the scroll stop of events
* @return {void}
* @private
* Handle the completion of scrolling animation.
*/
}, {
key: "bindContainerStop",
value: function bindContainerStop() {
var container = this.container;
if (!container) return;
this._stopScrollListener = this.handleStopScroll.bind(this);
addEvent(container, CONTAINER_STOP_EVENTS, this._stopScrollListener);
}
SweetScroll.prototype.complete = function () {
var _a = this, $el = _a.$el, ctx = _a.ctx;
var hash = ctx.hash, cancel = ctx.cancel, opts = ctx.opts, pos = ctx.pos, $trigger = ctx.$trigger;
if (!$el || !opts) {
return;
}
if (hash != null && hash !== window.location.hash) {
var updateURL = opts.updateURL;
if (canUseDOM && canUseHistory && updateURL !== false) {
window.history[updateURL === 'replace' ? 'replaceState' : 'pushState'](null, '', hash);
}
}
this.unbind(false, true);
ctx.opts = null;
ctx.$trigger = null;
if (cancel) {
this.hook(opts, 'cancel');
}
else {
this.hook(opts, 'after', pos, $trigger);
}
this.hook(opts, 'complete', cancel);
};
/**
* Unbind the scroll stop of events
* @return {void}
* @private
* Callback function and method call.
*/
}, {
key: "unbindContainerStop",
value: function unbindContainerStop() {
var container = this.container;
if (!container || !this._stopScrollListener) return;
removeEvent(container, CONTAINER_STOP_EVENTS, this._stopScrollListener);
this._stopScrollListener = null;
}
SweetScroll.prototype.hook = function (options, type) {
var args = [];
for (var _i = 2; _i < arguments.length; _i++) {
args[_i - 2] = arguments[_i];
}
var callback = options[type];
var callbackResult;
var methodResult;
// callback
if (isFunction(callback)) {
callbackResult = callback.apply(this, args.concat([this]));
}
// method
methodResult = this["on" + (type[0].toUpperCase() + type.slice(1))].apply(this, args);
return callbackResult !== undefined ? callbackResult : methodResult;
};
/**
* Call the specified callback
* @param {Object} options
* @param {String} type
* @param {...*} args
* @return {void}
* @private
* Bind events of container element.
*/
}, {
key: "hook",
value: function hook(options, type) {
var callback = options[type];
// callback
for (var _len = arguments.length, args = Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
args[_key - 2] = arguments[_key];
}
if (isFunction(callback)) {
var result = callback.apply(this, args);
if (typeof result === "undefined") return result;
}
// method
return this[type].apply(this, args);
}
SweetScroll.prototype.bind = function (click, stop) {
var _a = this, $el = _a.$el, opts = _a.ctx.opts;
if ($el) {
if (click) {
addEvent($el, CONTAINER_CLICK_EVENT, this.handleClick, false);
}
if (stop) {
addEvent($el, CONTAINER_STOP_EVENT, this.handleStop, opts ? opts.cancellable : true);
}
}
};
/**
* Handling of scroll stop event
* @param {Event} e
* @return {void}
* @private
* Unbind events of container element.
*/
}, {
key: "handleStopScroll",
value: function handleStopScroll(e) {
var stopScroll = this._options ? this._options.stopScroll : this.options.stopScroll;
if (stopScroll) {
this.stop();
} else {
e.preventDefault();
}
}
/**
* Handling of container click event
* @param {Event} e
* @return {void}
* @private
*/
}, {
key: "handleContainerClick",
value: function handleContainerClick(e) {
var options = this.options;
var el = e.target;
// Explore parent element until the trigger selector matches
for (; el && el !== doc; el = el.parentNode) {
if (!matches(el, options.trigger)) continue;
var data = el.getAttribute("data-scroll");
var dataOptions = this.parseDataOptions(el);
var href = data || el.getAttribute("href");
options = merge({}, options, dataOptions);
if (options.preventDefault) e.preventDefault();
if (options.stopPropagation) e.stopPropagation();
// Passes the trigger elements to callback
this._trigger = el;
if (options.horizontalScroll && options.verticalScroll) {
this.to(href, options);
} else if (options.verticalScroll) {
this.toTop(href, options);
} else if (options.horizontalScroll) {
this.toLeft(href, options);
SweetScroll.prototype.unbind = function (click, stop) {
var _a = this, $el = _a.$el, opts = _a.ctx.opts;
if ($el) {
if (click) {
removeEvent($el, CONTAINER_CLICK_EVENT, this.handleClick, false);
}
if (stop) {
removeEvent($el, CONTAINER_STOP_EVENT, this.handleStop, opts ? opts.cancellable : true);
}
}
}
}
};
/**
* Parse the data-scroll-options attribute
* @param {Element} el
* @return {Object}
* @private
* You can set Polyfill (or Ponyfill) for browsers that do not support requestAnimationFrame.
*/
SweetScroll.raf = raf;
SweetScroll.caf = caf;
return SweetScroll;
}());
}, {
key: "parseDataOptions",
value: function parseDataOptions(el) {
var options = el.getAttribute("data-scroll-options");
return options ? JSON.parse(options) : {};
}
}]);
return SweetScroll;
}();
// Export SweetScroll class
SweetScroll.defaults = {
trigger: "[data-scroll]", // Selector for trigger (must be a valid css selector)
header: "[data-scroll-header]", // Selector for fixed header (must be a valid css selector)
duration: 1000, // Specifies animation duration in integer
delay: 0, // Specifies timer for delaying the execution of the scroll in milliseconds
easing: "easeOutQuint", // Specifies the pattern of easing
offset: 0, // Specifies the value to offset the scroll position in pixels
verticalScroll: true, // Enable the vertical scroll
horizontalScroll: false, // Enable the horizontal scroll
stopScroll: true, // When fired wheel or touchstart events to stop scrolling
updateURL: false, // Update the URL hash on after scroll (true | false | "push" | "replace")
preventDefault: true, // Cancels the container element click event
stopPropagation: true, // Prevents further propagation of the container element click event in the bubbling phase
outputLog: false, // Specify level of output to log
quickMode: false, // Instantly scroll to the destination! (It's recommended to use it with `easeOutExpo`)
// Callbacks
beforeScroll: null,
afterScroll: null,
cancelScroll: null,
completeScroll: null,
stepScroll: null
};
return SweetScroll;
})));

10

sweet-scroll.min.js

@@ -1,8 +0,2 @@

/*!
* sweet-scroll
* Modern and the sweet smooth scroll library.
* @author tsuyoshiwada
* @license MIT
* @version 2.2.1
*/
!function(t,n){"object"==typeof exports&&"undefined"!=typeof module?module.exports=n():"function"==typeof define&&define.amd?define(n):t.SweetScroll=n()}(this,function(){"use strict";function t(t){return null==t?"":"object"===(void 0===t?"undefined":yt(t))||"function"==typeof t?Ct[Object.prototype.toString.call(t)]||"object":void 0===t?"undefined":yt(t)}function n(n){return"number"===t(n)}function e(n){return"string"===t(n)}function i(n){return"function"===t(n)}function o(t){return Array.isArray(t)}function r(t){var e=null==t?null:t.length;return n(e)&&e>=0&&e<=bt}function l(t){return!o(t)&&t-parseFloat(t)+1>=0}function u(n){return!o(n)&&"object"===t(n)}function a(t,n){return t&&t.hasOwnProperty(n)}function s(t,n,e){if(null==t)return t;var i=e||t;if(u(t)){for(var o in t)if(a(t,o)&&!1===n.call(i,t[o],o))break}else if(r(t))for(var l=0;l<t.length&&!1!==n.call(i,t[l],l);l++);return t}function c(t){for(var n=arguments.length,e=Array(n>1?n-1:0),i=1;i<n;i++)e[i-1]=arguments[i];return s(e,function(n){s(n,function(n,e){t[e]=n})}),t}function h(t){return t.replace(/\s*/g,"")||""}function f(t){"undefined"!=typeof console&&"function"==typeof console.error&&console.error(t);try{throw new Error(t)}catch(t){}}function p(t){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null;if(t)return(null==n?_t:n).querySelector(t)}function d(t){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null;if(t)return(null==n?_t:n).querySelectorAll(t)}function v(t,n){for(var e=(t.document||t.ownerDocument).querySelectorAll(n),i=e.length;--i>=0&&e.item(i)!==t;);return i>-1}function g(t){return t===_t.documentElement||t===_t.body}function S(){var t=It.outerWidth,n=It.innerWidth;return t?t/n:1}function y(t){for(var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"y",e=!(arguments.length>2&&void 0!==arguments[2])||arguments[2],i=xt[n],o=t instanceof Element?[t]:d(t),r=[],l=_t.createElement("div"),u=0;u<o.length;u++){var a=o[u];if(a[i]>0?r.push(a):(l.style.width=a.clientWidth+1+"px",l.style.height=a.clientHeight+1+"px",a.appendChild(l),a[i]=1.5/S(),a[i]>0&&r.push(a),a[i]=0,a.removeChild(l)),!e&&r.length>0)break}return r}function m(t,n){var e=y(t,n,!1);return e.length>=1?e[0]:null}function k(t){return null!=t&&t===t.window?t:9===t.nodeType&&t.defaultView}function b(t){return vt(t.scrollHeight,t.clientHeight,t.offsetHeight)}function C(t){return vt(t.scrollWidth,t.clientWidth,t.offsetWidth)}function w(t){return{width:C(t),height:b(t)}}function O(){return{width:vt(C(_t.body),C(_t.documentElement)),height:vt(b(_t.body),b(_t.documentElement))}}function I(t){return g(t)?{viewport:{width:gt(It.innerWidth,_t.documentElement.clientWidth),height:It.innerHeight},size:O()}:{viewport:{width:t.clientWidth,height:t.clientHeight},size:w(t)}}function _(t){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"y",e=k(t);return e?e[Lt[n]]:t[xt[n]]}function x(t,n){var e=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"y",i=k(t),o="y"===e;i?i.scrollTo(o?i[Lt.x]:n,o?n:i[Lt.y]):t[xt[e]]=n}function L(t){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null;if(!t||t&&!t.getClientRects().length)return{top:0,left:0};var e=t.getBoundingClientRect();if(e.width||e.height){var i={},o=null;if(null==n||g(n))o=t.ownerDocument.documentElement,i.top=It.pageYOffset,i.left=It.pageXOffset;else{var r=(o=n).getBoundingClientRect();i.top=-1*r.top+o.scrollTop,i.left=-1*r.left+o.scrollLeft}return{top:e.top+i.top-o.clientTop,left:e.left+i.left-o.clientLeft}}return e}function E(t,n,e){n.split(",").forEach(function(n){t.addEventListener(n.trim(),e,!1)})}function A(t,n,e){n.split(",").forEach(function(n){t.removeEventListener(n.trim(),e,!1)})}function M(t){return t}function R(t,n,e,i,o){return i*(n/=o)*n+e}function T(t,n,e,i,o){return-i*(n/=o)*(n-2)+e}function z(t,n,e,i,o){return(n/=o/2)<1?i/2*n*n+e:-i/2*(--n*(n-2)-1)+e}function q(t,n,e,i,o){return i*(n/=o)*n*n+e}function D(t,n,e,i,o){return i*((n=n/o-1)*n*n+1)+e}function P(t,n,e,i,o){return(n/=o/2)<1?i/2*n*n*n+e:i/2*((n-=2)*n*n+2)+e}function Q(t,n,e,i,o){return i*(n/=o)*n*n*n+e}function W(t,n,e,i,o){return-i*((n=n/o-1)*n*n*n-1)+e}function j(t,n,e,i,o){return(n/=o/2)<1?i/2*n*n*n*n+e:-i/2*((n-=2)*n*n*n-2)+e}function B(t,n,e,i,o){return i*(n/=o)*n*n*n*n+e}function H(t,n,e,i,o){return i*((n=n/o-1)*n*n*n*n+1)+e}function N(t,n,e,i,o){return(n/=o/2)<1?i/2*n*n*n*n*n+e:i/2*((n-=2)*n*n*n*n+2)+e}function F(t,n,e,i,o){return-i*at(n/o*(dt/2))+i+e}function U(t,n,e,i,o){return i*st(n/o*(dt/2))+e}function $(t,n,e,i,o){return-i/2*(at(dt*n/o)-1)+e}function X(t,n,e,i,o){return 0===n?e:i*ct(2,10*(n/o-1))+e}function Y(t,n,e,i,o){return n===o?e+i:i*(1-ct(2,-10*n/o))+e}function J(t,n,e,i,o){return 0===n?e:n===o?e+i:(n/=o/2)<1?i/2*ct(2,10*(n-1))+e:i/2*(2-ct(2,-10*--n))+e}function V(t,n,e,i,o){return-i*(ft(1-(n/=o)*n)-1)+e}function G(t,n,e,i,o){return i*ft(1-(n=n/o-1)*n)+e}function K(t,n,e,i,o){return(n/=o/2)<1?-i/2*(ft(1-n*n)-1)+e:i/2*(ft(1-(n-=2)*n)+1)+e}function Z(t,n,e,i,o){var r=1.70158,l=0,u=i;return 0===n?e:1==(n/=o)?e+i:(l||(l=.3*o),u<ht(i)?(u=i,r=l/4):r=l/(2*dt)*pt(i/u),-u*ct(2,10*(n-=1))*st(2*dt*(n*o-r)/l)+e)}function tt(t,n,e,i,o){var r=1.70158,l=0,u=i;return 0===n?e:1==(n/=o)?e+i:(l||(l=.3*o),u<ht(i)?(u=i,r=l/4):r=l/(2*dt)*pt(i/u),u*ct(2,-10*n)*st(2*dt*(n*o-r)/l)+i+e)}function nt(t,n,e,i,o){var r=1.70158,l=0,u=i;return 0===n?e:2==(n/=o/2)?e+i:(l||(l=o*(.3*1.5)),u<ht(i)?(u=i,r=l/4):r=l/(2*dt)*pt(i/u),n<1?u*ct(2,10*(n-=1))*st(2*dt*(n*o-r)/l)*-.5+e:u*ct(2,-10*(n-=1))*st(2*dt*(n*o-r)/l)*.5+i+e)}function et(t,n,e,i,o){var r=arguments.length>5&&void 0!==arguments[5]?arguments[5]:1.70158;return i*(n/=o)*n*((r+1)*n-r)+e}function it(t,n,e,i,o){var r=arguments.length>5&&void 0!==arguments[5]?arguments[5]:1.70158;return i*((n=n/o-1)*n*((r+1)*n+r)+1)+e}function ot(t,n,e,i,o){var r=arguments.length>5&&void 0!==arguments[5]?arguments[5]:1.70158;return(n/=o/2)<1?i/2*(n*n*((1+(r*=1.525))*n-r))+e:i/2*((n-=2)*n*((1+(r*=1.525))*n+r)+2)+e}function rt(t,n,e,i,o){return(n/=o)<1/2.75?i*(7.5625*n*n)+e:n<2/2.75?i*(7.5625*(n-=1.5/2.75)*n+.75)+e:n<2.5/2.75?i*(7.5625*(n-=2.25/2.75)*n+.9375)+e:i*(7.5625*(n-=2.625/2.75)*n+.984375)+e}function lt(t,n,e,i,o){return i-rt(t,o-n,0,i,o)+e}function ut(t,n,e,i,o){return n<o/2?.5*lt(t,2*n,0,i,o)+e:.5*rt(t,2*n-o,0,i,o)+.5*i+e}var at=Math.cos,st=Math.sin,ct=Math.pow,ht=Math.abs,ft=Math.sqrt,pt=Math.asin,dt=Math.PI,vt=Math.max,gt=Math.min,St=Math.round,yt="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},mt=function(t,n){if(!(t instanceof n))throw new TypeError("Cannot call a class as a function")},kt=function(){function t(t,n){for(var e=0;e<n.length;e++){var i=n[e];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(n,e,i){return e&&t(n.prototype,e),i&&t(n,i),n}}(),bt=ct(2,53)-1,Ct={};["Boolean","Number","String","Function","Array","Object"].forEach(function(t){Ct["[object "+t+"]"]=t.toLowerCase()});var wt=!("undefined"==typeof window||!window.document||!window.document.createElement),Ot=function(){if(!wt)return!1;var t=navigator.userAgent;return(-1===t.indexOf("Android 2.")&&-1===t.indexOf("Android 4.0")||-1===t.indexOf("Mobile Safari")||-1!==t.indexOf("Chrome")||-1!==t.indexOf("Windows Phone"))&&(window.history&&"pushState"in window.history&&"file:"!==window.location.protocol)}(),It=wt?window:null,_t=wt?document:null,xt={y:"scrollTop",x:"scrollLeft"},Lt={y:"pageYOffset",x:"pageXOffset"},Et=Object.freeze({linear:M,InQuad:R,OutQuad:T,InOutQuad:z,InCubic:q,OutCubic:D,InOutCubic:P,InQuart:Q,OutQuart:W,InOutQuart:j,InQuint:B,OutQuint:H,InOutQuint:N,InSine:F,OutSine:U,InOutSine:$,InExpo:X,OutExpo:Y,InOutExpo:J,InCirc:V,OutCirc:G,InOutCirc:K,InElastic:Z,OutElastic:tt,InOutElastic:nt,InBack:et,OutBack:it,InOutBack:ot,OutBounce:rt,InBounce:lt,InOutBounce:ut}),At=["ms","moz","webkit"],Mt=0,Rt=wt?It.requestAnimationFrame:null,Tt=wt?It.cancelAnimationFrame:null;if(wt){for(var zt=0;zt<At.length&&!Rt;++zt)Rt=It[At[zt]+"RequestAnimationFrame"],Tt=It[At[zt]+"CancelAnimationFrame"]||It[At[zt]+"CancelRequestAnimationFrame"];Rt||(Rt=function(t){var n=Date.now(),e=vt(0,16-(n-Mt)),i=setTimeout(function(){t(n+e)},e);return Mt=n+e,i}),Tt||(Tt=function(t){clearTimeout(t)})}var qt=function(){function t(n){mt(this,t),this.el=n,this.props={},this.options={},this.progress=!1,this.easing=null,this.startTime=null,this.rafId=null}return kt(t,[{key:"run",value:function(t,n,e){var o=this;this.progress||(this.props={x:t,y:n},this.options=e,this.easing=i(e.easing)?e.easing:Et[e.easing.replace("ease","")],this.progress=!0,setTimeout(function(){o.startProps=o.calcStartProps(t,n),o.rafId=Rt(function(t){return o._loop(t)})},this.options.delay))}},{key:"stop",value:function(){var t=!(arguments.length>0&&void 0!==arguments[0])||arguments[0],n=this.options.complete;this.startTime=null,this.progress=!1,Tt(this.rafId),t&&(x(this.el,this.props.x,"x"),x(this.el,this.props.y,"y")),i(n)&&(n.call(this),this.options.complete=null)}},{key:"_loop",value:function(t){var n=this;if(this.startTime||(this.startTime=t),!this.progress)return void this.stop(!1);var e=this.el,i=this.props,o=this.options,r=this.startTime,l=this.startProps,u=this.easing,a=o.duration,c=o.step,h={},f=t-r,p=gt(1,vt(f/a,0));s(i,function(t,n){var e=l[n],i=t-e;if(0===i)return!0;var o=u(p,a*p,0,1,a);h[n]=St(e+i*o)}),s(h,function(t,n){x(e,t,n)}),f<=a?(c.call(this,p,h),this.rafId=Rt(function(t){return n._loop(t)})):this.stop(!0)}},{key:"calcStartProps",value:function(t,n){var e={x:_(this.el,"x"),y:_(this.el,"y")};if(this.options.quickMode){var i=I(this.el).viewport,o=i.width,r=i.height;ht(e.y-n)>r&&(e.y=e.y>n?n+r:n-r),ht(e.x-t)>o&&(e.x=e.x>t?t+o:t-o)}return e}}]),t}(),Dt=function(){return wt?"onwheel"in _t?"wheel":"onmousewheel"in _t?"mousewheel":"DOMMouseScroll":"wheel"}()+", touchstart, touchmove",Pt=function(){function t(){var n=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"body, html";mt(this,t),this.isSSR=!wt,this.options=c({},t.defaults,n),this.container=this.getContainer(e),null==this.container?(this.header=null,this.tween=null,this.isSSR||(/comp|inter|loaded/.test(_t.readyState)?this.log('Not found scrollable container. => "'+e+'"'):this.log("Should be initialize later than DOMContentLoaded."))):(this.header=p(this.options.header),this.tween=new qt(this.container),this._trigger=null,this._shouldCallCancelScroll=!1,this.bindContainerClick())}return kt(t,[{key:"log",value:function(t){this.options.outputLog&&f("[SweetScroll] "+t)}},{key:"getScrollOffset",value:function(t,n){var i=this.container,o=this.header,r=this.parseCoodinate(n.offset),l=this.parseCoodinate(t);if(!l&&e(t))if("#"===t)l={top:0,left:0};else{var u=L(p(t),i);if(!u)return;l=u}return l?(r&&(l.top+=r.top,l.left+=r.left),o&&(l.top=vt(0,l.top-w(o).height)),l):null}},{key:"normalizeScrollOffset",value:function(t,n){var e=this.container,i=c({},t),o=I(e),r=o.viewport,l=o.size;return i.top=n.verticalScroll?vt(0,gt(l.height-r.height,i.top)):_(e,"y"),i.left=n.horizontalScroll?vt(0,gt(l.width-r.width,i.left)):_(e,"x"),i}},{key:"to",value:function(t){var n=this,i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};if(!this.isSSR){var o=this.container,r=c({},this.options,i),l=this._trigger,u=e(t)&&/^#/.test(t)?t:null;if(this._options=r,this._trigger=null,this._shouldCallCancelScroll=!1,this.stop(),!o)return this.log("Not found container element.");var a=this.getScrollOffset(t,r);if(!a)return this.log("Invalid parameter of distance. => "+t);if(!1===this.hook(r,"beforeScroll",a,l))return void(this._options=null);a=this.normalizeScrollOffset(a,r),this.tween.run(a.left,a.top,{duration:r.duration,delay:r.delay,easing:r.easing,quickMode:r.quickMode,complete:function(){null!=u&&u!==It.location.hash&&n.updateURLHash(u,r.updateURL),n.unbindContainerStop(),n._options=null,n._shouldCallCancelScroll?n.hook(r,"cancelScroll"):n.hook(r,"afterScroll",a,l),n.hook(r,"completeScroll",n._shouldCallCancelScroll)},step:function(t,e){n.hook(r,"stepScroll",t,e)}}),this.bindContainerStop()}}},{key:"toTop",value:function(t){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};this.to(t,c({},n,{verticalScroll:!0,horizontalScroll:!1}))}},{key:"toLeft",value:function(t){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};this.to(t,c({},n,{verticalScroll:!1,horizontalScroll:!0}))}},{key:"toElement",value:function(t){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};if(!this.isSSR)if(t instanceof Element){var e=L(t,this.container);this.to(e,c({},n))}else this.log("Invalid parameter.")}},{key:"stop",value:function(){var t=arguments.length>0&&void 0!==arguments[0]&&arguments[0];this.isSSR||(this.container?(this._stopScrollListener&&(this._shouldCallCancelScroll=!0),this.tween.stop(t)):this.log("Not found scrollable container."))}},{key:"update",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};this.container?(this.stop(),this.unbindContainerClick(),this.unbindContainerStop(),this.options=c({},this.options,t),this.header=p(this.options.header),this.bindContainerClick()):this.isSSR||this.log("Not found scrollable container.")}},{key:"destroy",value:function(){this.container?(this.stop(),this.unbindContainerClick(),this.unbindContainerStop(),this.container=null,this.header=null,this.tween=null):this.isSSR||this.log("Not found scrollable container.")}},{key:"beforeScroll",value:function(t,n){return!0}},{key:"cancelScroll",value:function(){}},{key:"afterScroll",value:function(t,n){}},{key:"completeScroll",value:function(t){}},{key:"stepScroll",value:function(t,n){}},{key:"parseCoodinate",value:function(t){var n=this._options?this._options.verticalScroll:this.options.verticalScroll,i={top:0,left:0};if(a(t,"top")||a(t,"left"))i=c(i,t);else if(o(t))2===t.length?(i.top=t[0],i.left=t[1]):(i.top=n?t[0]:0,i.left=n?0:t[0]);else if(l(t))i.top=n?t:0,i.left=n?0:t;else{if(!e(t))return null;var r=h(t);if(/^\d+,\d+$/.test(r))r=r.split(","),i.top=r[0],i.left=r[1];else if(/^(top|left):\d+,?(?:(top|left):\d+)?$/.test(r)){var u=r.match(/top:(\d+)/),s=r.match(/left:(\d+)/);i.top=u?u[1]:0,i.left=s?s[1]:0}else{if(!this.container||!/^(\+|-)=(\d+)$/.test(r))return null;var f=_(this.container,n?"y":"x"),p=r.match(/^(\+|-)=(\d+)$/),d=p[1],v=parseInt(p[2],10);"+"===d?(i.top=n?f+v:0,i.left=n?0:f+v):(i.top=n?f-v:0,i.left=n?0:f-v)}}return i.top=parseInt(i.top,10),i.left=parseInt(i.left,10),i}},{key:"updateURLHash",value:function(t,n){!this.isSSR&&Ot&&n&&It.history["replace"===n?"replaceState":"pushState"](null,null,t)}},{key:"getContainer",value:function(t){var n=this.options,e=n.verticalScroll,i=n.horizontalScroll,o=null;return this.isSSR?o:(e&&(o=m(t,"y")),!o&&i&&(o=m(t,"x")),o)}},{key:"bindContainerClick",value:function(){var t=this.container;t&&(this._containerClickListener=this.handleContainerClick.bind(this),E(t,"click",this._containerClickListener))}},{key:"unbindContainerClick",value:function(){var t=this.container;t&&this._containerClickListener&&(A(t,"click",this._containerClickListener),this._containerClickListener=null)}},{key:"bindContainerStop",value:function(){var t=this.container;t&&(this._stopScrollListener=this.handleStopScroll.bind(this),E(t,Dt,this._stopScrollListener))}},{key:"unbindContainerStop",value:function(){var t=this.container;t&&this._stopScrollListener&&(A(t,Dt,this._stopScrollListener),this._stopScrollListener=null)}},{key:"hook",value:function(t,n){for(var e=t[n],o=arguments.length,r=Array(o>2?o-2:0),l=2;l<o;l++)r[l-2]=arguments[l];if(i(e)){var u=e.apply(this,r);if(void 0===u)return u}return this[n].apply(this,r)}},{key:"handleStopScroll",value:function(t){(this._options?this._options.stopScroll:this.options.stopScroll)?this.stop():t.preventDefault()}},{key:"handleContainerClick",value:function(t){for(var n=this.options,e=t.target;e&&e!==_t;e=e.parentNode)if(v(e,n.trigger)){var i=e.getAttribute("data-scroll"),o=this.parseDataOptions(e),r=i||e.getAttribute("href");(n=c({},n,o)).preventDefault&&t.preventDefault(),n.stopPropagation&&t.stopPropagation(),this._trigger=e,n.horizontalScroll&&n.verticalScroll?this.to(r,n):n.verticalScroll?this.toTop(r,n):n.horizontalScroll&&this.toLeft(r,n)}}},{key:"parseDataOptions",value:function(t){var n=t.getAttribute("data-scroll-options");return n?JSON.parse(n):{}}}]),t}();return Pt.defaults={trigger:"[data-scroll]",header:"[data-scroll-header]",duration:1e3,delay:0,easing:"easeOutQuint",offset:0,verticalScroll:!0,horizontalScroll:!1,stopScroll:!0,updateURL:!1,preventDefault:!0,stopPropagation:!0,outputLog:!1,quickMode:!1,beforeScroll:null,afterScroll:null,cancelScroll:null,completeScroll:null,stepScroll:null},Pt});
/*! @preserve sweet-scroll v3.0.0 - tsuyoshiwada | MIT License */
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):t.SweetScroll=e()}(this,function(){"use strict";var t=Object.assign||function(t){for(var e,n=1,o=arguments.length;n<o;n++){e=arguments[n];for(var i in e)Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i])}return t},e=!("undefined"==typeof window||!window.document||!window.document.createElement),n=!!e&&(window.history&&"pushState"in window.history&&"file:"!==window.location.protocol),o=function(){var t=!1;if(!e)return t;try{window.addEventListener("test",null,Object.defineProperty({},"passive",{get:function(){t=!0}}))}catch(t){}return t}(),i=function(t){return"string"==typeof t},r=function(t){return"function"==typeof t},u=function(t){return Array.isArray(t)},l=function(t){return!u(t)&&t-parseFloat(t)+1>=0},a=function(t){return t instanceof Element},c=function(t,e){return t&&t.hasOwnProperty(e)},s=e?window.requestAnimationFrame.bind(window):null,f=e?window.cancelAnimationFrame.bind(window):null,p=Math.cos,h=Math.sin,d=Math.pow,v=Math.sqrt,g=Math.PI,w={linear:function(t){return t},easeInQuad:function(t,e,n,o,i){return o*(e/=i)*e+n},easeOutQuad:function(t,e,n,o,i){return-o*(e/=i)*(e-2)+n},easeInOutQuad:function(t,e,n,o,i){return(e/=i/2)<1?o/2*e*e+n:-o/2*(--e*(e-2)-1)+n},easeInCubic:function(t,e,n,o,i){return o*(e/=i)*e*e+n},easeOutCubic:function(t,e,n,o,i){return o*((e=e/i-1)*e*e+1)+n},easeInOutCubic:function(t,e,n,o,i){return(e/=i/2)<1?o/2*e*e*e+n:o/2*((e-=2)*e*e+2)+n},easeInQuart:function(t,e,n,o,i){return o*(e/=i)*e*e*e+n},easeOutQuart:function(t,e,n,o,i){return-o*((e=e/i-1)*e*e*e-1)+n},easeInOutQuart:function(t,e,n,o,i){return(e/=i/2)<1?o/2*e*e*e*e+n:-o/2*((e-=2)*e*e*e-2)+n},easeInQuint:function(t,e,n,o,i){return o*(e/=i)*e*e*e*e+n},easeOutQuint:function(t,e,n,o,i){return o*((e=e/i-1)*e*e*e*e+1)+n},easeInOutQuint:function(t,e,n,o,i){return(e/=i/2)<1?o/2*e*e*e*e*e+n:o/2*((e-=2)*e*e*e*e+2)+n},easeInSine:function(t,e,n,o,i){return-o*p(e/i*(g/2))+o+n},easeOutSine:function(t,e,n,o,i){return o*h(e/i*(g/2))+n},easeInOutSine:function(t,e,n,o,i){return-o/2*(p(g*e/i)-1)+n},easeInExpo:function(t,e,n,o,i){return 0===e?n:o*d(2,10*(e/i-1))+n},easeOutExpo:function(t,e,n,o,i){return e===i?n+o:o*(1-d(2,-10*e/i))+n},easeInOutExpo:function(t,e,n,o,i){return 0===e?n:e===i?n+o:(e/=i/2)<1?o/2*d(2,10*(e-1))+n:o/2*(2-d(2,-10*--e))+n},easeInCirc:function(t,e,n,o,i){return-o*(v(1-(e/=i)*e)-1)+n},easeOutCirc:function(t,e,n,o,i){return o*v(1-(e=e/i-1)*e)+n},easeInOutCirc:function(t,e,n,o,i){return(e/=i/2)<1?-o/2*(v(1-e*e)-1)+n:o/2*(v(1-(e-=2)*e)+1)+n}},m={y:"scrollTop",x:"scrollLeft"},y={y:"pageYOffset",x:"pageXOffset"},x=function(t,e){return t[m[e]]},b=function(t,e,n){t[m[n]]=e},O=function(t,e){var n=t.getBoundingClientRect();if(n.width||n.height){var o={top:0,left:0},i=void 0;if(C(e))i=document.documentElement,o.top=window[y.y],o.left=window[y.x];else{i=e;var r=i.getBoundingClientRect();o.top=-1*r.top+i[m.y],o.left=-1*r.left+i[m.x]}return{top:n.top+o.top-i.clientTop,left:n.left+o.left-i.clientLeft}}return n},M=function(t){return Array.prototype.slice.call(t?document.querySelectorAll(t):[])},$=function(t){return M(t).shift()||null},E=function(t,e){if(a(e))return t===e;for(var n=M(e),o=n.length;--o>=0&&n[o]!==t;);return o>-1},C=function(t){return t===document.documentElement||t===document.body},I=function(t,e){for(var n=m[e],o=a(t)?[t]:M(t),i=document.createElement("div"),r=0;r<o.length;r+=1){var u=o[r],l=null;if(u[n]>0)l=u;else{var c=window.outerWidth,s=window.innerWidth,f=c?c/s:1;i.style.width=u.clientWidth+1+"px",i.style.height=u.clientHeight+1+"px",u.appendChild(i),u[n]=1.5/f,u[n]>0&&(l=u),u[n]=0,u.removeChild(i)}if(l)return l}return null},k=function(t){return Math.max(t.scrollHeight,t.clientHeight,t.offsetHeight)},S=function(t){return Math.max(t.scrollWidth,t.clientWidth,t.offsetWidth)},A=function(t){return{width:S(t),height:k(t)}},P=function(t){var e=C(t);return{viewport:{width:e?Math.min(window.innerWidth,document.documentElement.clientWidth):t.clientWidth,height:e?window.innerHeight:t.clientHeight},size:e?{width:Math.max(S(document.body),S(document.documentElement)),height:Math.max(k(document.body),k(document.documentElement))}:A(t)}},Q=function(){return e?"onwheel"in document?"wheel":"mousewheel":"wheel"}(),L=function(t){return"wheel"===t?Q:t},W=function(t,e,n,i,r){n.split(" ").forEach(function(n){t[e](L(n),i,!!o&&{passive:r})})},z=function(t,e,n,o){W(t,"addEventListener",e,n,o)},H=function(t,e,n,o){W(t,"removeEventListener",e,n,o)},j=/^(\+|-)=(\d+(?:\.\d+)?)$/,q=function(e,n){var o={top:0,left:0,relative:!1};if(c(e,"top")||c(e,"left"))o=t({},o,e);else if(u(e))if(e.length>1)o.top=e[0],o.left=e[1];else{if(1!==e.length)return null;o.top=n?e[0]:0,o.left=n?0:e[0]}else if(l(e))n?o.top=e:o.left=e;else{if(!i(e))return null;var r=e.trim().match(j);if(!r)return null;var a=r[1],s=parseInt(r[2],10);"+"===a?(o.top=n?s:0,o.left=n?0:s):(o.top=n?-s:0,o.left=n?0:-s),o.relative=!0}return o},D={trigger:"[data-scroll]",header:"[data-scroll-header]",duration:1e3,easing:"easeOutQuint",offset:0,vertical:!0,horizontal:!1,cancellable:!0,updateURL:!1,preventDefault:!0,stopPropagation:!0,quickMode:!1,before:null,after:null,cancel:null,complete:null,step:null};return function(){function o(n,i){var r=this;this.ctx={$trigger:null,opts:null,progress:!1,pos:null,startPos:null,easing:null,start:0,id:0,cancel:!1,hash:null},this.loop=function(t){var e=r,n=e.$el,i=e.ctx;if(i.start||(i.start=t),!i.progress||!n)return void r.stop();var u=i.opts,l=i.pos,a=i.start,c=i.startPos,s=i.easing,f=u.duration,p={top:"y",left:"x"},h=t-a,d=Math.min(1,Math.max(h/f,0));Object.keys(l).forEach(function(t){var e=l[t],o=c[t],i=e-o;if(0!==i){var r=s(d,f*d,0,1,f);b(n,Math.round(o+i*r),p[t])}}),h<=f?(r.hook(u,"step",d),i.id=o.raf(r.loop)):r.stop(!0)},this.handleClick=function(e){for(var n=r.opts,o=e.target;o&&o!==document;o=o.parentNode)if(E(o,n.trigger)){var i=JSON.parse(o.getAttribute("data-scroll-options")||"{}"),u=o.getAttribute("data-scroll"),l=u||o.getAttribute("href"),a=t({},n,i),c=a.preventDefault,s=a.stopPropagation,f=a.vertical,p=a.horizontal;c&&e.preventDefault(),s&&e.stopPropagation(),r.ctx.$trigger=o,p&&f?r.to(l,a):f?r.toTop(l,a):p&&r.toLeft(l,a)}},this.handleStop=function(t){var e=r.ctx,n=e.opts;n&&n.cancellable?(e.cancel=!0,r.stop()):t.preventDefault()};var u=t({},D,n||{}),l=u.vertical,a=u.horizontal,c=void 0===i?"body,html":i,s=null;e&&(l&&(s=I(c,"y")),!s&&a&&(s=I(c,"x"))),s&&(this.opts=u,this.$el=s,this.bind(!0,!1))}return o.create=function(t,e){return new o(t,e)},o.prototype.to=function(n,o){if(e){var r=this,u=r.$el,l=r.ctx,c=r.opts,s=l.$trigger,f=t({},c,o||{}),p=f.offset,h=f.vertical,d=f.horizontal,v=a(f.header)?f.header:$(f.header),g=i(n)&&/^#/.test(n)?n:null;if(l.opts=f,l.cancel=!1,l.hash=g,this.stop(),u){var w=q(p,h),m=q(n,h),y={top:0,left:0};if(m)if(m.relative){var b=x(u,h?"y":"x");y.top=h?b+m.top:m.top,y.left=h?m.left:b+m.left}else y=m;else if(i(n)&&"#"!==n){var M=$(n);if(!M)return;y=O(M,u)}w&&(y.top+=w.top,y.left+=w.left),v&&(y.top=Math.max(0,y.top-A(v).height));var E=P(u),C=E.viewport,I=E.size;if(y.top=h?Math.max(0,Math.min(I.height-C.height,y.top)):x(u,"y"),y.left=d?Math.max(0,Math.min(I.width-C.width,y.left)):x(u,"x"),!1===this.hook(f,"before",y,s))return void(l.opts=null);l.pos=y,this.start(f),this.bind(!1,!0)}}},o.prototype.toTop=function(e,n){this.to(e,t({},n||{},{vertical:!0,horizontal:!1}))},o.prototype.toLeft=function(e,n){this.to(e,t({},n||{},{vertical:!1,horizontal:!0}))},o.prototype.toElement=function(t,n){var o=this.$el;e&&o&&this.to(O(t,o),n||{})},o.prototype.stop=function(t){void 0===t&&(t=!1);var e=this,n=e.$el,i=e.ctx,r=i.pos;n&&i.progress&&(o.caf(i.id),i.progress=!1,i.start=0,i.id=0,t&&r&&(b(n,r.left,"x"),b(n,r.top,"y")),this.complete())},o.prototype.update=function(e){if(this.$el){var n=t({},this.opts,e);this.stop(),this.unbind(!0,!0),this.opts=n,this.bind(!0,!1)}},o.prototype.destroy=function(){this.$el&&(this.stop(),this.unbind(!0,!0),this.$el=null)},o.prototype.onBefore=function(t,e){return!0},o.prototype.onStep=function(t){},o.prototype.onAfter=function(t,e){},o.prototype.onCancel=function(){},o.prototype.onComplete=function(t){},o.prototype.start=function(t){var e=this.ctx;e.opts=t,e.progress=!0,e.easing=r(t.easing)?t.easing:w[t.easing];var n=this.$el,i=e.pos,u={top:x(n,"y"),left:x(n,"x")};if(t.quickMode){var l=P(n).viewport,a=l.width,c=l.height;Math.abs(u.top-i.top)>c&&(u.top=u.top>i.top?i.top+c:i.top-c),Math.abs(u.left-i.left)>a&&(u.left=u.left>i.left?i.left+a:i.left-a)}e.startPos=u,e.id=o.raf(this.loop)},o.prototype.complete=function(){var t=this,o=t.$el,i=t.ctx,r=i.hash,u=i.cancel,l=i.opts,a=i.pos,c=i.$trigger;if(o&&l){if(null!=r&&r!==window.location.hash){var s=l.updateURL;e&&n&&!1!==s&&window.history["replace"===s?"replaceState":"pushState"](null,"",r)}this.unbind(!1,!0),i.opts=null,i.$trigger=null,u?this.hook(l,"cancel"):this.hook(l,"after",a,c),this.hook(l,"complete",u)}},o.prototype.hook=function(t,e){for(var n=[],o=2;o<arguments.length;o++)n[o-2]=arguments[o];var i,u,l=t[e];return r(l)&&(i=l.apply(this,n.concat([this]))),u=this["on"+(e[0].toUpperCase()+e.slice(1))].apply(this,n),void 0!==i?i:u},o.prototype.bind=function(t,e){var n=this,o=n.$el,i=n.ctx.opts;o&&(t&&z(o,"click",this.handleClick,!1),e&&z(o,"wheel touchstart touchmove",this.handleStop,!i||i.cancellable))},o.prototype.unbind=function(t,e){var n=this,o=n.$el,i=n.ctx.opts;o&&(t&&H(o,"click",this.handleClick,!1),e&&H(o,"wheel touchstart touchmove",this.handleStop,!i||i.cancellable))},o.raf=s,o.caf=f,o}()});
src/dom.js
src/easings.js
src/elements.js
src/events.js
src/math.js
src/request-animation-frame.js
src/scroll-tween.js
src/selectors.js
src/supports.js
src/sweet-scroll.js
src/utils.js
test/fixtures/sweet-scroll.html
test/sweet-scroll.spec.js
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc