[d565449] | 1 | "use strict";
|
---|
| 2 | Object.defineProperty(exports, "__esModule", { value: true });
|
---|
| 3 | exports.ScratchSensor = void 0;
|
---|
| 4 | var tslib_1 = require("tslib");
|
---|
| 5 | var react_1 = require("react");
|
---|
| 6 | var react_universal_interface_1 = require("react-universal-interface");
|
---|
| 7 | var useLatest_1 = tslib_1.__importDefault(require("./useLatest"));
|
---|
| 8 | var util_1 = require("./misc/util");
|
---|
| 9 | var useScratch = function (params) {
|
---|
| 10 | if (params === void 0) { params = {}; }
|
---|
| 11 | var disabled = params.disabled;
|
---|
| 12 | var paramsRef = useLatest_1.default(params);
|
---|
| 13 | var _a = react_1.useState({ isScratching: false }), state = _a[0], setState = _a[1];
|
---|
| 14 | var refState = react_1.useRef(state);
|
---|
| 15 | var refScratching = react_1.useRef(false);
|
---|
| 16 | var refAnimationFrame = react_1.useRef(null);
|
---|
| 17 | var _b = react_1.useState(null), el = _b[0], setEl = _b[1];
|
---|
| 18 | react_1.useEffect(function () {
|
---|
| 19 | if (disabled)
|
---|
| 20 | return;
|
---|
| 21 | if (!el)
|
---|
| 22 | return;
|
---|
| 23 | var onMoveEvent = function (docX, docY) {
|
---|
| 24 | cancelAnimationFrame(refAnimationFrame.current);
|
---|
| 25 | refAnimationFrame.current = requestAnimationFrame(function () {
|
---|
| 26 | var _a = el.getBoundingClientRect(), left = _a.left, top = _a.top;
|
---|
| 27 | var elX = left + window.scrollX;
|
---|
| 28 | var elY = top + window.scrollY;
|
---|
| 29 | var x = docX - elX;
|
---|
| 30 | var y = docY - elY;
|
---|
| 31 | setState(function (oldState) {
|
---|
| 32 | var newState = tslib_1.__assign(tslib_1.__assign({}, oldState), { dx: x - (oldState.x || 0), dy: y - (oldState.y || 0), end: Date.now(), isScratching: true });
|
---|
| 33 | refState.current = newState;
|
---|
| 34 | (paramsRef.current.onScratch || util_1.noop)(newState);
|
---|
| 35 | return newState;
|
---|
| 36 | });
|
---|
| 37 | });
|
---|
| 38 | };
|
---|
| 39 | var onMouseMove = function (event) {
|
---|
| 40 | onMoveEvent(event.pageX, event.pageY);
|
---|
| 41 | };
|
---|
| 42 | var onTouchMove = function (event) {
|
---|
| 43 | onMoveEvent(event.changedTouches[0].pageX, event.changedTouches[0].pageY);
|
---|
| 44 | };
|
---|
| 45 | var onMouseUp;
|
---|
| 46 | var onTouchEnd;
|
---|
| 47 | var stopScratching = function () {
|
---|
| 48 | if (!refScratching.current)
|
---|
| 49 | return;
|
---|
| 50 | refScratching.current = false;
|
---|
| 51 | refState.current = tslib_1.__assign(tslib_1.__assign({}, refState.current), { isScratching: false });
|
---|
| 52 | (paramsRef.current.onScratchEnd || util_1.noop)(refState.current);
|
---|
| 53 | setState({ isScratching: false });
|
---|
| 54 | util_1.off(window, 'mousemove', onMouseMove);
|
---|
| 55 | util_1.off(window, 'touchmove', onTouchMove);
|
---|
| 56 | util_1.off(window, 'mouseup', onMouseUp);
|
---|
| 57 | util_1.off(window, 'touchend', onTouchEnd);
|
---|
| 58 | };
|
---|
| 59 | onMouseUp = stopScratching;
|
---|
| 60 | onTouchEnd = stopScratching;
|
---|
| 61 | var startScratching = function (docX, docY) {
|
---|
| 62 | if (!refScratching.current)
|
---|
| 63 | return;
|
---|
| 64 | var _a = el.getBoundingClientRect(), left = _a.left, top = _a.top;
|
---|
| 65 | var elX = left + window.scrollX;
|
---|
| 66 | var elY = top + window.scrollY;
|
---|
| 67 | var x = docX - elX;
|
---|
| 68 | var y = docY - elY;
|
---|
| 69 | var time = Date.now();
|
---|
| 70 | var newState = {
|
---|
| 71 | isScratching: true,
|
---|
| 72 | start: time,
|
---|
| 73 | end: time,
|
---|
| 74 | docX: docX,
|
---|
| 75 | docY: docY,
|
---|
| 76 | x: x,
|
---|
| 77 | y: y,
|
---|
| 78 | dx: 0,
|
---|
| 79 | dy: 0,
|
---|
| 80 | elH: el.offsetHeight,
|
---|
| 81 | elW: el.offsetWidth,
|
---|
| 82 | elX: elX,
|
---|
| 83 | elY: elY,
|
---|
| 84 | };
|
---|
| 85 | refState.current = newState;
|
---|
| 86 | (paramsRef.current.onScratchStart || util_1.noop)(newState);
|
---|
| 87 | setState(newState);
|
---|
| 88 | util_1.on(window, 'mousemove', onMouseMove);
|
---|
| 89 | util_1.on(window, 'touchmove', onTouchMove);
|
---|
| 90 | util_1.on(window, 'mouseup', onMouseUp);
|
---|
| 91 | util_1.on(window, 'touchend', onTouchEnd);
|
---|
| 92 | };
|
---|
| 93 | var onMouseDown = function (event) {
|
---|
| 94 | refScratching.current = true;
|
---|
| 95 | startScratching(event.pageX, event.pageY);
|
---|
| 96 | };
|
---|
| 97 | var onTouchStart = function (event) {
|
---|
| 98 | refScratching.current = true;
|
---|
| 99 | startScratching(event.changedTouches[0].pageX, event.changedTouches[0].pageY);
|
---|
| 100 | };
|
---|
| 101 | util_1.on(el, 'mousedown', onMouseDown);
|
---|
| 102 | util_1.on(el, 'touchstart', onTouchStart);
|
---|
| 103 | return function () {
|
---|
| 104 | util_1.off(el, 'mousedown', onMouseDown);
|
---|
| 105 | util_1.off(el, 'touchstart', onTouchStart);
|
---|
| 106 | util_1.off(window, 'mousemove', onMouseMove);
|
---|
| 107 | util_1.off(window, 'touchmove', onTouchMove);
|
---|
| 108 | util_1.off(window, 'mouseup', onMouseUp);
|
---|
| 109 | util_1.off(window, 'touchend', onTouchEnd);
|
---|
| 110 | if (refAnimationFrame.current)
|
---|
| 111 | cancelAnimationFrame(refAnimationFrame.current);
|
---|
| 112 | refAnimationFrame.current = null;
|
---|
| 113 | refScratching.current = false;
|
---|
| 114 | refState.current = { isScratching: false };
|
---|
| 115 | setState(refState.current);
|
---|
| 116 | };
|
---|
| 117 | }, [el, disabled, paramsRef]);
|
---|
| 118 | return [setEl, state];
|
---|
| 119 | };
|
---|
| 120 | var ScratchSensor = function (props) {
|
---|
| 121 | var children = props.children, params = tslib_1.__rest(props, ["children"]);
|
---|
| 122 | var _a = useScratch(params), ref = _a[0], state = _a[1];
|
---|
| 123 | var element = react_universal_interface_1.render(props, state);
|
---|
| 124 | return react_1.cloneElement(element, tslib_1.__assign(tslib_1.__assign({}, element.props), { ref: function (el) {
|
---|
| 125 | if (element.props.ref) {
|
---|
| 126 | if (typeof element.props.ref === 'object')
|
---|
| 127 | element.props.ref.current = el;
|
---|
| 128 | if (typeof element.props.ref === 'function')
|
---|
| 129 | element.props.ref(el);
|
---|
| 130 | }
|
---|
| 131 | ref(el);
|
---|
| 132 | } }));
|
---|
| 133 | };
|
---|
| 134 | exports.ScratchSensor = ScratchSensor;
|
---|
| 135 | exports.default = useScratch;
|
---|