"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports["default"] = void 0;
var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));
var _select = _interopRequireDefault(require("@alifd/next/lib/select"));
var React = _interopRequireWildcard(require("react"));
var _agPsd = require("ag-psd");
require("./index.module.scss");
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; }
var Option = _select["default"].Option;
var GroupParamSetter = /*#__PURE__*/function (_PureComponent) {
  (0, _inheritsLoose2["default"])(GroupParamSetter, _PureComponent);
  function GroupParamSetter() {
    return _PureComponent.apply(this, arguments) || this;
  }
  var _proto = GroupParamSetter.prototype;
  // state = {
  //     tplPsdValue: ''
  // }
  _proto.componentDidMount = function componentDidMount() {
    // this.setState({
    //     tplPsdValue: 'https://img.maimairen.com/low-code/ali/tpl-thumb/tmp-tpl1.psd'
    // })
  };
  _proto.render = function render() {
    var onChange = this.props.onChange;
    var tplPsds = {
      value: '',
      list: [{
        title: 'tmp-tpl1',
        uri: 'https://img.maimairen.com/low-code/ali/tpl-thumb/tmp-tpl1.psd'
      }, {
        title: 'tmp-tpl2',
        uri: 'https://img.maimairen.com/low-code/ali/tpl-thumb/tmp-tpl2.psd'
      }, {
        title: 'tmp-tpl3',
        uri: 'https://img.maimairen.com/low-code/ali/tpl-thumb/tmp-tpl3.psd'
      }]
    };

    // this.setState({
    //     tplPsdValue: 'https://img.maimairen.com/low-code/ali/tpl-thumb/tmp-tpl1.psd'
    // })
    var SelectChange = function SelectChange(e) {
      var xhr = new XMLHttpRequest();
      xhr.open('GET', e, true);
      xhr.responseType = 'arraybuffer';
      xhr.addEventListener('load', function () {
        var buffer = xhr.response;
        var rPsd = (0, _agPsd.readPsd)(buffer);
        var val = {
          bgImg: '',
          // text,
          // _name,
          // style: _style
          layers: []
        };
        rPsd.children.forEach(function (res, idx) {
          var _ref = res || {
              text: {}
            },
            _canvas = _ref.canvas,
            _text = _ref.text,
            _name = _ref.name;
          if (idx === 0) {
            // 背景将 canvas 转为 base64
            val.bgImg = _canvas.toDataURL('image/png');
          } else {
            var text = _text.text,
              _text$style = _text.style,
              fontSize = _text$style.fontSize,
              fillColor = _text$style.fillColor,
              font = _text$style.font,
              fauxBold = _text$style.fauxBold,
              fauxItalic = _text$style.fauxItalic,
              transform = _text.transform;
            // debugger
            var _style = {
              fontSize: fontSize * 100 / rPsd.width + "vw",
              // 实际字体大小 * 100 / 画布宽
              color: "rgba(" + Object.values(fillColor).join(',') + ")",
              // 颜色
              fontFamily: font.name,
              fontWeight: fauxBold ? 'bolder' : 'normal',
              fontStyle: fauxItalic ? 'italic' : 'normal',
              // left: 100*transform[4]*transform[0]/rPsd.width+'%',
              left: transform[4] * 100 / rPsd.width + "%",
              // top: 100*transform[5]*transform[3]/rPsd.height+'%',
              top: transform[5] * 100 / rPsd.height + "%"
              // transform: `matrix(${Object.assign(
              //     transform,
              //     // transform[4]=100*transform[4]/rPsd.width,
              //     // transform[5]=100*transform[5]/rPsd.height,
              //
              // )})`
            };

            val.layers.push({
              text: text,
              _name: _name,
              style: _style
            });
          }
        });
        tplPsds.value = e;
        onChange(val);
      }, false);
      xhr.send();
    };
    return /*#__PURE__*/React.createElement("div", {
      className: "psd-parse"
    }, /*#__PURE__*/React.createElement("div", {
      className: "psd-parse-li"
    }, /*#__PURE__*/React.createElement(_select["default"], {
      hasClear: true,
      style: {
        marginRight: 8
      },
      onChange: SelectChange
    }, tplPsds.list.map(function (res) {
      return /*#__PURE__*/React.createElement(Option, {
        value: res.uri,
        key: res.uri
      }, res.title);
    }))));
  };
  return GroupParamSetter;
}(React.PureComponent);
exports["default"] = GroupParamSetter;
GroupParamSetter.displayName = 'PsdParse';