source: imaps-frontend/node_modules/react-use/lib/useSlider.js@ d565449

main
Last change on this file since d565449 was d565449, checked in by stefan toskovski <stefantoska84@…>, 4 weeks ago

Update repo after prototype presentation

  • Property mode set to 100644
File size: 4.7 KB
RevLine 
[d565449]1"use strict";
2Object.defineProperty(exports, "__esModule", { value: true });
3var tslib_1 = require("tslib");
4var react_1 = require("react");
5var util_1 = require("./misc/util");
6var useMountedState_1 = tslib_1.__importDefault(require("./useMountedState"));
7var useSetState_1 = tslib_1.__importDefault(require("./useSetState"));
8var useSlider = function (ref, options) {
9 if (options === void 0) { options = {}; }
10 var isMounted = useMountedState_1.default();
11 var isSliding = react_1.useRef(false);
12 var valueRef = react_1.useRef(0);
13 var frame = react_1.useRef(0);
14 var _a = useSetState_1.default({
15 isSliding: false,
16 value: 0,
17 }), state = _a[0], setState = _a[1];
18 valueRef.current = state.value;
19 react_1.useEffect(function () {
20 if (util_1.isBrowser) {
21 var styles = options.styles === undefined ? true : options.styles;
22 var reverse_1 = options.reverse === undefined ? false : options.reverse;
23 if (ref.current && styles) {
24 ref.current.style.userSelect = 'none';
25 }
26 var startScrubbing_1 = function () {
27 if (!isSliding.current && isMounted()) {
28 (options.onScrubStart || util_1.noop)();
29 isSliding.current = true;
30 setState({ isSliding: true });
31 bindEvents_1();
32 }
33 };
34 var stopScrubbing_1 = function () {
35 if (isSliding.current && isMounted()) {
36 (options.onScrubStop || util_1.noop)(valueRef.current);
37 isSliding.current = false;
38 setState({ isSliding: false });
39 unbindEvents_1();
40 }
41 };
42 var onMouseDown_1 = function (event) {
43 startScrubbing_1();
44 onMouseMove_1(event);
45 };
46 var onMouseMove_1 = options.vertical
47 ? function (event) { return onScrub_1(event.clientY); }
48 : function (event) { return onScrub_1(event.clientX); };
49 var onTouchStart_1 = function (event) {
50 startScrubbing_1();
51 onTouchMove_1(event);
52 };
53 var onTouchMove_1 = options.vertical
54 ? function (event) { return onScrub_1(event.changedTouches[0].clientY); }
55 : function (event) { return onScrub_1(event.changedTouches[0].clientX); };
56 var bindEvents_1 = function () {
57 util_1.on(document, 'mousemove', onMouseMove_1);
58 util_1.on(document, 'mouseup', stopScrubbing_1);
59 util_1.on(document, 'touchmove', onTouchMove_1);
60 util_1.on(document, 'touchend', stopScrubbing_1);
61 };
62 var unbindEvents_1 = function () {
63 util_1.off(document, 'mousemove', onMouseMove_1);
64 util_1.off(document, 'mouseup', stopScrubbing_1);
65 util_1.off(document, 'touchmove', onTouchMove_1);
66 util_1.off(document, 'touchend', stopScrubbing_1);
67 };
68 var onScrub_1 = function (clientXY) {
69 cancelAnimationFrame(frame.current);
70 frame.current = requestAnimationFrame(function () {
71 if (isMounted() && ref.current) {
72 var rect = ref.current.getBoundingClientRect();
73 var pos = options.vertical ? rect.top : rect.left;
74 var length_1 = options.vertical ? rect.height : rect.width;
75 // Prevent returning 0 when element is hidden by CSS
76 if (!length_1) {
77 return;
78 }
79 var value = (clientXY - pos) / length_1;
80 if (value > 1) {
81 value = 1;
82 }
83 else if (value < 0) {
84 value = 0;
85 }
86 if (reverse_1) {
87 value = 1 - value;
88 }
89 setState({
90 value: value,
91 });
92 (options.onScrub || util_1.noop)(value);
93 }
94 });
95 };
96 util_1.on(ref.current, 'mousedown', onMouseDown_1);
97 util_1.on(ref.current, 'touchstart', onTouchStart_1);
98 return function () {
99 util_1.off(ref.current, 'mousedown', onMouseDown_1);
100 util_1.off(ref.current, 'touchstart', onTouchStart_1);
101 };
102 }
103 else {
104 return undefined;
105 }
106 }, [ref, options.vertical]);
107 return state;
108};
109exports.default = useSlider;
Note: See TracBrowser for help on using the repository browser.