UNPKG

luck-draw-react

Version:
354 lines (296 loc) 11.3 kB
(function (global, factory) { typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react')) : typeof define === 'function' && define.amd ? define(['exports', 'react'], factory) : (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.LuckDraw = {}, global.React)); }(this, (function (exports, React) { 'use strict'; function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; } var React__default = /*#__PURE__*/_interopDefaultLegacy(React); function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function (obj) { return typeof obj; }; } else { _typeof = function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); } function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; } function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; } function _objectSpread2(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; } function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); } function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); } function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); } function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; } function _possibleConstructorReturn(self, call) { if (call && (typeof call === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); } function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; } var LuckDraw = /*#__PURE__*/function (_React$PureComponent) { _inherits(LuckDraw, _React$PureComponent); var _super = _createSuper(LuckDraw); function LuckDraw(props) { var _this; _classCallCheck(this, LuckDraw); _this = _super.call(this, props); _defineProperty(_assertThisInitialized(_this), "start", function () { var _this$state = _this.state, roll_map_list = _this$state.roll_map_list, times = _this$state.times; var _this$props = _this.props, gift = _this$props.gift, giftList = _this$props.giftList, _this$props$speed = _this$props.speed, speed = _this$props$speed === void 0 ? 120 : _this$props$speed, _this$props$cycle_tim = _this$props.cycle_times, cycle_times = _this$props$cycle_tim === void 0 ? 3 : _this$props$cycle_tim; var gift_list = _this.data_format(giftList); _this.setState({ active_index: _this.current_index }, function () { var act_item = gift_list[roll_map_list.indexOf(_this.current_index)] || {}; if (_this.speed > speed && act_item.id * 1 === gift.id * 1) { clearTimeout(_this.lotteryTimer); _this.lotteryTimer = null; _this.CYCLE_TIMES = 0; _this.speed = 50; _this.callbacktimer = setTimeout(function () { _this.setState({ is_rolling: false, times: times - 1 }); _this.props.callback && _this.props.callback(_objectSpread2(_objectSpread2({}, act_item), gift), _assertThisInitialized(_this)); }, 500); return; } _this.current_index = ++_this.current_index % gift_list.length; _this.current_index === 0 && _this.CYCLE_TIMES++; _this.lotteryTimer = setTimeout(function () { _this.start(); }, _this.speed); if (_this.CYCLE_TIMES > cycle_times) _this.speed += 10; }); }); _defineProperty(_assertThisInitialized(_this), "reset", function () { _this.setState({ active_index: null }); _this.lotteryTimer = null; _this.current_index = 0; _this.CYCLE_TIMES = 0; _this.speed = 50; }); _defineProperty(_assertThisInitialized(_this), "handlePlay", function () { if (!_this.state.times) return _this.props.finishCallback && _this.props.finishCallback(_assertThisInitialized(_this)); if (_this.state.is_rolling) return; _this.current_index = 0; _this.CYCLE_TIMES = 0; _this.speed = 50; if (_this.props.beforeStart) { _this.props.beforeStart().then(function () { _this.setState({ is_rolling: true }, function () { _this.start(); }); }); } else { _this.setState({ is_rolling: true }, function () { _this.start(); }); } }); _this.state = { active_index: null, // 奖品是否被选中,选中时,值为奖品index, 例如0,1,2,3... times: 'times' in props ? props.times * 1 : 1, // 抽奖次数 is_rolling: false, // 正在抽奖时,禁止重复点击 roll_map_list: [0, 1, 2, 7, 8, 3, 6, 5, 4] // 运动顺序,数据映射 }; _this.lotteryTimer = null; _this.current_index = 0; _this.CYCLE_TIMES = 0; _this.speed = 50; return _this; } _createClass(LuckDraw, [{ key: "componentWillUnmount", value: function componentWillUnmount() { clearTimeout(this.lotteryTimer); clearTimeout(this.callbacktimer); } }, { key: "data_format", value: function data_format(data) { if (data) { var gift_list = data.slice(0, 8); gift_list.splice(gift_list.length / 2, 0, { name: "立即抽奖", image: "", id: "", startBtn: true }); return gift_list; } else { console.error('未获取到奖品信息!'); return []; } } }, { key: "render", value: function render() { var _this2 = this; var _this$state2 = this.state, active_index = _this$state2.active_index, roll_map_list = _this$state2.roll_map_list; var gift_list = this.data_format(this.props.giftList); if (gift_list.length < 8) return null; return /*#__PURE__*/React__default['default'].createElement("div", { className: "lottery pos-r" }, /*#__PURE__*/React__default['default'].createElement("div", { className: "lottery_content" }, gift_list.map(function (item, index) { var content = /*#__PURE__*/React__default['default'].createElement("div", { key: index, className: "lottery_item ".concat(active_index === roll_map_list[index] ? 'lottery_item-active' : '') }, item.ele ? item.ele : /*#__PURE__*/React__default['default'].createElement("div", { className: "lottery_item_main" }, item.name)); if (item.startBtn) { content = /*#__PURE__*/React__default['default'].createElement("div", { key: index, className: "lottery_item", onClick: _this2.handlePlay }, _typeof(_this2.props.playBtn) === 'object' ? _this2.props.playBtn : /*#__PURE__*/React__default['default'].createElement("div", { className: "lottery_item_main" }, _this2.props.playBtn || item.name)); } return content; }))); } }]); return LuckDraw; }(React__default['default'].PureComponent); exports.default = LuckDraw; Object.defineProperty(exports, '__esModule', { value: true }); }))); //# sourceMappingURL=luck-draw.js.map