├── .editorconfig
├── .gitignore
├── .npmignore
├── .prettierignore
├── LICENSE.md
├── README.md
├── assets
├── airbnb.png
├── cnn.png
├── htc.png
├── nhl.png
├── snapguide.png
└── thinkgeek.png
├── package-lock.json
├── package.json
├── style.css
├── swipe.js
├── swipe.min.js
└── test.html
/.editorconfig:
--------------------------------------------------------------------------------
1 | # http://editorconfig.org
2 | root = true
3 |
4 | [*]
5 | indent_style = space
6 | indent_size = 2
7 | end_of_line = lf
8 | charset = utf-8
9 | trim_trailing_whitespace = true
10 | insert_final_newline = true
11 |
12 | [*.md]
13 | trim_trailing_whitespace = false
14 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | .DS_Store
2 | node_modules
3 | *.log
4 |
--------------------------------------------------------------------------------
/.npmignore:
--------------------------------------------------------------------------------
1 | assets
2 | test.html
3 |
--------------------------------------------------------------------------------
/.prettierignore:
--------------------------------------------------------------------------------
1 | swipe.min.js
2 |
--------------------------------------------------------------------------------
/LICENSE.md:
--------------------------------------------------------------------------------
1 | The MIT License (MIT)
2 |
3 | Copyright (c) 2013-2015 Brad Birdsall
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in
13 | all copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
21 | THE SOFTWARE.
22 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # Universal (a.k.a isomorphic) Swipe.js
2 |
3 | [](http://badge.fury.io/js/swipe-js-iso)
4 | [](http://www.npmjs.com/package/swipe-js-iso)
5 |
6 |
7 | > Fork of original [Swipe](https://github.com/thebird/Swipe) in order to be published to NPM (has no deps) and being compatible with universal apps.
8 |
9 | # Install
10 |
11 | ```bash
12 | npm install swipe-js-iso --save
13 | ```
14 |
15 | **✅ PRO HINT:** Use [ReactSwipe](https://github.com/jed/react-swipe) component
16 |
17 | ## Usage
18 |
19 | Swipe only needs to follow a simple layout pattern. Here is an example:
20 |
21 | ```html
22 |
29 | ```
30 |
31 | Above is the initial required structure – a series of elements wrapped in two containers. Place any content you want within the items. The containing div will need to be passed to the Swipe function like so:
32 |
33 | ```js
34 | const mySwipe = Swipe(document.getElementById('slider'));
35 | ```
36 |
37 | I always place this at the bottom of the page, externally, to verify the page is ready.
38 |
39 | Also Swipe needs just a few styles added to your stylesheet:
40 |
41 | ```css
42 | .swipe {
43 | overflow: hidden;
44 | visibility: hidden;
45 | position: relative;
46 | }
47 | .swipe-wrap {
48 | overflow: hidden;
49 | position: relative;
50 | }
51 | .swipe-wrap > div {
52 | float: left;
53 | width: 100%;
54 | position: relative;
55 | }
56 | ```
57 |
58 | ## Config Options
59 |
60 | Swipe can take an optional second parameter– an object of key/value settings:
61 |
62 | - **startSlide** Integer _(default:0)_ - index position Swipe should start at
63 |
64 | - **speed** Integer _(default:300)_ - speed of prev and next transitions in milliseconds.
65 |
66 | - **widthOfSiblingSlidePreview** Integer - Width of next and previous slide preview in pixels
67 |
68 | - **auto** Integer - begin with auto slideshow (time in milliseconds between slides)
69 |
70 | - **continuous** Boolean _(default:true)_ - create an infinite feel with no endpoints
71 |
72 | - **disableScroll** Boolean _(default:false)_ - stop any touches on this container from scrolling the page
73 |
74 | - **stopPropagation** Boolean _(default:false)_ - stop event propagation
75 |
76 | - **swiping** Function - invoked while swiping with the percentage (0-1) of the full width that has been swiped.
77 |
78 | - **callback** Function - runs at slide change.
79 |
80 | - **transitionEnd** Function - runs at the end slide transition.
81 |
82 | ### Example
83 |
84 | ```js
85 | const mySwipe = new Swipe(document.getElementById('slider'), {
86 | startSlide: 2,
87 | speed: 400,
88 | widthOfSiblingSlidePreview: 10,
89 | auto: 3000,
90 | continuous: true,
91 | disableScroll: false,
92 | stopPropagation: false,
93 | callback: function(index, elem) {},
94 | transitionEnd: function(index, elem) {}
95 | });
96 | ```
97 |
98 | ## Swipe API
99 |
100 | Swipe exposes a few functions that can be useful for script control of your slider.
101 |
102 | `prev()` slide to prev
103 |
104 | `next()` slide to next
105 |
106 | `getPos()` returns current slide index position
107 |
108 | `getNumSlides()` returns the total amount of slides
109 |
110 | `slide(index, duration)` slide to set index position (duration: speed of transition in milliseconds)
111 |
112 | `disableScrolling(disableScroll)` directly control scrolling (disableScroll: same as the config option )
113 |
114 | ## Browser Support
115 |
116 | Swipe is now compatible with all browsers, including IE7+. Swipe works best on devices that support CSS transforms and touch, but can be used without these as well. A few helper methods determine touch and CSS transition support and choose the proper animation methods accordingly.
117 |
118 | ## Who's using Swipe
119 |
120 |
121 |
122 |
123 |
124 |
125 |
126 |
127 | ---
128 |
129 | **MIT License**
130 |
--------------------------------------------------------------------------------
/assets/airbnb.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/voronianski/swipe-js-iso/6b7ee33d22b333e70746d3dde1507ee90e19386c/assets/airbnb.png
--------------------------------------------------------------------------------
/assets/cnn.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/voronianski/swipe-js-iso/6b7ee33d22b333e70746d3dde1507ee90e19386c/assets/cnn.png
--------------------------------------------------------------------------------
/assets/htc.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/voronianski/swipe-js-iso/6b7ee33d22b333e70746d3dde1507ee90e19386c/assets/htc.png
--------------------------------------------------------------------------------
/assets/nhl.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/voronianski/swipe-js-iso/6b7ee33d22b333e70746d3dde1507ee90e19386c/assets/nhl.png
--------------------------------------------------------------------------------
/assets/snapguide.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/voronianski/swipe-js-iso/6b7ee33d22b333e70746d3dde1507ee90e19386c/assets/snapguide.png
--------------------------------------------------------------------------------
/assets/thinkgeek.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/voronianski/swipe-js-iso/6b7ee33d22b333e70746d3dde1507ee90e19386c/assets/thinkgeek.png
--------------------------------------------------------------------------------
/package-lock.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "swipe-js-iso",
3 | "version": "2.1.6",
4 | "lockfileVersion": 1,
5 | "requires": true,
6 | "dependencies": {
7 | "ansi-styles": {
8 | "version": "3.2.1",
9 | "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
10 | "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
11 | "dev": true,
12 | "requires": {
13 | "color-convert": "1.9.3"
14 | }
15 | },
16 | "builtin-modules": {
17 | "version": "1.1.1",
18 | "resolved": "https://registry.npmjs.org/builtin-modules/-/builtin-modules-1.1.1.tgz",
19 | "integrity": "sha1-Jw8HbFpywC9bZaR9+Uxf46J4iS8=",
20 | "dev": true
21 | },
22 | "caller-callsite": {
23 | "version": "2.0.0",
24 | "resolved": "https://registry.npmjs.org/caller-callsite/-/caller-callsite-2.0.0.tgz",
25 | "integrity": "sha1-hH4PzgoiN1CpoCfFSzNzGtMVQTQ=",
26 | "dev": true,
27 | "requires": {
28 | "callsites": "2.0.0"
29 | }
30 | },
31 | "caller-path": {
32 | "version": "2.0.0",
33 | "resolved": "https://registry.npmjs.org/caller-path/-/caller-path-2.0.0.tgz",
34 | "integrity": "sha1-Ro+DBE42mrIBD6xfBs7uFbsssfQ=",
35 | "dev": true,
36 | "requires": {
37 | "caller-callsite": "2.0.0"
38 | }
39 | },
40 | "callsites": {
41 | "version": "2.0.0",
42 | "resolved": "http://registry.npmjs.org/callsites/-/callsites-2.0.0.tgz",
43 | "integrity": "sha1-BuuE8A7qQT2oav/vrL/7Ngk7PFA=",
44 | "dev": true
45 | },
46 | "chalk": {
47 | "version": "2.4.1",
48 | "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.1.tgz",
49 | "integrity": "sha512-ObN6h1v2fTJSmUXoS3nMQ92LbDK9be4TV+6G+omQlGJFdcUX5heKi1LZ1YnRMIgwTLEj3E24bT6tYni50rlCfQ==",
50 | "dev": true,
51 | "requires": {
52 | "ansi-styles": "3.2.1",
53 | "escape-string-regexp": "1.0.5",
54 | "supports-color": "5.5.0"
55 | }
56 | },
57 | "ci-info": {
58 | "version": "1.6.0",
59 | "resolved": "https://registry.npmjs.org/ci-info/-/ci-info-1.6.0.tgz",
60 | "integrity": "sha512-vsGdkwSCDpWmP80ncATX7iea5DWQemg1UgCW5J8tqjU3lYw4FBYuj89J0CTVomA7BEfvSZd84GmHko+MxFQU2A==",
61 | "dev": true
62 | },
63 | "color-convert": {
64 | "version": "1.9.3",
65 | "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
66 | "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==",
67 | "dev": true,
68 | "requires": {
69 | "color-name": "1.1.3"
70 | }
71 | },
72 | "color-name": {
73 | "version": "1.1.3",
74 | "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
75 | "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU=",
76 | "dev": true
77 | },
78 | "commander": {
79 | "version": "2.17.1",
80 | "resolved": "https://registry.npmjs.org/commander/-/commander-2.17.1.tgz",
81 | "integrity": "sha512-wPMUt6FnH2yzG95SA6mzjQOEKUU3aLaDEmzs1ti+1E9h+CsrZghRlqEM/EJ4KscsQVG8uNN4uVreUeT8+drlgg==",
82 | "dev": true
83 | },
84 | "cosmiconfig": {
85 | "version": "5.0.7",
86 | "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-5.0.7.tgz",
87 | "integrity": "sha512-PcLqxTKiDmNT6pSpy4N6KtuPwb53W+2tzNvwOZw0WH9N6O0vLIBq0x8aj8Oj75ere4YcGi48bDFCL+3fRJdlNA==",
88 | "dev": true,
89 | "requires": {
90 | "import-fresh": "2.0.0",
91 | "is-directory": "0.3.1",
92 | "js-yaml": "3.12.0",
93 | "parse-json": "4.0.0"
94 | },
95 | "dependencies": {
96 | "argparse": {
97 | "version": "1.0.10",
98 | "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.10.tgz",
99 | "integrity": "sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==",
100 | "dev": true,
101 | "requires": {
102 | "sprintf-js": "1.0.3"
103 | }
104 | },
105 | "esprima": {
106 | "version": "4.0.1",
107 | "resolved": "https://registry.npmjs.org/esprima/-/esprima-4.0.1.tgz",
108 | "integrity": "sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A==",
109 | "dev": true
110 | },
111 | "js-yaml": {
112 | "version": "3.12.0",
113 | "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.12.0.tgz",
114 | "integrity": "sha512-PIt2cnwmPfL4hKNwqeiuz4bKfnzHTBv6HyVgjahA6mPLwPDzjDWrplJBMjHUFxku/N3FlmrbyPclad+I+4mJ3A==",
115 | "dev": true,
116 | "requires": {
117 | "argparse": "1.0.10",
118 | "esprima": "4.0.1"
119 | }
120 | }
121 | }
122 | },
123 | "cross-spawn": {
124 | "version": "6.0.5",
125 | "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-6.0.5.tgz",
126 | "integrity": "sha512-eTVLrBSt7fjbDygz805pMnstIs2VTBNkRm0qxZd+M7A5XDdxVRWO5MxGBXZhjY4cqLYLdtrGqRf8mBPmzwSpWQ==",
127 | "dev": true,
128 | "requires": {
129 | "nice-try": "1.0.5",
130 | "path-key": "2.0.1",
131 | "semver": "5.6.0",
132 | "shebang-command": "1.2.0",
133 | "which": "1.3.1"
134 | },
135 | "dependencies": {
136 | "which": {
137 | "version": "1.3.1",
138 | "resolved": "https://registry.npmjs.org/which/-/which-1.3.1.tgz",
139 | "integrity": "sha512-HxJdYWq1MTIQbJ3nw0cqssHoTNU267KlrDuGZ1WYlxDStUtKUhOaJmh112/TZmHxxUfuJqPXSOm7tDyas0OSIQ==",
140 | "dev": true,
141 | "requires": {
142 | "isexe": "2.0.0"
143 | }
144 | }
145 | }
146 | },
147 | "end-of-stream": {
148 | "version": "1.4.1",
149 | "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.4.1.tgz",
150 | "integrity": "sha512-1MkrZNvWTKCaigbn+W15elq2BB/L22nqrSY5DKlo3X6+vclJm8Bb5djXJBmEX6fS3+zCh/F4VBK5Z2KxJt4s2Q==",
151 | "dev": true,
152 | "requires": {
153 | "once": "1.4.0"
154 | }
155 | },
156 | "error-ex": {
157 | "version": "1.3.2",
158 | "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.2.tgz",
159 | "integrity": "sha512-7dFHNmqeFSEt2ZBsCriorKnn3Z2pj+fd9kmI6QoWw4//DL+icEBfc0U7qJCisqrTsKTjw4fNFy2pW9OqStD84g==",
160 | "dev": true,
161 | "requires": {
162 | "is-arrayish": "0.2.1"
163 | }
164 | },
165 | "escape-string-regexp": {
166 | "version": "1.0.5",
167 | "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
168 | "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=",
169 | "dev": true
170 | },
171 | "execa": {
172 | "version": "1.0.0",
173 | "resolved": "https://registry.npmjs.org/execa/-/execa-1.0.0.tgz",
174 | "integrity": "sha512-adbxcyWV46qiHyvSp50TKt05tB4tK3HcmF7/nxfAdhnox83seTDbwnaqKO4sXRy7roHAIFqJP/Rw/AuEbX61LA==",
175 | "dev": true,
176 | "requires": {
177 | "cross-spawn": "6.0.5",
178 | "get-stream": "4.1.0",
179 | "is-stream": "1.1.0",
180 | "npm-run-path": "2.0.2",
181 | "p-finally": "1.0.0",
182 | "signal-exit": "3.0.2",
183 | "strip-eof": "1.0.0"
184 | }
185 | },
186 | "find-up": {
187 | "version": "3.0.0",
188 | "resolved": "https://registry.npmjs.org/find-up/-/find-up-3.0.0.tgz",
189 | "integrity": "sha512-1yD6RmLI1XBfxugvORwlck6f75tYL+iR0jqwsOrOxMZyGYqUuDhJ0l4AXdO1iX/FTs9cBAMEk1gWSEx1kSbylg==",
190 | "dev": true,
191 | "requires": {
192 | "locate-path": "3.0.0"
193 | }
194 | },
195 | "get-stdin": {
196 | "version": "6.0.0",
197 | "resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-6.0.0.tgz",
198 | "integrity": "sha512-jp4tHawyV7+fkkSKyvjuLZswblUtz+SQKzSWnBbii16BuZksJlU1wuBYXY75r+duh/llF1ur6oNwi+2ZzjKZ7g==",
199 | "dev": true
200 | },
201 | "get-stream": {
202 | "version": "4.1.0",
203 | "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-4.1.0.tgz",
204 | "integrity": "sha512-GMat4EJ5161kIy2HevLlr4luNjBgvmj413KaQA7jt4V8B4RDsfpHk7WQ9GVqfYyyx8OS/L66Kox+rJRNklLK7w==",
205 | "dev": true,
206 | "requires": {
207 | "pump": "3.0.0"
208 | }
209 | },
210 | "has-flag": {
211 | "version": "3.0.0",
212 | "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
213 | "integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0=",
214 | "dev": true
215 | },
216 | "hosted-git-info": {
217 | "version": "2.7.1",
218 | "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.7.1.tgz",
219 | "integrity": "sha512-7T/BxH19zbcCTa8XkMlbK5lTo1WtgkFi3GvdWEyNuc4Vex7/9Dqbnpsf4JMydcfj9HCg4zUWFTL3Za6lapg5/w==",
220 | "dev": true
221 | },
222 | "husky": {
223 | "version": "1.2.0",
224 | "resolved": "https://registry.npmjs.org/husky/-/husky-1.2.0.tgz",
225 | "integrity": "sha512-/ib3+iycykXC0tYIxsyqierikVa9DA2DrT32UEirqNEFVqOj1bFMTgP3jAz8HM7FgC/C8pc/BTUa9MV2GEkZaA==",
226 | "dev": true,
227 | "requires": {
228 | "cosmiconfig": "5.0.7",
229 | "execa": "1.0.0",
230 | "find-up": "3.0.0",
231 | "get-stdin": "6.0.0",
232 | "is-ci": "1.2.1",
233 | "pkg-dir": "3.0.0",
234 | "please-upgrade-node": "3.1.1",
235 | "read-pkg": "4.0.1",
236 | "run-node": "1.0.0",
237 | "slash": "2.0.0"
238 | }
239 | },
240 | "ignore": {
241 | "version": "3.3.10",
242 | "resolved": "https://registry.npmjs.org/ignore/-/ignore-3.3.10.tgz",
243 | "integrity": "sha512-Pgs951kaMm5GXP7MOvxERINe3gsaVjUWFm+UZPSq9xYriQAksyhg0csnS0KXSNRD5NmNdapXEpjxG49+AKh/ug==",
244 | "dev": true
245 | },
246 | "import-fresh": {
247 | "version": "2.0.0",
248 | "resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-2.0.0.tgz",
249 | "integrity": "sha1-2BNVwVYS04bGH53dOSLUMEgipUY=",
250 | "dev": true,
251 | "requires": {
252 | "caller-path": "2.0.0",
253 | "resolve-from": "3.0.0"
254 | }
255 | },
256 | "is-arrayish": {
257 | "version": "0.2.1",
258 | "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz",
259 | "integrity": "sha1-d8mYQFJ6qOyxqLppe4BkWnqSap0=",
260 | "dev": true
261 | },
262 | "is-builtin-module": {
263 | "version": "1.0.0",
264 | "resolved": "http://registry.npmjs.org/is-builtin-module/-/is-builtin-module-1.0.0.tgz",
265 | "integrity": "sha1-VAVy0096wxGfj3bDDLwbHgN6/74=",
266 | "dev": true,
267 | "requires": {
268 | "builtin-modules": "1.1.1"
269 | }
270 | },
271 | "is-ci": {
272 | "version": "1.2.1",
273 | "resolved": "https://registry.npmjs.org/is-ci/-/is-ci-1.2.1.tgz",
274 | "integrity": "sha512-s6tfsaQaQi3JNciBH6shVqEDvhGut0SUXr31ag8Pd8BBbVVlcGfWhpPmEOoM6RJ5TFhbypvf5yyRw/VXW1IiWg==",
275 | "dev": true,
276 | "requires": {
277 | "ci-info": "1.6.0"
278 | }
279 | },
280 | "is-directory": {
281 | "version": "0.3.1",
282 | "resolved": "https://registry.npmjs.org/is-directory/-/is-directory-0.3.1.tgz",
283 | "integrity": "sha1-YTObbyR1/Hcv2cnYP1yFddwVSuE=",
284 | "dev": true
285 | },
286 | "is-stream": {
287 | "version": "1.1.0",
288 | "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-1.1.0.tgz",
289 | "integrity": "sha1-EtSj3U5o4Lec6428hBc66A2RykQ=",
290 | "dev": true
291 | },
292 | "isexe": {
293 | "version": "2.0.0",
294 | "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
295 | "integrity": "sha1-6PvzdNxVb/iUehDcsFctYz8s+hA=",
296 | "dev": true
297 | },
298 | "json-parse-better-errors": {
299 | "version": "1.0.2",
300 | "resolved": "https://registry.npmjs.org/json-parse-better-errors/-/json-parse-better-errors-1.0.2.tgz",
301 | "integrity": "sha512-mrqyZKfX5EhL7hvqcV6WG1yYjnjeuYDzDhhcAAUrq8Po85NBQBJP+ZDUT75qZQ98IkUoBqdkExkukOU7Ts2wrw==",
302 | "dev": true
303 | },
304 | "locate-path": {
305 | "version": "3.0.0",
306 | "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-3.0.0.tgz",
307 | "integrity": "sha512-7AO748wWnIhNqAuaty2ZWHkQHRSNfPVIsPIfwEOWO22AmaoVrWavlOcMR5nzTLNYvp36X220/maaRsrec1G65A==",
308 | "dev": true,
309 | "requires": {
310 | "p-locate": "3.0.0",
311 | "path-exists": "3.0.0"
312 | }
313 | },
314 | "mri": {
315 | "version": "1.1.1",
316 | "resolved": "https://registry.npmjs.org/mri/-/mri-1.1.1.tgz",
317 | "integrity": "sha1-haom09ru7t+A3FmEr5XMXKXK2fE=",
318 | "dev": true
319 | },
320 | "nice-try": {
321 | "version": "1.0.5",
322 | "resolved": "https://registry.npmjs.org/nice-try/-/nice-try-1.0.5.tgz",
323 | "integrity": "sha512-1nh45deeb5olNY7eX82BkPO7SSxR5SSYJiPTrTdFUVYwAl8CKMA5N9PjTYkHiRjisVcxcQ1HXdLhx2qxxJzLNQ==",
324 | "dev": true
325 | },
326 | "normalize-package-data": {
327 | "version": "2.4.0",
328 | "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.4.0.tgz",
329 | "integrity": "sha512-9jjUFbTPfEy3R/ad/2oNbKtW9Hgovl5O1FvFWKkKblNXoN/Oou6+9+KKohPK13Yc3/TyunyWhJp6gvRNR/PPAw==",
330 | "dev": true,
331 | "requires": {
332 | "hosted-git-info": "2.7.1",
333 | "is-builtin-module": "1.0.0",
334 | "semver": "5.6.0",
335 | "validate-npm-package-license": "3.0.4"
336 | }
337 | },
338 | "npm-run-path": {
339 | "version": "2.0.2",
340 | "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-2.0.2.tgz",
341 | "integrity": "sha1-NakjLfo11wZ7TLLd8jV7GHFTbF8=",
342 | "dev": true,
343 | "requires": {
344 | "path-key": "2.0.1"
345 | }
346 | },
347 | "once": {
348 | "version": "1.4.0",
349 | "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
350 | "integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E=",
351 | "dev": true,
352 | "requires": {
353 | "wrappy": "1.0.2"
354 | }
355 | },
356 | "p-finally": {
357 | "version": "1.0.0",
358 | "resolved": "https://registry.npmjs.org/p-finally/-/p-finally-1.0.0.tgz",
359 | "integrity": "sha1-P7z7FbiZpEEjs0ttzBi3JDNqLK4=",
360 | "dev": true
361 | },
362 | "p-limit": {
363 | "version": "2.0.0",
364 | "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-2.0.0.tgz",
365 | "integrity": "sha512-fl5s52lI5ahKCernzzIyAP0QAZbGIovtVHGwpcu1Jr/EpzLVDI2myISHwGqK7m8uQFugVWSrbxH7XnhGtvEc+A==",
366 | "dev": true,
367 | "requires": {
368 | "p-try": "2.0.0"
369 | }
370 | },
371 | "p-locate": {
372 | "version": "3.0.0",
373 | "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-3.0.0.tgz",
374 | "integrity": "sha512-x+12w/To+4GFfgJhBEpiDcLozRJGegY+Ei7/z0tSLkMmxGZNybVMSfWj9aJn8Z5Fc7dBUNJOOVgPv2H7IwulSQ==",
375 | "dev": true,
376 | "requires": {
377 | "p-limit": "2.0.0"
378 | }
379 | },
380 | "p-try": {
381 | "version": "2.0.0",
382 | "resolved": "https://registry.npmjs.org/p-try/-/p-try-2.0.0.tgz",
383 | "integrity": "sha512-hMp0onDKIajHfIkdRk3P4CdCmErkYAxxDtP3Wx/4nZ3aGlau2VKh3mZpcuFkH27WQkL/3WBCPOktzA9ZOAnMQQ==",
384 | "dev": true
385 | },
386 | "parse-json": {
387 | "version": "4.0.0",
388 | "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-4.0.0.tgz",
389 | "integrity": "sha1-vjX1Qlvh9/bHRxhPmKeIy5lHfuA=",
390 | "dev": true,
391 | "requires": {
392 | "error-ex": "1.3.2",
393 | "json-parse-better-errors": "1.0.2"
394 | }
395 | },
396 | "path-exists": {
397 | "version": "3.0.0",
398 | "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-3.0.0.tgz",
399 | "integrity": "sha1-zg6+ql94yxiSXqfYENe1mwEP1RU=",
400 | "dev": true
401 | },
402 | "path-key": {
403 | "version": "2.0.1",
404 | "resolved": "https://registry.npmjs.org/path-key/-/path-key-2.0.1.tgz",
405 | "integrity": "sha1-QRyttXTFoUDTpLGRDUDYDMn0C0A=",
406 | "dev": true
407 | },
408 | "pify": {
409 | "version": "3.0.0",
410 | "resolved": "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz",
411 | "integrity": "sha1-5aSs0sEB/fPZpNB/DbxNtJ3SgXY=",
412 | "dev": true
413 | },
414 | "pkg-dir": {
415 | "version": "3.0.0",
416 | "resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-3.0.0.tgz",
417 | "integrity": "sha512-/E57AYkoeQ25qkxMj5PBOVgF8Kiu/h7cYS30Z5+R7WaiCCBfLq58ZI/dSeaEKb9WVJV5n/03QwrN3IeWIFllvw==",
418 | "dev": true,
419 | "requires": {
420 | "find-up": "3.0.0"
421 | }
422 | },
423 | "please-upgrade-node": {
424 | "version": "3.1.1",
425 | "resolved": "https://registry.npmjs.org/please-upgrade-node/-/please-upgrade-node-3.1.1.tgz",
426 | "integrity": "sha512-KY1uHnQ2NlQHqIJQpnh/i54rKkuxCEBx+voJIS/Mvb+L2iYd2NMotwduhKTMjfC1uKoX3VXOxLjIYG66dfJTVQ==",
427 | "dev": true,
428 | "requires": {
429 | "semver-compare": "1.0.0"
430 | }
431 | },
432 | "prettier": {
433 | "version": "1.15.2",
434 | "resolved": "https://registry.npmjs.org/prettier/-/prettier-1.15.2.tgz",
435 | "integrity": "sha512-YgPLFFA0CdKL4Eg2IHtUSjzj/BWgszDHiNQAe0VAIBse34148whfdzLagRL+QiKS+YfK5ftB6X4v/MBw8yCoug==",
436 | "dev": true
437 | },
438 | "pretty-quick": {
439 | "version": "1.8.0",
440 | "resolved": "https://registry.npmjs.org/pretty-quick/-/pretty-quick-1.8.0.tgz",
441 | "integrity": "sha512-qV25sQF/ivJpdZ5efwemQYkQJa7sp3HqT/Vf/7z5vGYMcq1VrT2lDpFKAxJPf6219N1YAdR8mGkIhPAZ1odTmQ==",
442 | "dev": true,
443 | "requires": {
444 | "chalk": "2.4.1",
445 | "execa": "0.8.0",
446 | "find-up": "2.1.0",
447 | "ignore": "3.3.10",
448 | "mri": "1.1.1"
449 | },
450 | "dependencies": {
451 | "cross-spawn": {
452 | "version": "5.1.0",
453 | "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-5.1.0.tgz",
454 | "integrity": "sha1-6L0O/uWPz/b4+UUQoKVUu/ojVEk=",
455 | "dev": true,
456 | "requires": {
457 | "lru-cache": "4.1.4",
458 | "shebang-command": "1.2.0",
459 | "which": "1.3.1"
460 | }
461 | },
462 | "execa": {
463 | "version": "0.8.0",
464 | "resolved": "https://registry.npmjs.org/execa/-/execa-0.8.0.tgz",
465 | "integrity": "sha1-2NdrvBtVIX7RkP1t1J08d07PyNo=",
466 | "dev": true,
467 | "requires": {
468 | "cross-spawn": "5.1.0",
469 | "get-stream": "3.0.0",
470 | "is-stream": "1.1.0",
471 | "npm-run-path": "2.0.2",
472 | "p-finally": "1.0.0",
473 | "signal-exit": "3.0.2",
474 | "strip-eof": "1.0.0"
475 | }
476 | },
477 | "find-up": {
478 | "version": "2.1.0",
479 | "resolved": "https://registry.npmjs.org/find-up/-/find-up-2.1.0.tgz",
480 | "integrity": "sha1-RdG35QbHF93UgndaK3eSCjwMV6c=",
481 | "dev": true,
482 | "requires": {
483 | "locate-path": "2.0.0"
484 | }
485 | },
486 | "get-stream": {
487 | "version": "3.0.0",
488 | "resolved": "http://registry.npmjs.org/get-stream/-/get-stream-3.0.0.tgz",
489 | "integrity": "sha1-jpQ9E1jcN1VQVOy+LtsFqhdO3hQ=",
490 | "dev": true
491 | },
492 | "locate-path": {
493 | "version": "2.0.0",
494 | "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-2.0.0.tgz",
495 | "integrity": "sha1-K1aLJl7slExtnA3pw9u7ygNUzY4=",
496 | "dev": true,
497 | "requires": {
498 | "p-locate": "2.0.0",
499 | "path-exists": "3.0.0"
500 | }
501 | },
502 | "lru-cache": {
503 | "version": "4.1.4",
504 | "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.1.4.tgz",
505 | "integrity": "sha512-EPstzZ23znHUVLKj+lcXO1KvZkrlw+ZirdwvOmnAnA/1PB4ggyXJ77LRkCqkff+ShQ+cqoxCxLQOh4cKITO5iA==",
506 | "dev": true,
507 | "requires": {
508 | "pseudomap": "1.0.2",
509 | "yallist": "3.0.2"
510 | }
511 | },
512 | "p-limit": {
513 | "version": "1.3.0",
514 | "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-1.3.0.tgz",
515 | "integrity": "sha512-vvcXsLAJ9Dr5rQOPk7toZQZJApBl2K4J6dANSsEuh6QI41JYcsS/qhTGa9ErIUUgK3WNQoJYvylxvjqmiqEA9Q==",
516 | "dev": true,
517 | "requires": {
518 | "p-try": "1.0.0"
519 | }
520 | },
521 | "p-locate": {
522 | "version": "2.0.0",
523 | "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-2.0.0.tgz",
524 | "integrity": "sha1-IKAQOyIqcMj9OcwuWAaA893l7EM=",
525 | "dev": true,
526 | "requires": {
527 | "p-limit": "1.3.0"
528 | }
529 | },
530 | "p-try": {
531 | "version": "1.0.0",
532 | "resolved": "https://registry.npmjs.org/p-try/-/p-try-1.0.0.tgz",
533 | "integrity": "sha1-y8ec26+P1CKOE/Yh8rGiN8GyB7M=",
534 | "dev": true
535 | },
536 | "which": {
537 | "version": "1.3.1",
538 | "resolved": "https://registry.npmjs.org/which/-/which-1.3.1.tgz",
539 | "integrity": "sha512-HxJdYWq1MTIQbJ3nw0cqssHoTNU267KlrDuGZ1WYlxDStUtKUhOaJmh112/TZmHxxUfuJqPXSOm7tDyas0OSIQ==",
540 | "dev": true,
541 | "requires": {
542 | "isexe": "2.0.0"
543 | }
544 | }
545 | }
546 | },
547 | "pseudomap": {
548 | "version": "1.0.2",
549 | "resolved": "https://registry.npmjs.org/pseudomap/-/pseudomap-1.0.2.tgz",
550 | "integrity": "sha1-8FKijacOYYkX7wqKw0wa5aaChrM=",
551 | "dev": true
552 | },
553 | "pump": {
554 | "version": "3.0.0",
555 | "resolved": "https://registry.npmjs.org/pump/-/pump-3.0.0.tgz",
556 | "integrity": "sha512-LwZy+p3SFs1Pytd/jYct4wpv49HiYCqd9Rlc5ZVdk0V+8Yzv6jR5Blk3TRmPL1ft69TxP0IMZGJ+WPFU2BFhww==",
557 | "dev": true,
558 | "requires": {
559 | "end-of-stream": "1.4.1",
560 | "once": "1.4.0"
561 | }
562 | },
563 | "read-pkg": {
564 | "version": "4.0.1",
565 | "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-4.0.1.tgz",
566 | "integrity": "sha1-ljYlN48+HE1IyFhytabsfV0JMjc=",
567 | "dev": true,
568 | "requires": {
569 | "normalize-package-data": "2.4.0",
570 | "parse-json": "4.0.0",
571 | "pify": "3.0.0"
572 | }
573 | },
574 | "resolve-from": {
575 | "version": "3.0.0",
576 | "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-3.0.0.tgz",
577 | "integrity": "sha1-six699nWiBvItuZTM17rywoYh0g=",
578 | "dev": true
579 | },
580 | "run-node": {
581 | "version": "1.0.0",
582 | "resolved": "https://registry.npmjs.org/run-node/-/run-node-1.0.0.tgz",
583 | "integrity": "sha512-kc120TBlQ3mih1LSzdAJXo4xn/GWS2ec0l3S+syHDXP9uRr0JAT8Qd3mdMuyjqCzeZktgP3try92cEgf9Nks8A==",
584 | "dev": true
585 | },
586 | "semver": {
587 | "version": "5.6.0",
588 | "resolved": "https://registry.npmjs.org/semver/-/semver-5.6.0.tgz",
589 | "integrity": "sha512-RS9R6R35NYgQn++fkDWaOmqGoj4Ek9gGs+DPxNUZKuwE183xjJroKvyo1IzVFeXvUrvmALy6FWD5xrdJT25gMg==",
590 | "dev": true
591 | },
592 | "semver-compare": {
593 | "version": "1.0.0",
594 | "resolved": "https://registry.npmjs.org/semver-compare/-/semver-compare-1.0.0.tgz",
595 | "integrity": "sha1-De4hahyUGrN+nvsXiPavxf9VN/w=",
596 | "dev": true
597 | },
598 | "shebang-command": {
599 | "version": "1.2.0",
600 | "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-1.2.0.tgz",
601 | "integrity": "sha1-RKrGW2lbAzmJaMOfNj/uXer98eo=",
602 | "dev": true,
603 | "requires": {
604 | "shebang-regex": "1.0.0"
605 | }
606 | },
607 | "shebang-regex": {
608 | "version": "1.0.0",
609 | "resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-1.0.0.tgz",
610 | "integrity": "sha1-2kL0l0DAtC2yypcoVxyxkMmO/qM=",
611 | "dev": true
612 | },
613 | "signal-exit": {
614 | "version": "3.0.2",
615 | "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.2.tgz",
616 | "integrity": "sha1-tf3AjxKH6hF4Yo5BXiUTK3NkbG0=",
617 | "dev": true
618 | },
619 | "slash": {
620 | "version": "2.0.0",
621 | "resolved": "https://registry.npmjs.org/slash/-/slash-2.0.0.tgz",
622 | "integrity": "sha512-ZYKh3Wh2z1PpEXWr0MpSBZ0V6mZHAQfYevttO11c51CaWjGTaadiKZ+wVt1PbMlDV5qhMFslpZCemhwOK7C89A==",
623 | "dev": true
624 | },
625 | "source-map": {
626 | "version": "0.6.1",
627 | "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
628 | "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
629 | "dev": true
630 | },
631 | "spdx-correct": {
632 | "version": "3.0.2",
633 | "resolved": "https://registry.npmjs.org/spdx-correct/-/spdx-correct-3.0.2.tgz",
634 | "integrity": "sha512-q9hedtzyXHr5S0A1vEPoK/7l8NpfkFYTq6iCY+Pno2ZbdZR6WexZFtqeVGkGxW3TEJMN914Z55EnAGMmenlIQQ==",
635 | "dev": true,
636 | "requires": {
637 | "spdx-expression-parse": "3.0.0",
638 | "spdx-license-ids": "3.0.2"
639 | }
640 | },
641 | "spdx-exceptions": {
642 | "version": "2.2.0",
643 | "resolved": "https://registry.npmjs.org/spdx-exceptions/-/spdx-exceptions-2.2.0.tgz",
644 | "integrity": "sha512-2XQACfElKi9SlVb1CYadKDXvoajPgBVPn/gOQLrTvHdElaVhr7ZEbqJaRnJLVNeaI4cMEAgVCeBMKF6MWRDCRA==",
645 | "dev": true
646 | },
647 | "spdx-expression-parse": {
648 | "version": "3.0.0",
649 | "resolved": "https://registry.npmjs.org/spdx-expression-parse/-/spdx-expression-parse-3.0.0.tgz",
650 | "integrity": "sha512-Yg6D3XpRD4kkOmTpdgbUiEJFKghJH03fiC1OPll5h/0sO6neh2jqRDVHOQ4o/LMea0tgCkbMgea5ip/e+MkWyg==",
651 | "dev": true,
652 | "requires": {
653 | "spdx-exceptions": "2.2.0",
654 | "spdx-license-ids": "3.0.2"
655 | }
656 | },
657 | "spdx-license-ids": {
658 | "version": "3.0.2",
659 | "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-3.0.2.tgz",
660 | "integrity": "sha512-qky9CVt0lVIECkEsYbNILVnPvycuEBkXoMFLRWsREkomQLevYhtRKC+R91a5TOAQ3bCMjikRwhyaRqj1VYatYg==",
661 | "dev": true
662 | },
663 | "sprintf-js": {
664 | "version": "1.0.3",
665 | "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
666 | "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw=",
667 | "dev": true
668 | },
669 | "strip-eof": {
670 | "version": "1.0.0",
671 | "resolved": "http://registry.npmjs.org/strip-eof/-/strip-eof-1.0.0.tgz",
672 | "integrity": "sha1-u0P/VZim6wXYm1n80SnJgzE2Br8=",
673 | "dev": true
674 | },
675 | "supports-color": {
676 | "version": "5.5.0",
677 | "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
678 | "integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==",
679 | "dev": true,
680 | "requires": {
681 | "has-flag": "3.0.0"
682 | }
683 | },
684 | "uglify-js": {
685 | "version": "3.4.9",
686 | "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.4.9.tgz",
687 | "integrity": "sha512-8CJsbKOtEbnJsTyv6LE6m6ZKniqMiFWmm9sRbopbkGs3gMPPfd3Fh8iIA4Ykv5MgaTbqHr4BaoGLJLZNhsrW1Q==",
688 | "dev": true,
689 | "requires": {
690 | "commander": "2.17.1",
691 | "source-map": "0.6.1"
692 | }
693 | },
694 | "validate-npm-package-license": {
695 | "version": "3.0.4",
696 | "resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.4.tgz",
697 | "integrity": "sha512-DpKm2Ui/xN7/HQKCtpZxoRWBhZ9Z0kqtygG8XCgNQ8ZlDnxuQmWhj566j8fN4Cu3/JmbhsDo7fcAJq4s9h27Ew==",
698 | "dev": true,
699 | "requires": {
700 | "spdx-correct": "3.0.2",
701 | "spdx-expression-parse": "3.0.0"
702 | }
703 | },
704 | "wrappy": {
705 | "version": "1.0.2",
706 | "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
707 | "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=",
708 | "dev": true
709 | },
710 | "yallist": {
711 | "version": "3.0.2",
712 | "resolved": "https://registry.npmjs.org/yallist/-/yallist-3.0.2.tgz",
713 | "integrity": "sha1-hFK0u36Dx8GI2AQcGoN8dz1ti7k=",
714 | "dev": true
715 | }
716 | }
717 | }
718 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "swipe-js-iso",
3 | "version": "2.1.6",
4 | "main": "./swipe.js",
5 | "scripts": {
6 | "build": "uglifyjs -m reserved=[\"Swipe\"] -o ./swipe.min.js ./swipe.js ",
7 | "prepublishOnly": "npm run build"
8 | },
9 | "repository": {
10 | "type": "git",
11 | "url": "git+https://github.com/voronianski/swipe-js-iso.git"
12 | },
13 | "license": "MIT",
14 | "homepage": "https://github.com/voronianski/swipe-js-iso#readme",
15 | "dependencies": {},
16 | "prettier": {
17 | "singleQuote": true
18 | },
19 | "husky": {
20 | "hooks": {
21 | "pre-commit": "pretty-quick --staged --ignore-path ./public"
22 | }
23 | },
24 | "devDependencies": {
25 | "husky": "^1.2.0",
26 | "prettier": "^1.15.2",
27 | "pretty-quick": "^1.8.0",
28 | "uglify-js": "^3.4.9"
29 | },
30 | "engines": {
31 | "node": ">=8.0.0",
32 | "npm": ">=5.5.1"
33 | }
34 | }
35 |
--------------------------------------------------------------------------------
/style.css:
--------------------------------------------------------------------------------
1 | html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, del, dfn, em, img, ins, kbd, q, samp, small, strong, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, table, tbody, tfoot, thead, tr, th, td, article, aside, footer, header, nav, section {
2 | margin:0;
3 | padding:0;
4 | border:0;
5 | outline:0;
6 | font-size:100%;
7 | vertical-align:baseline;
8 | background:transparent;
9 | }
10 | body {
11 | -webkit-text-size-adjust:none;
12 | font-family:sans-serif;
13 | min-height:416px;
14 | }
15 | h1 {
16 | font-size:33px;
17 | margin:50px 0 15px;
18 | text-align:center;
19 | color:#212121;
20 | }
21 | h2 {
22 | font-size:14px;
23 | font-weight:bold;
24 | color:#3c3c3c;
25 | margin:20px 10px 10px;
26 | }
27 | small {
28 | margin:0 10px 30px;
29 | display:block;
30 | font-size:12px;
31 | }
32 | a {
33 | margin:0 0 0 10px;
34 | font-size:12px;
35 | color:#3c3c3c;
36 | }
37 |
38 |
39 | html, body {
40 | background: #f3f3f3;
41 | }
42 |
43 | #console {
44 | font-size: 12px;
45 | font-family:"Inconsolata", "Monaco", "Consolas", "Andale Mono", "Bitstream Vera Sans Mono", "Courier New", Courier, monospace;
46 | color: #999;
47 | line-height: 18px;
48 | margin-top: 20px;
49 | max-height: 150px;
50 | overflow: auto;
51 | }
52 |
53 | #mySwipe div b {
54 | display:block;
55 | font-weight:bold;
56 | color:#14ADE5;
57 | font-size:20px;
58 | text-align:center;
59 | margin:10px;
60 | padding:100px 10px;
61 | box-shadow: 0 1px #EBEBEB;
62 | background: #fff;
63 | border-radius: 3px;
64 | border: 1px solid;
65 | border-color: #E5E5E5 #D3D3D3 #B9C1C6;
66 | }
67 |
--------------------------------------------------------------------------------
/swipe.js:
--------------------------------------------------------------------------------
1 | /*
2 | * Swipe 2.0.0
3 | * Brad Birdsall
4 | * https://github.com/thebird/Swipe
5 | * Copyright 2013-2015, MIT License
6 | *
7 | */
8 |
9 | (function(root, factory) {
10 | if (typeof module !== 'undefined' && module.exports) {
11 | module.exports = factory();
12 | } else {
13 | root.Swipe = factory();
14 | }
15 | })(this, function() {
16 | 'use strict';
17 |
18 | return function Swipe(container, options) {
19 | // utilities
20 | var noop = function() {}; // simple no operation function
21 | var offloadFn = function(fn) {
22 | setTimeout(fn || noop, 0);
23 | }; // offload a functions execution
24 |
25 | // check browser capabilities
26 | var browser = {
27 | addEventListener: !!window.addEventListener,
28 | touch:
29 | 'ontouchstart' in window ||
30 | (window.DocumentTouch && document instanceof window.DocumentTouch),
31 | transitions: (function(temp) {
32 | var props = [
33 | 'transitionProperty',
34 | 'WebkitTransition',
35 | 'MozTransition',
36 | 'OTransition',
37 | 'msTransition'
38 | ];
39 | for (var i in props)
40 | if (temp.style[props[i]] !== undefined) return true;
41 | return false;
42 | })(document.createElement('swipe'))
43 | };
44 |
45 | // quit if no root element
46 | if (!container) return;
47 | var element = container.children[0];
48 | var slides, slidePos, width, length;
49 | options = options || {};
50 | var index = parseInt(options.startSlide, 10) || 0;
51 | var speed = options.speed || 300;
52 | var widthOfSiblingSlidePreview =
53 | parseInt(options.widthOfSiblingSlidePreview, 10) || 0;
54 | var continuous = (options.continuous =
55 | options.continuous !== undefined ? options.continuous : true);
56 |
57 | function setup() {
58 | // cache slides
59 | slides = element.children;
60 | length = slides.length;
61 |
62 | // set continuous to false if only one slide
63 | continuous = slides.length < 2 ? false : options.continuous;
64 |
65 | // create an array to store current positions of each slide
66 | slidePos = new Array(slides.length);
67 |
68 | // determine width of each slide
69 | width =
70 | Math.round(
71 | container.getBoundingClientRect().width || container.offsetWidth
72 | ) -
73 | widthOfSiblingSlidePreview * 2;
74 |
75 | element.style.width = slides.length * width + 'px';
76 |
77 | // stack elements
78 | var pos = slides.length;
79 | while (pos--) {
80 | var slide = slides[pos];
81 |
82 | slide.style.width = width + 'px';
83 | slide.setAttribute('data-index', pos);
84 |
85 | if (browser.transitions) {
86 | slide.style.left = pos * -width + widthOfSiblingSlidePreview + 'px';
87 | move(pos, index > pos ? -width : index < pos ? width : 0, 0);
88 | }
89 | }
90 |
91 | // reposition elements before and after index
92 | if (continuous && browser.transitions) {
93 | move(circle(index - 1), -width, 0);
94 | move(circle(index + 1), width, 0);
95 | }
96 |
97 | if (!browser.transitions)
98 | element.style.left = index * -width + widthOfSiblingSlidePreview + 'px';
99 |
100 | container.style.visibility = 'visible';
101 | }
102 |
103 | function prev() {
104 | if (continuous) slide(index - 1);
105 | else if (index) slide(index - 1);
106 | }
107 |
108 | function next() {
109 | if (continuous) slide(index + 1);
110 | else if (index < slides.length - 1) slide(index + 1);
111 | }
112 |
113 | function circle(index) {
114 | // a simple positive modulo using slides.length
115 | return (slides.length + (index % slides.length)) % slides.length;
116 | }
117 |
118 | function slide(to, slideSpeed) {
119 | // do nothing if already on requested slide
120 | if (index == to) return;
121 |
122 | if (browser.transitions) {
123 | var direction = Math.abs(index - to) / (index - to); // 1: backward, -1: forward
124 |
125 | // get the actual position of the slide
126 | if (continuous) {
127 | var natural_direction = direction;
128 | direction = -slidePos[circle(to)] / width;
129 |
130 | // if going forward but to < index, use to = slides.length + to
131 | // if going backward but to > index, use to = -slides.length + to
132 | if (direction !== natural_direction)
133 | to = -direction * slides.length + to;
134 | }
135 |
136 | var diff = Math.abs(index - to) - 1;
137 |
138 | // move all the slides between index and to in the right direction
139 | while (diff--)
140 | move(
141 | circle((to > index ? to : index) - diff - 1),
142 | width * direction,
143 | 0
144 | );
145 |
146 | to = circle(to);
147 |
148 | move(index, width * direction, slideSpeed || speed);
149 | move(to, 0, slideSpeed || speed);
150 |
151 | if (continuous) move(circle(to - direction), -(width * direction), 0); // we need to get the next in place
152 | } else {
153 | to = circle(to);
154 | animate(index * -width, to * -width, slideSpeed || speed);
155 | //no fallback for a circular continuous if the browser does not accept transitions
156 | }
157 |
158 | index = to;
159 | offloadFn(options.callback && options.callback(index, slides[index]));
160 | }
161 |
162 | function move(index, dist, speed) {
163 | translate(index, dist, speed);
164 | slidePos[index] = dist;
165 | }
166 |
167 | function translate(index, dist, speed) {
168 | var slide = slides[index];
169 | var style = slide && slide.style;
170 |
171 | if (!style) return;
172 |
173 | style.webkitTransitionDuration = style.MozTransitionDuration = style.msTransitionDuration = style.OTransitionDuration = style.transitionDuration =
174 | speed + 'ms';
175 |
176 | style.webkitTransform = 'translate(' + dist + 'px,0)' + 'translateZ(0)';
177 | style.msTransform = style.MozTransform = style.OTransform =
178 | 'translateX(' + dist + 'px)';
179 | }
180 |
181 | function animate(from, to, speed) {
182 | // if not an animation, just reposition
183 | if (!speed) {
184 | element.style.left = to + 'px';
185 | return;
186 | }
187 |
188 | var start = +new Date();
189 |
190 | var timer = setInterval(function() {
191 | var timeElap = +new Date() - start;
192 |
193 | if (timeElap > speed) {
194 | element.style.left = to + 'px';
195 |
196 | if (delay) begin();
197 |
198 | options.transitionEnd &&
199 | options.transitionEnd.call(event, index, slides[index]);
200 |
201 | clearInterval(timer);
202 | return;
203 | }
204 |
205 | element.style.left =
206 | (to - from) * (Math.floor((timeElap / speed) * 100) / 100) +
207 | from +
208 | 'px';
209 | }, 4);
210 | }
211 |
212 | // setup auto slideshow
213 | var delay = options.auto || 0;
214 | var interval;
215 |
216 | function begin() {
217 | clearTimeout(interval);
218 | interval = setTimeout(next, delay);
219 | }
220 |
221 | function stop() {
222 | delay = options.auto || 0;
223 | clearTimeout(interval);
224 | }
225 |
226 | // setup initial vars
227 | var start = {};
228 | var delta = {};
229 | var isScrolling;
230 |
231 | // setup event capturing
232 | var events = {
233 | handleEvent: function(event) {
234 | switch (event.type) {
235 | case 'touchstart':
236 | this.start(event);
237 | break;
238 | case 'touchmove':
239 | this.move(event);
240 | break;
241 | case 'touchend':
242 | offloadFn(this.end(event));
243 | break;
244 | case 'webkitTransitionEnd':
245 | case 'msTransitionEnd':
246 | case 'oTransitionEnd':
247 | case 'otransitionend':
248 | case 'transitionend':
249 | offloadFn(this.transitionEnd(event));
250 | break;
251 | case 'resize':
252 | offloadFn(setup);
253 | break;
254 | }
255 |
256 | if (options.stopPropagation) event.stopPropagation();
257 | },
258 | start: function(event) {
259 | var touches = event.touches[0];
260 |
261 | // measure start values
262 | start = {
263 | // get initial touch coords
264 | x: touches.pageX,
265 | y: touches.pageY,
266 |
267 | // store time to determine touch duration
268 | time: +new Date()
269 | };
270 |
271 | // used for testing first move event
272 | isScrolling = undefined;
273 |
274 | // reset delta and end measurements
275 | delta = {};
276 |
277 | // attach touchmove and touchend listeners
278 | element.addEventListener('touchmove', this, false);
279 | element.addEventListener('touchend', this, false);
280 | },
281 | move: function(event) {
282 | // ensure swiping with one touch and not pinching
283 | if (event.touches.length > 1 || (event.scale && event.scale !== 1))
284 | return;
285 |
286 | if (options.disableScroll) return;
287 |
288 | var touches = event.touches[0];
289 |
290 | // measure change in x and y
291 | delta = {
292 | x: touches.pageX - start.x,
293 | y: touches.pageY - start.y
294 | };
295 |
296 | // determine if scrolling test has run - one time test
297 | if (typeof isScrolling == 'undefined') {
298 | isScrolling = !!(
299 | isScrolling || Math.abs(delta.x) < Math.abs(delta.y)
300 | );
301 | }
302 |
303 | // if user is not trying to scroll vertically
304 | if (!isScrolling) {
305 | // prevent native scrolling
306 | event.preventDefault();
307 |
308 | // stop slideshow
309 | stop();
310 |
311 | // increase resistance if first or last slide
312 | if (continuous) {
313 | // we don't add resistance at the end
314 |
315 | translate(
316 | circle(index - 1),
317 | delta.x + slidePos[circle(index - 1)],
318 | 0
319 | );
320 | translate(index, delta.x + slidePos[index], 0);
321 | translate(
322 | circle(index + 1),
323 | delta.x + slidePos[circle(index + 1)],
324 | 0
325 | );
326 | } else {
327 | delta.x =
328 | delta.x /
329 | ((!index && delta.x > 0) || // if first slide and sliding left
330 | (index == slides.length - 1 && // or if last slide and sliding right
331 | delta.x < 0) // and if sliding at all
332 | ? Math.abs(delta.x) / width + 1 // determine resistance level
333 | : 1); // no resistance if false
334 |
335 | // translate 1:1
336 | translate(index - 1, delta.x + slidePos[index - 1], 0);
337 | translate(index, delta.x + slidePos[index], 0);
338 | translate(index + 1, delta.x + slidePos[index + 1], 0);
339 | }
340 | options.swiping && options.swiping(-delta.x / width);
341 | }
342 | },
343 | end: function(event) {
344 | // measure duration
345 | var duration = +new Date() - start.time;
346 |
347 | // determine if slide attempt triggers next/prev slide
348 | var isValidSlide =
349 | (Number(duration) < 250 && // if slide duration is less than 250ms
350 | Math.abs(delta.x) > 20) || // and if slide amt is greater than 20px
351 | Math.abs(delta.x) > width / 2; // or if slide amt is greater than half the width
352 |
353 | // determine if slide attempt is past start and end
354 | var isPastBounds =
355 | (!index && delta.x > 0) || // if first slide and slide amt is greater than 0
356 | (index == slides.length - 1 && delta.x < 0); // or if last slide and slide amt is less than 0
357 |
358 | if (continuous) isPastBounds = false;
359 |
360 | // determine direction of swipe (true:right, false:left)
361 | var direction = delta.x < 0;
362 |
363 | // if not scrolling vertically
364 | if (!isScrolling) {
365 | if (isValidSlide && !isPastBounds) {
366 | if (direction) {
367 | if (continuous) {
368 | // we need to get the next in this direction in place
369 |
370 | move(circle(index - 1), -width, 0);
371 | move(circle(index + 2), width, 0);
372 | } else {
373 | move(index - 1, -width, 0);
374 | }
375 |
376 | move(index, slidePos[index] - width, speed);
377 | move(
378 | circle(index + 1),
379 | slidePos[circle(index + 1)] - width,
380 | speed
381 | );
382 | index = circle(index + 1);
383 | } else {
384 | if (continuous) {
385 | // we need to get the next in this direction in place
386 |
387 | move(circle(index + 1), width, 0);
388 | move(circle(index - 2), -width, 0);
389 | } else {
390 | move(index + 1, width, 0);
391 | }
392 |
393 | move(index, slidePos[index] + width, speed);
394 | move(
395 | circle(index - 1),
396 | slidePos[circle(index - 1)] + width,
397 | speed
398 | );
399 | index = circle(index - 1);
400 | }
401 |
402 | options.callback && options.callback(index, slides[index]);
403 | } else {
404 | if (continuous) {
405 | move(circle(index - 1), -width, speed);
406 | move(index, 0, speed);
407 | move(circle(index + 1), width, speed);
408 | } else {
409 | move(index - 1, -width, speed);
410 | move(index, 0, speed);
411 | move(index + 1, width, speed);
412 | }
413 | }
414 | }
415 |
416 | // kill touchmove and touchend event listeners until touchstart called again
417 | element.removeEventListener('touchmove', events, false);
418 | element.removeEventListener('touchend', events, false);
419 | element.removeEventListener('touchforcechange', function() {}, false);
420 | },
421 | transitionEnd: function(event) {
422 | if (parseInt(event.target.getAttribute('data-index'), 10) == index) {
423 | if (delay) begin();
424 |
425 | options.transitionEnd &&
426 | options.transitionEnd.call(event, index, slides[index]);
427 | }
428 | }
429 | };
430 |
431 | // trigger setup
432 | setup();
433 |
434 | // start auto slideshow if applicable
435 | if (delay) begin();
436 |
437 | // add event listeners
438 | if (browser.addEventListener) {
439 | // set touchstart event on element
440 | if (browser.touch) {
441 | element.addEventListener('touchstart', events, false);
442 | element.addEventListener('touchforcechange', function() {}, false);
443 | }
444 |
445 | if (browser.transitions) {
446 | element.addEventListener('webkitTransitionEnd', events, false);
447 | element.addEventListener('msTransitionEnd', events, false);
448 | element.addEventListener('oTransitionEnd', events, false);
449 | element.addEventListener('otransitionend', events, false);
450 | element.addEventListener('transitionend', events, false);
451 | }
452 |
453 | // set resize event on window
454 | window.addEventListener('resize', events, false);
455 | } else {
456 | window.onresize = function() {
457 | setup();
458 | }; // to play nice with old IE
459 | }
460 |
461 | // expose the Swipe API
462 | return {
463 | setup: function() {
464 | setup();
465 | },
466 | slide: function(to, speed) {
467 | // cancel slideshow
468 | stop();
469 |
470 | slide(to, speed);
471 | },
472 | prev: function() {
473 | // cancel slideshow
474 | stop();
475 |
476 | prev();
477 | },
478 | next: function() {
479 | // cancel slideshow
480 | stop();
481 |
482 | next();
483 | },
484 | stop: function() {
485 | // cancel slideshow
486 | stop();
487 | },
488 | getPos: function() {
489 | // return current index position
490 | return index;
491 | },
492 | getNumSlides: function() {
493 | // return total number of slides
494 | return length;
495 | },
496 | kill: function() {
497 | // cancel slideshow
498 | stop();
499 |
500 | // reset element
501 | element.style.width = '';
502 | element.style.left = '';
503 |
504 | // reset slides
505 | var pos = slides.length;
506 | while (pos--) {
507 | var slide = slides[pos];
508 | slide.style.width = '';
509 | slide.style.left = '';
510 |
511 | if (browser.transitions) translate(pos, 0, 0);
512 | }
513 |
514 | // removed event listeners
515 | if (browser.addEventListener) {
516 | // remove current event listeners
517 | element.removeEventListener('touchstart', events, false);
518 | element.removeEventListener('webkitTransitionEnd', events, false);
519 | element.removeEventListener('msTransitionEnd', events, false);
520 | element.removeEventListener('oTransitionEnd', events, false);
521 | element.removeEventListener('otransitionend', events, false);
522 | element.removeEventListener('transitionend', events, false);
523 | window.removeEventListener('resize', events, false);
524 | } else {
525 | window.onresize = null;
526 | }
527 | }
528 | };
529 | };
530 | });
531 |
--------------------------------------------------------------------------------
/swipe.min.js:
--------------------------------------------------------------------------------
1 | (function(e,t){if(typeof module!=="undefined"&&module.exports){module.exports=t()}else{e.Swipe=t()}})(this,function(){"use strict";return function Swipe(n,r){var t=function(){};var s=function(e){setTimeout(e||t,0)};var o={addEventListener:!!window.addEventListener,touch:"ontouchstart"in window||window.DocumentTouch&&document instanceof window.DocumentTouch,transitions:function(e){var t=["transitionProperty","WebkitTransition","MozTransition","OTransition","msTransition"];for(var n in t)if(e.style[t[n]]!==undefined)return true;return false}(document.createElement("swipe"))};if(!n)return;var f=n.children[0];var l,u,d,i;r=r||{};var c=parseInt(r.startSlide,10)||0;var v=r.speed||300;var a=parseInt(r.widthOfSiblingSlidePreview,10)||0;var h=r.continuous=r.continuous!==undefined?r.continuous:true;function m(){l=f.children;i=l.length;h=l.length<2?false:r.continuous;u=new Array(l.length);d=Math.round(n.getBoundingClientRect().width||n.offsetWidth)-a*2;f.style.width=l.length*d+"px";var e=l.length;while(e--){var t=l[e];t.style.width=d+"px";t.setAttribute("data-index",e);if(o.transitions){t.style.left=e*-d+a+"px";x(e,c>e?-d:cc?e:c)-a-1),d*n,0);e=E(e);x(c,d*n,t||v);x(e,0,t||v);if(h)x(E(e-n),-(d*n),0)}else{e=E(e);b(c*-d,e*-d,t||v)}c=e;s(r.callback&&r.callback(c,l[c]))}function x(e,t,n){g(e,t,n);u[e]=t}function g(e,t,n){var i=l[e];var a=i&&i.style;if(!a)return;a.webkitTransitionDuration=a.MozTransitionDuration=a.msTransitionDuration=a.OTransitionDuration=a.transitionDuration=n+"ms";a.webkitTransform="translate("+t+"px,0)"+"translateZ(0)";a.msTransform=a.MozTransform=a.OTransform="translateX("+t+"px)"}function b(t,n,i){if(!i){f.style.left=n+"px";return}var a=+new Date;var s=setInterval(function(){var e=+new Date-a;if(e>i){f.style.left=n+"px";if(T)L();r.transitionEnd&&r.transitionEnd.call(event,c,l[c]);clearInterval(s);return}f.style.left=(n-t)*(Math.floor(e/i*100)/100)+t+"px"},4)}var T=r.auto||0;var y;function L(){clearTimeout(y);y=setTimeout(w,T)}function k(){T=r.auto||0;clearTimeout(y)}var D={};var M={};var z;var S={handleEvent:function(e){switch(e.type){case"touchstart":this.start(e);break;case"touchmove":this.move(e);break;case"touchend":s(this.end(e));break;case"webkitTransitionEnd":case"msTransitionEnd":case"oTransitionEnd":case"otransitionend":case"transitionend":s(this.transitionEnd(e));break;case"resize":s(m);break}if(r.stopPropagation)e.stopPropagation()},start:function(e){var t=e.touches[0];D={x:t.pageX,y:t.pageY,time:+new Date};z=undefined;M={};f.addEventListener("touchmove",this,false);f.addEventListener("touchend",this,false)},move:function(e){if(e.touches.length>1||e.scale&&e.scale!==1)return;if(r.disableScroll)return;var t=e.touches[0];M={x:t.pageX-D.x,y:t.pageY-D.y};if(typeof z=="undefined"){z=!!(z||Math.abs(M.x)0||c==l.length-1&&M.x<0?Math.abs(M.x)/d+1:1);g(c-1,M.x+u[c-1],0);g(c,M.x+u[c],0);g(c+1,M.x+u[c+1],0)}r.swiping&&r.swiping(-M.x/d)}},end:function(e){var t=+new Date-D.time;var n=Number(t)<250&&Math.abs(M.x)>20||Math.abs(M.x)>d/2;var i=!c&&M.x>0||c==l.length-1&&M.x<0;if(h)i=false;var a=M.x<0;if(!z){if(n&&!i){if(a){if(h){x(E(c-1),-d,0);x(E(c+2),d,0)}else{x(c-1,-d,0)}x(c,u[c]-d,v);x(E(c+1),u[E(c+1)]-d,v);c=E(c+1)}else{if(h){x(E(c+1),d,0);x(E(c-2),-d,0)}else{x(c+1,d,0)}x(c,u[c]+d,v);x(E(c-1),u[E(c-1)]+d,v);c=E(c-1)}r.callback&&r.callback(c,l[c])}else{if(h){x(E(c-1),-d,v);x(c,0,v);x(E(c+1),d,v)}else{x(c-1,-d,v);x(c,0,v);x(c+1,d,v)}}}f.removeEventListener("touchmove",S,false);f.removeEventListener("touchend",S,false);f.removeEventListener("touchforcechange",function(){},false)},transitionEnd:function(e){if(parseInt(e.target.getAttribute("data-index"),10)==c){if(T)L();r.transitionEnd&&r.transitionEnd.call(e,c,l[c])}}};m();if(T)L();if(o.addEventListener){if(o.touch){f.addEventListener("touchstart",S,false);f.addEventListener("touchforcechange",function(){},false)}if(o.transitions){f.addEventListener("webkitTransitionEnd",S,false);f.addEventListener("msTransitionEnd",S,false);f.addEventListener("oTransitionEnd",S,false);f.addEventListener("otransitionend",S,false);f.addEventListener("transitionend",S,false)}window.addEventListener("resize",S,false)}else{window.onresize=function(){m()}}return{setup:function(){m()},slide:function(e,t){k();p(e,t)},prev:function(){k();e()},next:function(){k();w()},stop:function(){k()},getPos:function(){return c},getNumSlides:function(){return i},kill:function(){k();f.style.width="";f.style.left="";var e=l.length;while(e--){var t=l[e];t.style.width="";t.style.left="";if(o.transitions)g(e,0,0)}if(o.addEventListener){f.removeEventListener("touchstart",S,false);f.removeEventListener("webkitTransitionEnd",S,false);f.removeEventListener("msTransitionEnd",S,false);f.removeEventListener("oTransitionEnd",S,false);f.removeEventListener("otransitionend",S,false);f.removeEventListener("transitionend",S,false);window.removeEventListener("resize",S,false)}else{window.onresize=null}}}}});
--------------------------------------------------------------------------------
/test.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Swipe 2
5 |
6 |
10 |
11 |
29 |
30 |
31 | Swipe 2
32 |
33 |
34 |
35 |
0
36 |
1
37 |
2
38 |
3
39 |
4
40 |
5
41 |
6
42 |
7
43 |
8
44 |
9
45 |
10
46 |
11
47 |
12
48 |
13
49 |
14
50 |
15
51 |
16
52 |
17
53 |
18
54 |
19
55 |
20
56 |
57 |
58 |
59 |
60 | prev
61 | next
62 |
63 |
64 |
65 |
77 |
78 |
79 |
--------------------------------------------------------------------------------