1 |
|
2 | import { getWindow, getDocument } from 'ssr-window';
|
3 | import $ from '../../shared/dom.js';
|
4 | export default function Keyboard(_ref) {
|
5 | let {
|
6 | swiper,
|
7 | extendParams,
|
8 | on,
|
9 | emit
|
10 | } = _ref;
|
11 | const document = getDocument();
|
12 | const window = getWindow();
|
13 | swiper.keyboard = {
|
14 | enabled: false
|
15 | };
|
16 | extendParams({
|
17 | keyboard: {
|
18 | enabled: false,
|
19 | onlyInViewport: true,
|
20 | pageUpDown: true
|
21 | }
|
22 | });
|
23 |
|
24 | function handle(event) {
|
25 | if (!swiper.enabled) return;
|
26 | const {
|
27 | rtlTranslate: rtl
|
28 | } = swiper;
|
29 | let e = event;
|
30 | if (e.originalEvent) e = e.originalEvent;
|
31 |
|
32 | const kc = e.keyCode || e.charCode;
|
33 | const pageUpDown = swiper.params.keyboard.pageUpDown;
|
34 | const isPageUp = pageUpDown && kc === 33;
|
35 | const isPageDown = pageUpDown && kc === 34;
|
36 | const isArrowLeft = kc === 37;
|
37 | const isArrowRight = kc === 39;
|
38 | const isArrowUp = kc === 38;
|
39 | const isArrowDown = kc === 40;
|
40 |
|
41 | if (!swiper.allowSlideNext && (swiper.isHorizontal() && isArrowRight || swiper.isVertical() && isArrowDown || isPageDown)) {
|
42 | return false;
|
43 | }
|
44 |
|
45 | if (!swiper.allowSlidePrev && (swiper.isHorizontal() && isArrowLeft || swiper.isVertical() && isArrowUp || isPageUp)) {
|
46 | return false;
|
47 | }
|
48 |
|
49 | if (e.shiftKey || e.altKey || e.ctrlKey || e.metaKey) {
|
50 | return undefined;
|
51 | }
|
52 |
|
53 | if (document.activeElement && document.activeElement.nodeName && (document.activeElement.nodeName.toLowerCase() === 'input' || document.activeElement.nodeName.toLowerCase() === 'textarea')) {
|
54 | return undefined;
|
55 | }
|
56 |
|
57 | if (swiper.params.keyboard.onlyInViewport && (isPageUp || isPageDown || isArrowLeft || isArrowRight || isArrowUp || isArrowDown)) {
|
58 | let inView = false;
|
59 |
|
60 | if (swiper.$el.parents(`.${swiper.params.slideClass}`).length > 0 && swiper.$el.parents(`.${swiper.params.slideActiveClass}`).length === 0) {
|
61 | return undefined;
|
62 | }
|
63 |
|
64 | const $el = swiper.$el;
|
65 | const swiperWidth = $el[0].clientWidth;
|
66 | const swiperHeight = $el[0].clientHeight;
|
67 | const windowWidth = window.innerWidth;
|
68 | const windowHeight = window.innerHeight;
|
69 | const swiperOffset = swiper.$el.offset();
|
70 | if (rtl) swiperOffset.left -= swiper.$el[0].scrollLeft;
|
71 | const swiperCoord = [[swiperOffset.left, swiperOffset.top], [swiperOffset.left + swiperWidth, swiperOffset.top], [swiperOffset.left, swiperOffset.top + swiperHeight], [swiperOffset.left + swiperWidth, swiperOffset.top + swiperHeight]];
|
72 |
|
73 | for (let i = 0; i < swiperCoord.length; i += 1) {
|
74 | const point = swiperCoord[i];
|
75 |
|
76 | if (point[0] >= 0 && point[0] <= windowWidth && point[1] >= 0 && point[1] <= windowHeight) {
|
77 | if (point[0] === 0 && point[1] === 0) continue;
|
78 |
|
79 | inView = true;
|
80 | }
|
81 | }
|
82 |
|
83 | if (!inView) return undefined;
|
84 | }
|
85 |
|
86 | if (swiper.isHorizontal()) {
|
87 | if (isPageUp || isPageDown || isArrowLeft || isArrowRight) {
|
88 | if (e.preventDefault) e.preventDefault();else e.returnValue = false;
|
89 | }
|
90 |
|
91 | if ((isPageDown || isArrowRight) && !rtl || (isPageUp || isArrowLeft) && rtl) swiper.slideNext();
|
92 | if ((isPageUp || isArrowLeft) && !rtl || (isPageDown || isArrowRight) && rtl) swiper.slidePrev();
|
93 | } else {
|
94 | if (isPageUp || isPageDown || isArrowUp || isArrowDown) {
|
95 | if (e.preventDefault) e.preventDefault();else e.returnValue = false;
|
96 | }
|
97 |
|
98 | if (isPageDown || isArrowDown) swiper.slideNext();
|
99 | if (isPageUp || isArrowUp) swiper.slidePrev();
|
100 | }
|
101 |
|
102 | emit('keyPress', kc);
|
103 | return undefined;
|
104 | }
|
105 |
|
106 | function enable() {
|
107 | if (swiper.keyboard.enabled) return;
|
108 | $(document).on('keydown', handle);
|
109 | swiper.keyboard.enabled = true;
|
110 | }
|
111 |
|
112 | function disable() {
|
113 | if (!swiper.keyboard.enabled) return;
|
114 | $(document).off('keydown', handle);
|
115 | swiper.keyboard.enabled = false;
|
116 | }
|
117 |
|
118 | on('init', () => {
|
119 | if (swiper.params.keyboard.enabled) {
|
120 | enable();
|
121 | }
|
122 | });
|
123 | on('destroy', () => {
|
124 | if (swiper.keyboard.enabled) {
|
125 | disable();
|
126 | }
|
127 | });
|
128 | Object.assign(swiper.keyboard, {
|
129 | enable,
|
130 | disable
|
131 | });
|
132 | } |
\ | No newline at end of file |