ming-demo3/lib/components/basic/richtext.js

mdf metaui web

"use strict";

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;

var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));

var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));

var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));

var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));

var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));

var _react = _interopRequireWildcard(require("react"));

var _label = _interopRequireDefault(require("./label"));

var _text = _interopRequireDefault(require("./text"));

var _classnames = _interopRequireDefault(require("classnames"));

var RichText = function (_Component) {
  (0, _inherits2["default"])(RichText, _Component);

  function RichText(props) {
    var _this;

    (0, _classCallCheck2["default"])(this, RichText);
    _this = (0, _possibleConstructorReturn2["default"])(this, (0, _getPrototypeOf2["default"])(RichText).call(this, props));
    _this.state = {
      visible: true,
      id: 'ueditor' + new Date().getTime()
    };
    return _this;
  }

  (0, _createClass2["default"])(RichText, [{
    key: "showEditor",
    value: function showEditor() {
      UE.dom.domUtils.setStyle(document.getElementById(this.state.id), 'display', '');
    }
  }, {
    key: "hideEditor",
    value: function hideEditor() {
      UE.dom.domUtils.setStyle(document.getElementById(this.state.id), 'display', 'none');
    }
  }, {
    key: "componentDidMount",
    value: function componentDidMount() {
      var _this2 = this;

      if (this.props.model) this.props.model.addListener(this);
      window.UEDITOR_HOME_URL = '/ueditor/';
      cb.requireInner(['/ueditor/ueditor.config.js', '/ueditor/ueditor.all.js', '/ueditor/ueditor.parse.min.js'], function () {
        _this2.editor = UE.getEditor(_this2.state.id, {
          initialFrameHeight: 275
        });

        _this2.editor.ready(function () {
          if (_this2.content) _this2.editor.setContent(_this2.content);

          _this2.editor.addListener('contentChange selectionchange', function () {
            var content = _this2.editor.getContent();

            _this2.content = content;
          }, _this2);

          _this2.editor.addListener('blur', function () {
            var content = _this2.editor.getContent();

            _this2.content = content;
            if (_this2.props.setContent) _this2.props.setContent(_this2.content);
            if (_this2.props.model) _this2.props.model.setValue(_this2.content, true);
          });

          _this2.state.readOnly ? _this2.hideEditor() : _this2.showEditor();
        }, _this2);
      }, this);
    }
  }, {
    key: "componentDidUpdate",
    value: function componentDidUpdate() {
      if (this.editor && this.editor.body) {
        var content = this.editor.getContent();
        if (content != this.content) this.editor.setContent(this.content);
        this.state.readOnly ? this.hideEditor() : this.showEditor();
      }
    }
  }, {
    key: "componentWillReceiveProps",
    value: function componentWillReceiveProps(nextProps) {
      this.content = nextProps.content;
    }
  }, {
    key: "baseControl",
    value: function baseControl() {
      var children = [];
      children.push(_react["default"].createElement("script", {
        key: "script",
        id: this.state.id,
        type: "text/plain"
      }));
      if (this.state.readOnly) children.push((0, _text["default"])(_react["default"].createElement("div", {
        key: "div",
        dangerouslySetInnerHTML: {
          __html: this.content
        }
      })));
      return _react["default"].createElement("div", {
        className: (0, _classnames["default"])({
          browse: this.state.readOnly
        })
      }, children);
    }
  }, {
    key: "getControl",
    value: function getControl() {
      var control = this.props.cShowCaption ? _react["default"].createElement(_label["default"], {
        control: this.baseControl(),
        title: this.props.cShowCaption
      }) : this.baseControl();
      return control;
    }
  }, {
    key: "render",
    value: function render() {
      this.content = this.state.value;
      if (cb.utils.isEmpty(this.content)) this.content = '';
      var control = this.getControl();
      var style = this.state.visible ? {} : {
        display: 'none'
      };
      var classname = this.state.readOnly ? 'basic-input-editor basic-input-editor-readonly' : 'basic-input-editor';
      return _react["default"].createElement("div", {
        className: classname,
        style: style
      }, control);
    }
  }]);
  return RichText;
}(_react.Component);

exports["default"] = RichText;
//# sourceMappingURL=richtext.js.map