"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports.MySlotMachineChild02 = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));
var _indexModule = _interopRequireDefault(require("./index.module.scss"));
var React = _interopRequireWildcard(require("react"));
var _react2 = require("@lucky-canvas/react");
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
// import { LuckyWheel } from '@lucky-canvas/react';
var MySlotMachineChild02 = /*#__PURE__*/function (_Component) {
  (0, _inheritsLoose2["default"])(MySlotMachineChild02, _Component);
  function MySlotMachineChild02(props) {
    var _this;
    _this = _Component.call(this, props) || this;
    _this.onisClick = function () {
      var isClick = _this.state.isClick;
      _this.setState({
        isClick: !isClick
      });
    };
    _this.onStarts = function () {
      // 点击抽奖按钮会触发star回调
      // console.log(this.myMachin);
      _this.myMachin.current.play();
      setTimeout(function () {
        var index = Math.random() * 6 >> 0;
        _this.myMachin.current.stop(index);
      }, 2500);
      _this.onisClick();
    };
    _this.myMachin = /*#__PURE__*/React.createRef();
    _this.state = {
      // 抽奖次数
      // count: 3,
      isClick: true
    };
    return _this;
  }
  var _proto = MySlotMachineChild02.prototype;
  _proto.componentDidMount = function componentDidMount() {}
  // 修改老虎机点击isClick
  ;
  _proto.render = function render() {
    var _this2 = this;
    var data = this.props.data;
    var container = {
      width: "100%",
      overflow: "auto"
    };
    var imgopacity = {
      opacity: data.bgOpacity / 100
    };
    var SlotMachineStyle = {
      style: {
        display: "flex",
        flexDirection: "column",
        justifyContent: "center" /* 水平居中 */,
        alignItems: "center" /* 垂直居中 */,
        paddingTop: "3.7vh" /* 看着太大，除以2 */,
        paddingBottom: "8.65vh" /* 看着太大，除以2 */
      }
    };

    var blocks = [];
    var prizes = [{
      background: '#FEF6DF',
      imgs: [{
        width: '100%',
        height: '100%',
        src: '//img.maimairen.com/low-code/components/slot-machine/frame.png'
      }, {
        src: '//img.maimairen.com/low-code/components/slot-machine/firstPrize.png',
        width: data.MachinePrizeImgWidth + "%",
        top: (data.MachinePrizeImgTop ? data.MachinePrizeImgTop : 32) + "%"
      }]
    }, {
      background: '#FEF6DF',
      imgs: [{
        width: '100%',
        height: '100%',
        src: '//img.maimairen.com/low-code/components/slot-machine/frame.png'
      }, {
        src: '//img.maimairen.com/low-code/components/slot-machine/secondPrize.png',
        width: data.MachinePrizeImgWidth + "%",
        top: (data.MachinePrizeImgTop ? data.MachinePrizeImgTop : 32) + "%"
      }]
    }, {
      background: '#FEF6DF',
      imgs: [{
        width: '100%',
        height: '100%',
        src: '//img.maimairen.com/low-code/components/slot-machine/frame.png'
      }, {
        src: '//img.maimairen.com/low-code/components/prize-list001/day15.png',
        width: data.MachinePrizeImgWidth + "%",
        top: (data.MachinePrizeImgTop ? data.MachinePrizeImgTop : 32) + "%"
      }]
    }
    // {
    //   background: '#ffffff',
    //   fonts: [
    //     {
    //       text: '500豆',
    //       fontSize: data.MachinePrizeFontSize,
    //       fontStyle: data.MachinePrizeFontFamily,
    //       fontColor: '#F58B33',
    //       top: `${data.MachinePrizeFontTop}%`,
    //     },
    //   ],
    //   imgs: [
    //     {
    //       src: '//img.maimairen.com/low-code/components/prize-list001/bean5.png',
    //       width: `${data.MachinePrizeImgWidth}%`,
    //       top: `${data.MachinePrizeImgTop}%`,
    //     },
    //   ],
    // },
    // {
    //   background: '#ffffff',
    //   fonts: [
    //     {
    //       text: '100豆',
    //       fontSize: data.MachinePrizeFontSize,
    //       fontStyle: data.MachinePrizeFontFamily,
    //       fontColor: '#F58B33',
    //       top: `${data.MachinePrizeFontTop}%`,
    //     },
    //   ],
    //   imgs: [
    //     {
    //       src: '//img.maimairen.com/low-code/components/prize-list001/bean1.png',
    //       width: `${data.MachinePrizeImgWidth}%`,
    //       top: `${data.MachinePrizeImgTop}%`,
    //     },
    //   ],
    // },
    ];

    var defaultConfig = {
      // 设置每个格子间隔
      // rowSpacing: '6.5em',
      rowSpacing: '-1px',
      colSpacing: '4em'
    };
    var slots = [{
      order: [0, 1, 2],
      speed: data.prizeSpeed
    }, {
      order: [0, 1, 2],
      speed: data.prizeSpeed
    }, {
      order: [1, 2, 0],
      speed: data.prizeSpeed
    }];
    // const slots = [{
    //     // 奖品排列顺序  默认所有奖品
    //     // order:
    //     speed: 30,
    //     // 1是正方向 -1是反方向
    //     direction: 1
    // }]
    var _allMachineStyle = {
      style: {
        wdith: data.SlotMachineWidth + "vw",
        height: data.SlotMachineWidth * 0.8 + "vw"
      }
    };
    var _onEnd = function onEnd(prize) {
      _this2.props.btnState(prize, '恭喜中奖了');
      _this2.onisClick();
      // alert(`恭喜你抽到 ${prize.fonts[0].text} 号奖品`);
    };

    var thaks = function thaks() {
      var prize = {
        imgs: [{}, {
          src: '//img.maimairen.com/low-code/components/marquee/xiatu01.png'
        }],
        fonts: [{
          text: '谢谢参与'
        }]
      };
      _this2.props.btnState(prize, '');
      _this2.onisClick();
    };
    var clickBtn = function clickBtn(state) {
      var btnActive = state;
      var btn = '//img.maimairen.com/low-code/components/slot-machine/btn.png';
      var btnGif = '//img.maimairen.com/low-code/components/slot-machine/btn03.gif';
      if (btnActive) {
        return /*#__PURE__*/React.createElement("div", {
          className: _indexModule["default"]['btn-box']
        }, /*#__PURE__*/React.createElement("img", {
          src: btn
        }));
      } else {
        return /*#__PURE__*/React.createElement("div", {
          className: _indexModule["default"]['btn-box']
        }, /*#__PURE__*/React.createElement("img", {
          src: btnGif
        }));
      }
    };
    return /*#__PURE__*/React.createElement("div", {
      className: _indexModule["default"].bigWheel,
      style: (0, _extends2["default"])({}, container, imgopacity)
    }, this.props.children, /*#__PURE__*/React.createElement("div", {
      className: _indexModule["default"]['bigWheel-content']
    }, /*#__PURE__*/React.createElement("div", {
      style: (0, _extends2["default"])({}, SlotMachineStyle)
    }, /*#__PURE__*/React.createElement("div", {
      className: _indexModule["default"].allMachineStyle,
      style: (0, _extends2["default"])({}, _allMachineStyle)
    }, /*#__PURE__*/React.createElement("div", {
      className: _indexModule["default"].SlotMachineBG
    }, /*#__PURE__*/React.createElement("img", {
      src: data.chooseImg.src1,
      className: _indexModule["default"].img
    }), /*#__PURE__*/React.createElement("div", {
      className: _indexModule["default"].btn2,
      onClick: this.onStarts
    }, this.state.isClick ? clickBtn(true) : clickBtn(false)), /*#__PURE__*/React.createElement("div", {
      className: _indexModule["default"].LotteryNumber
    }, "\u4ECA\u65E5\u5269\u4F59\u62BD\u5956\u6B21\u6570\uFF1A3"), /*#__PURE__*/React.createElement("div", {
      className: _indexModule["default"].mask03
    }, /*#__PURE__*/React.createElement(_react2.SlotMachine, {
      ref: this.myMachin
      // width={`59.2vw`}
      // height={`20vw`}
      ,
      blocks: blocks,
      prizes: prizes,
      slots: slots,
      defaultConfig: defaultConfig,
      onEnd: function onEnd(prize) {
        prize ? _onEnd(prize) : thaks();
      }
    })))))));
  };
  return MySlotMachineChild02;
}(React.Component);
exports.MySlotMachineChild02 = MySlotMachineChild02;
MySlotMachineChild02.displayName = 'MySlotMachineChild02'; // export default yellowSlotMachine;
// export type { yellowSlotMachineProps };