chowa
Version:
UI component library based on React
83 lines (82 loc) • 3.11 kB
JavaScript
/**
* @license chowa v1.1.3
*
* Copyright (c) Chowa Techonlogies Co.,Ltd.(http://www.chowa.cn).
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
;
Object.defineProperty(exports, "__esModule", { value: true });
const React = require("react");
const classnames_1 = require("classnames");
const utils_1 = require("../utils");
const icon_1 = require("../icon");
const i18n_1 = require("../i18n");
class UploadDrag extends React.PureComponent {
constructor(props) {
super(props);
this.state = {
active: false
};
[
'onDragEnterHandler',
'onDragLeaveHandler',
'onDropHandler'
].forEach((fn) => {
this[fn] = this[fn].bind(this);
});
}
onDragEnterHandler() {
this.setState({ active: true });
}
onDragLeaveHandler() {
this.setState({ active: false });
}
onDropHandler(e) {
e.preventDefault();
const { appendUploadFile, directory } = this.props;
for (let i = 0; i < e.dataTransfer.files.length; i++) {
if (e.dataTransfer.files[i].type !== '') {
appendUploadFile(e.dataTransfer.files[i]);
}
}
if (directory) {
for (let i = 0; i < e.dataTransfer.items.length; i++) {
this.scanFiles(e.dataTransfer.items[i].webkitGetAsEntry());
}
}
this.setState({ active: false });
}
scanFiles(item) {
const { appendUploadFile } = this.props;
if (item.isDirectory) {
const reader = item.createReader();
reader.readEntries((entries) => {
entries.forEach((entry) => {
if (entry.isFile) {
appendUploadFile(entry);
}
else {
this.scanFiles(entry);
}
});
});
}
}
render() {
const { active } = this.state;
const { triggerUpload, disabled } = this.props;
const dragClass = classnames_1.default({
[utils_1.preClass('upload-drag-wrapper')]: true,
[utils_1.preClass('upload-drag-active')]: active,
[utils_1.preClass('upload-drag-disabled')]: disabled
});
return (React.createElement("div", { className: dragClass, onDragEnter: disabled ? null : this.onDragEnterHandler, onDragLeave: disabled ? null : this.onDragLeaveHandler, onDragOver: (e) => e.preventDefault(), onDrop: disabled ? null : this.onDropHandler, onClick: disabled ? null : triggerUpload },
React.createElement("div", { className: utils_1.preClass('upload-drag-icon') },
React.createElement(icon_1.default, { type: 'upload' })),
React.createElement("div", { className: utils_1.preClass('upload-drag-text') },
React.createElement(i18n_1.I18nReceiver, { module: 'Upload' }, (i18n) => i18n.drag))));
}
}
exports.default = UploadDrag;