1 | 'use strict';
|
2 |
|
3 | Object.defineProperty(exports, "__esModule", {
|
4 | value: true
|
5 | });
|
6 |
|
7 | var _react = require('react');
|
8 |
|
9 | var React = _interopRequireWildcard(_react);
|
10 |
|
11 | var _Icon = require('./Icon');
|
12 |
|
13 | var _Icon2 = _interopRequireDefault(_Icon);
|
14 |
|
15 | var _Uploader = require('./Uploader');
|
16 |
|
17 | var _Uploader2 = _interopRequireDefault(_Uploader);
|
18 |
|
19 | var _Cropper = require('./Cropper');
|
20 |
|
21 | var _Cropper2 = _interopRequireDefault(_Cropper);
|
22 |
|
23 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
24 |
|
25 | function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj["default"] = obj; return newObj; } }
|
26 |
|
27 | function _defaults(obj, defaults) { var keys = Object.getOwnPropertyNames(defaults); for (var i = 0; i < keys.length; i++) { var key = keys[i]; var value = Object.getOwnPropertyDescriptor(defaults, key); if (value && value.configurable && obj[key] === undefined) { Object.defineProperty(obj, key, value); } } return obj; }
|
28 |
|
29 | function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
30 |
|
31 | function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
|
32 |
|
33 | function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : _defaults(subClass, superClass); }
|
34 |
|
35 | var CropViewer = function (_React$Component) {
|
36 | _inherits(CropViewer, _React$Component);
|
37 |
|
38 | function CropViewer(props) {
|
39 | _classCallCheck(this, CropViewer);
|
40 |
|
41 | var _this = _possibleConstructorReturn(this, _React$Component.call(this, props));
|
42 |
|
43 | _this.loadSelectedImage = function (blobOrString) {
|
44 | if (typeof blobOrString === 'string') {
|
45 | var image = new Image();
|
46 | image.onload = function () {
|
47 | _this.setState({
|
48 | selectedImage: blobOrString
|
49 | });
|
50 | };
|
51 | image.src = blobOrString;
|
52 | } else {
|
53 | _this.readBlob(blobOrString);
|
54 | }
|
55 | };
|
56 | _this.readBlob = function (blob) {
|
57 | var reader = new FileReader();
|
58 | reader.readAsDataURL(blob);
|
59 | reader.onload = function () {
|
60 | _this.setState({
|
61 | selectedImage: reader.result
|
62 | });
|
63 | };
|
64 | };
|
65 | _this.reset = function () {
|
66 | _this.onChange(null);
|
67 | };
|
68 | _this.selectImage = function (file) {
|
69 | _this.setState({
|
70 | previewImage: file
|
71 | });
|
72 | };
|
73 | _this.onChange = function (fileblob) {
|
74 | if (_this.props.onChange) {
|
75 | var file = fileblob ? new File([fileblob], _this.state.previewImage.name, { type: _this.state.previewImage.type }) : null;
|
76 | _this.props.onChange(file);
|
77 | }
|
78 | if (!_this.props.value) {
|
79 | if (fileblob) {
|
80 | _this.loadSelectedImage(fileblob);
|
81 | } else {
|
82 | _this.setState({
|
83 | previewImage: null,
|
84 | selectedImage: null
|
85 | });
|
86 | }
|
87 | }
|
88 | };
|
89 | _this.state = {
|
90 | previewImage: null,
|
91 | selectedImage: null
|
92 | };
|
93 | if (props.value) {
|
94 | _this.loadSelectedImage(props.value);
|
95 | }
|
96 | return _this;
|
97 | }
|
98 |
|
99 | CropViewer.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
|
100 | if (nextProps.value) {
|
101 | this.loadSelectedImage(nextProps.value);
|
102 | } else {
|
103 | this.setState({
|
104 | previewImage: null,
|
105 | selectedImage: null
|
106 | });
|
107 | }
|
108 | };
|
109 |
|
110 | CropViewer.prototype.render = function render() {
|
111 | var _state = this.state,
|
112 | previewImage = _state.previewImage,
|
113 | selectedImage = _state.selectedImage;
|
114 | var _props = this.props,
|
115 | prefixCls = _props.prefixCls,
|
116 | size = _props.size,
|
117 | circle = _props.circle,
|
118 | getSpinContent = _props.getSpinContent,
|
119 | renderModal = _props.renderModal,
|
120 | locale = _props.locale;
|
121 |
|
122 | if (selectedImage) {
|
123 | return React.createElement("div", { className: prefixCls + '-preview-wrapper' }, React.createElement("div", { className: prefixCls + '-preview' }, React.createElement("div", { className: prefixCls + '-preview-mask', onClick: this.reset }, React.createElement(_Icon2["default"], { type: "delete" })), React.createElement("img", { src: selectedImage, width: size[0], height: size[1] })));
|
124 | }
|
125 | if (previewImage) {
|
126 | return React.createElement(_Cropper2["default"], { circle: circle, size: size, prefixCls: prefixCls, file: previewImage, onChange: this.onChange, renderModal: renderModal, spin: getSpinContent(), locale: locale });
|
127 | }
|
128 | return React.createElement(_Uploader2["default"], { prefixCls: prefixCls, onSelectImage: this.selectImage }, this.props.children);
|
129 | };
|
130 |
|
131 | return CropViewer;
|
132 | }(React.Component);
|
133 |
|
134 | exports["default"] = CropViewer;
|
135 |
|
136 | CropViewer.Cropper = _Cropper2["default"];
|
137 | CropViewer.defaultProps = {
|
138 | prefixCls: 'rc',
|
139 | size: [32, 32],
|
140 | circle: false,
|
141 | locale: 'en-US'
|
142 | };
|
143 | ;
|
144 | module.exports = exports['default']; |
\ | No newline at end of file |