Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
rax-gesture-view
Advanced tools
rax-gesture-view - npm Package Compare versions
Comparing version 1.0.0-beta to 1.0.0
@@ -1,119 +0,95 @@ | ||
| import {createElement, Component} from 'rax'; | ||
| import View from 'rax-view'; | ||
| "use strict"; | ||
| const threshold = 5; | ||
| exports.__esModule = true; | ||
| exports.default = void 0; | ||
| const touchActionRatio = 1 / 1; | ||
| var _rax = require("rax"); | ||
| class GestureViewOnWeb extends Component { | ||
| startX = undefined; | ||
| var _raxView = _interopRequireDefault(require("rax-view")); | ||
| startY = undefined; | ||
| function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } | ||
| isStartX = false; | ||
| function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); } | ||
| isStartY = false; | ||
| function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; subClass.__proto__ = superClass; } | ||
| maxDy = 0; | ||
| var threshold = 5; | ||
| var touchActionRatio = 1 / 1; | ||
| maxDx = 0; | ||
| var GestureViewOnWeb = | ||
| /*#__PURE__*/ | ||
| function (_Component) { | ||
| _inheritsLoose(GestureViewOnWeb, _Component); | ||
| panType; | ||
| function GestureViewOnWeb() { | ||
| var _this; | ||
| onTouchStart = (e) => { | ||
| this.startX = e.changedTouches[0].clientX; | ||
| this.startY = e.changedTouches[0].clientY; | ||
| } | ||
| for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) { | ||
| args[_key] = arguments[_key]; | ||
| } | ||
| reset() { | ||
| this.startX = undefined; | ||
| this.startY = undefined; | ||
| this.maxDy = 0; | ||
| this.maxDx = 0; | ||
| this.isStartX = false; | ||
| this.isStartY = false; | ||
| this.panType = undefined; | ||
| this.isPropagationStoppedX = false; | ||
| this.isPropagationStoppedY = false; | ||
| } | ||
| _this = _Component.call.apply(_Component, [this].concat(args)) || this; | ||
| _this.startX = undefined; | ||
| _this.startY = undefined; | ||
| _this.isStartX = false; | ||
| _this.isStartY = false; | ||
| _this.maxDy = 0; | ||
| _this.maxDx = 0; | ||
| _this.panType = void 0; | ||
| onTouchMove = (e) => { | ||
| let {onHorizontalPan, onVerticalPan} = this.props; | ||
| let deltaX = e.changedTouches[0].clientX - this.startX; | ||
| let deltaY = e.changedTouches[0].clientY - this.startY; | ||
| _this.onTouchStart = function (e) { | ||
| _this.startX = e.changedTouches[0].clientX; | ||
| _this.startY = e.changedTouches[0].clientY; | ||
| }; | ||
| this.maxDx = Math.max(Math.abs(deltaX), this.maxDx); | ||
| this.maxDy = Math.max(Math.abs(deltaY), this.maxDy); | ||
| _this.onTouchMove = function (e) { | ||
| var _this$props = _this.props, | ||
| onHorizontalPan = _this$props.onHorizontalPan, | ||
| onVerticalPan = _this$props.onVerticalPan; | ||
| var deltaX = e.changedTouches[0].clientX - _this.startX; | ||
| var deltaY = e.changedTouches[0].clientY - _this.startY; | ||
| _this.maxDx = Math.max(Math.abs(deltaX), _this.maxDx); | ||
| _this.maxDy = Math.max(Math.abs(deltaY), _this.maxDy); | ||
| if (this.isPropagationStoppedX || this.isPropagationStoppedY) { | ||
| e.stopPropagation(); | ||
| } | ||
| if (_this.isPropagationStoppedX || _this.isPropagationStoppedY) { | ||
| e.stopPropagation(); | ||
| } // horizontal pan | ||
| // horizontal pan | ||
| if (onHorizontalPan && Math.abs(deltaX) >= threshold && Math.abs(deltaY / deltaX) < touchActionRatio && Math.abs(this.maxDy) < threshold) { | ||
| e.preventDefault(); | ||
| this.isPropagationStoppedX = true; | ||
| this.panType = 'x'; | ||
| if (!this.isStartX) { | ||
| e.state = 'start'; | ||
| e.changedTouches[0].deltaX = deltaX; | ||
| this.isStartX = true; | ||
| } else { | ||
| e.state = 'move'; | ||
| e.changedTouches[0].deltaX = deltaX; | ||
| } | ||
| onHorizontalPan && onHorizontalPan(e); | ||
| } else if (onVerticalPan && Math.abs(deltaY) >= threshold && Math.abs(deltaX / deltaY) < touchActionRatio && Math.abs(this.maxDx) < threshold) { | ||
| e.preventDefault(); | ||
| this.isPropagationStoppedY = true; | ||
| this.panType = 'y'; | ||
| if (!this.isStartY) { | ||
| e.state = 'start'; | ||
| e.changedTouches[0].deltaY = deltaY; | ||
| this.isStartY = true; | ||
| } else { | ||
| e.state = 'pan'; | ||
| e.changedTouches[0].deltaY = deltaY; | ||
| } | ||
| onVerticalPan && onVerticalPan(e); | ||
| } | ||
| } | ||
| onTouchEnd = (e) => { | ||
| let {onHorizontalPan, onVerticalPan} = this.props; | ||
| e.state = 'end'; | ||
| e.changedTouches[0].deltaX = e.changedTouches[0].clientX - this.startX; | ||
| e.changedTouches[0].deltaY = e.changedTouches[0].clientY - this.startY; | ||
| if (this.panType == 'x') { | ||
| onHorizontalPan && onHorizontalPan(e); | ||
| } else if (this.panType == 'y') { | ||
| onVerticalPan && onVerticalPan(e); | ||
| } | ||
| this.reset(); | ||
| } | ||
| if (onHorizontalPan && Math.abs(deltaX) >= threshold && Math.abs(deltaY / deltaX) < touchActionRatio && Math.abs(_this.maxDy) < threshold) { | ||
| e.preventDefault(); | ||
| _this.isPropagationStoppedX = true; | ||
| _this.panType = 'x'; | ||
| onTouchCancel = (e) => { | ||
| let {onHorizontalPan, onVerticalPan} = this.props; | ||
| e.state = 'cancel'; | ||
| e.changedTouches[0].deltaX = e.changedTouches[0].clientX - this.startX; | ||
| e.changedTouches[0].deltaY = e.changedTouches[0].clientY - this.startY; | ||
| if (this.panType == 'x') { | ||
| onHorizontalPan && onHorizontalPan(e); | ||
| } else if (this.panType == 'y') { | ||
| onVerticalPan && onVerticalPan(e); | ||
| } | ||
| this.reset(); | ||
| } | ||
| if (!_this.isStartX) { | ||
| e.state = 'start'; | ||
| e.changedTouches[0].deltaX = deltaX; | ||
| _this.isStartX = true; | ||
| } else { | ||
| e.state = 'move'; | ||
| e.changedTouches[0].deltaX = deltaX; | ||
| } | ||
| render() { | ||
| return (<View {...this.props} | ||
| onTouchStart={this.onTouchStart} | ||
| onTouchMove={this.onTouchMove} | ||
| onTouchEnd={this.onTouchEnd} | ||
| onTouchCancel={this.onTouchCancel} | ||
| />); | ||
| } | ||
| } | ||
| onHorizontalPan && onHorizontalPan(e); | ||
| } else if (onVerticalPan && Math.abs(deltaY) >= threshold && Math.abs(deltaX / deltaY) < touchActionRatio && Math.abs(_this.maxDx) < threshold) { | ||
| e.preventDefault(); | ||
| _this.isPropagationStoppedY = true; | ||
| _this.panType = 'y'; | ||
| export default GestureViewOnWeb;orizontalPan, | ||
| if (!_this.isStartY) { | ||
| e.state = 'start'; | ||
| e.changedTouches[0].deltaY = deltaY; | ||
| _this.isStartY = true; | ||
| } else { | ||
| e.state = 'pan'; | ||
| e.changedTouches[0].deltaY = deltaY; | ||
| } | ||
| onVerticalPan && onVerticalPan(e); | ||
| } | ||
| }; | ||
| _this.onTouchEnd = function (e) { | ||
| var _this$props2 = _this.props, | ||
| onHorizontalPan = _this$props2.onHorizontalPan, | ||
| onVerticalPan = _this$props2.onVerticalPan; | ||
@@ -120,0 +96,0 @@ e.state = 'end'; |
@@ -1,22 +0,14 @@ | ||
| import {createElement, Component} from 'rax'; | ||
| import View from 'rax-view'; | ||
| "use strict"; | ||
| class GestureViewOnWeex extends Component { | ||
| onTouchStart = (e) => { | ||
| this.startX = e.changedTouches[0].clientX; | ||
| } | ||
| exports.__esModule = true; | ||
| exports.default = void 0; | ||
| onHorizontalPan = (e) => { | ||
| let {onHorizontalPan} = this.props; | ||
| e.changedTouches[0].deltaX = e.changedTouches[0].clientX - this.startX; | ||
| onHorizontalPan && onHorizontalPan(e); | ||
| } | ||
| var _rax = require("rax"); | ||
| render() { | ||
| return <View {...this.props} onTouchStart={this.onTouchStart} onHorizontalPan={this.onHorizontalPan} />; | ||
| } | ||
| } | ||
| var _raxView = _interopRequireDefault(require("rax-view")); | ||
| export default GestureViewOnWeex;this, arguments); } | ||
| function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } | ||
| function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); } | ||
| function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; subClass.__proto__ = superClass; } | ||
@@ -23,0 +15,0 @@ |
@@ -24,52 +24,2 @@ /** @jsx createElement */ | ||
| var _default = GestureView; | ||
| exports.default = _default;t)(this.props, e); | ||
| startPoint.x = event.changedTouches[0].pageX; | ||
| startPoint.y = event.changedTouches[0].pageY; | ||
| }, | ||
| onTouchMove: function onTouchMove(e) { | ||
| var event = (0, _fmtEvent.default)(this.props, e); | ||
| if (!touchMoveStarted) { | ||
| var touchMoveStartPoint = { | ||
| x: event.changedTouches[0].pageX, | ||
| y: event.changedTouches[0].pageY | ||
| }; | ||
| touchMoveStarted = true; | ||
| if (Math.abs(startPoint.x - touchMoveStartPoint.x) < 20) { | ||
| isHorizontal = false; | ||
| } else { | ||
| isHorizontal = true; | ||
| } | ||
| if (isHorizontal) { | ||
| event.state = 'onHorizontalPan:start'; | ||
| this.props.onHorizontalPan(event); | ||
| } else { | ||
| event.state = 'onVeriticalPan:start'; | ||
| this.props.onVerticalPan(event); | ||
| } | ||
| } | ||
| if (isHorizontal) { | ||
| event.state = 'onHorizontalPan:move'; | ||
| this.props.onHorizontalPan(event); | ||
| } else { | ||
| event.state = 'onVeriticalPan:move'; | ||
| this.props.onVerticalPan(event); | ||
| } | ||
| }, | ||
| onTouchEnd: function onTouchEnd(e) { | ||
| touchMoveStarted = false; | ||
| var event = (0, _fmtEvent.default)(this.props, e); | ||
| if (isHorizontal) { | ||
| event.state = 'onHorizontalPan:end'; | ||
| this.props.onHorizontalPan(event); | ||
| } else { | ||
| event.state = 'onVeriticalPan:end'; | ||
| this.props.onVerticalPan(event); | ||
| } | ||
| } | ||
| } | ||
| }); | ||
| exports.default = _default; |
| { | ||
| "name": "rax-gesture-view", | ||
| "version": "1.0.0-beta", | ||
| "version": "1.0.0", | ||
| "description": "Gesture component for Rax.", | ||
@@ -5,0 +5,0 @@ "license": "BSD-3-Clause", |
| [](https://www.npmjs.com/package/universal-toast) | ||
| ## [支持] | ||
| ## 支持 | ||
| Web / Weex / 小程序 | ||
@@ -19,3 +19,4 @@ | ||
| 1、**支持**列表中的 <img alt="browser" src="https://gw.alicdn.com/tfs/TB1uYFobGSs3KVjSZPiXXcsiVXa-200-200.svg" width="25px" height="25px" />代表h5 <img alt="weex" src="https://gw.alicdn.com/tfs/TB1jM0ebMaH3KVjSZFjXXcFWpXa-200-200.svg" width="25px" height="25px" />代表weex <img alt="miniApp" src="https://gw.alicdn.com/tfs/TB1bBpmbRCw3KVjSZFuXXcAOpXa-200-200.svg" width="25px" height="25px" />代表小程序 | ||
| | **属性** | **类型** | **默认值** | ** [必填] ** | **描述** | ** [支持] ** | | ||
| | **属性** | **类型** | **默认值** | **必填** | **描述** | **支持** | | ||
| | ----------- | ---------- | ---------- | ------------ | ------------------ | ------------ | | ||
@@ -22,0 +23,0 @@ | onHorizontalPan | `function` | - | | 节点被点击之后触发 | <img alt="browser" src="https://gw.alicdn.com/tfs/TB1uYFobGSs3KVjSZPiXXcsiVXa-200-200.svg" width="25px" height="25px" /> <img alt="weex" src="https://gw.alicdn.com/tfs/TB1jM0ebMaH3KVjSZFjXXcFWpXa-200-200.svg" width="25px" height="25px" /> <img alt="miniApp" src="https://gw.alicdn.com/tfs/TB1bBpmbRCw3KVjSZFuXXcAOpXa-200-200.svg" width="25px" height="25px" /> | |
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
No v1
QualityPackage is not semver >=1. This means it is not stable and does not support ^ ranges.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by31.39%
18396
- Number of package files
- increased by30%
13
- Lines of code
- increased by35.36%
379
- Number of low quality alerts
- decreased by-100%
0
- Number of lines in readme file
- increased by1.82%
56
Worsened metrics
- Number of medium supply chain risk alerts
- increased byInfinity%
1
No dependency changes