Remove 3 more
This commit is contained in:
Romaric Mourgues
@@ -1,58 +0,0 @@
|
||||
import Observable from '@deprecated/CollectionsV1/observable.js';
|
||||
|
||||
class UploadManager extends Observable {
|
||||
constructor() {
|
||||
super();
|
||||
this.setObservableName('upload_manager');
|
||||
this.reinit();
|
||||
|
||||
window.uploadManager = this;
|
||||
}
|
||||
|
||||
reinit() {
|
||||
if (this.reinitTimeout) clearTimeout(this.reinitTimeout);
|
||||
if (this.reinitTimeoutBefore) clearTimeout(this.reinitTimeoutBefore);
|
||||
this.currentUploadTotalSize = 0;
|
||||
this.currentUploadTotalNumber = 0;
|
||||
this.currentUploadedTotalSize = 0;
|
||||
this.currentUploadedFilesNumber = 0;
|
||||
this.currentUploadingFilesNumber = 0;
|
||||
this.currentCancelledFilesNumber = 0;
|
||||
this.currentWaitingFilesNumber = 0;
|
||||
this.currentErrorFilesNumber = 0;
|
||||
this.currentUploadFiles = [];
|
||||
this.currentUploadStartTime = new Date();
|
||||
this.will_close = false;
|
||||
this.notify();
|
||||
}
|
||||
|
||||
abort(elements) {
|
||||
var that = this;
|
||||
|
||||
if (elements.length === undefined) {
|
||||
elements = [elements];
|
||||
}
|
||||
|
||||
elements.forEach(element => {
|
||||
if (element.resumable) element.resumable.cancel();
|
||||
element.xhr_cancelled = true;
|
||||
element.cancelled = true;
|
||||
that.currentCancelledFilesNumber++;
|
||||
that.currentUploadingFilesNumber--;
|
||||
|
||||
if (
|
||||
that.currentUploadedFilesNumber +
|
||||
that.currentCancelledFilesNumber +
|
||||
that.currentErrorFilesNumber >=
|
||||
that.currentUploadTotalNumber
|
||||
) {
|
||||
that.reinitAfterDelay();
|
||||
}
|
||||
});
|
||||
|
||||
that.notify();
|
||||
}
|
||||
}
|
||||
|
||||
const service = new UploadManager();
|
||||
export default service;
|
||||
@@ -1,162 +0,0 @@
|
||||
import React from 'react';
|
||||
|
||||
import UploadManager from './upload-manager.js';
|
||||
import CloseIcon from '@material-ui/icons/CloseOutlined';
|
||||
import './uploads.scss';
|
||||
import moment from 'moment';
|
||||
import Languages from '@features/global/services/languages-service';
|
||||
|
||||
export default class UploadViewer extends React.Component {
|
||||
constructor(props) {
|
||||
super();
|
||||
this.state = {
|
||||
upload_manager: UploadManager,
|
||||
};
|
||||
UploadManager.addListener(this);
|
||||
}
|
||||
componentWillUnmount() {
|
||||
UploadManager.removeListener(this);
|
||||
}
|
||||
render() {
|
||||
if (this.state.upload_manager.currentUploadTotalNumber <= 0) {
|
||||
// eslint-disable-next-line react/no-direct-mutation-state
|
||||
this.state.large = true;
|
||||
return '';
|
||||
}
|
||||
|
||||
var documents = this.state.upload_manager.currentUploadFiles.filter(d => !d.path.substr(1));
|
||||
var folders = {};
|
||||
var folders_content = {};
|
||||
this.state.upload_manager.currentUploadFiles
|
||||
.filter(d => d.path.substr(1))
|
||||
.forEach(d => {
|
||||
var folder = d.path.substr(1).split('/')[0];
|
||||
if (!folders[folder]) {
|
||||
folders[folder] = {
|
||||
total: 0,
|
||||
total_progress: 0,
|
||||
total_uploaded: 0,
|
||||
error: true,
|
||||
cancelled: true,
|
||||
};
|
||||
folders_content[folder] = [];
|
||||
}
|
||||
|
||||
if (!d.cancelled) {
|
||||
folders[folder].cancelled = false;
|
||||
}
|
||||
|
||||
if (!d.error) {
|
||||
folders[folder].error = false;
|
||||
}
|
||||
|
||||
if (!d.error && !d.cancelled) {
|
||||
folders[folder].total++;
|
||||
folders[folder].total_progress += d.progress;
|
||||
if (d.progress === 1) {
|
||||
folders[folder].total_uploaded += 1;
|
||||
}
|
||||
|
||||
folders_content[folder].push(d);
|
||||
}
|
||||
});
|
||||
Object.keys(folders).forEach(name => {
|
||||
documents.push({
|
||||
progress: folders[name].total_progress / folders[name].total,
|
||||
name: name,
|
||||
cancelled: folders[name].cancelled,
|
||||
error: folders[name].error,
|
||||
folder_total: folders[name].total,
|
||||
folder_total_uploaded: folders[name].total_uploaded,
|
||||
all_files: folders_content[name],
|
||||
});
|
||||
});
|
||||
|
||||
var total_finished =
|
||||
this.state.upload_manager.currentUploadedFilesNumber +
|
||||
this.state.upload_manager.currentCancelledFilesNumber +
|
||||
this.state.upload_manager.currentErrorFilesNumber;
|
||||
var todo = this.state.upload_manager.currentUploadTotalNumber;
|
||||
|
||||
var total_finished_size = this.state.upload_manager.currentUploadFiles
|
||||
.map(a => {
|
||||
if (a.error || a.cancelled) {
|
||||
return (a.file || {}).size || 0;
|
||||
}
|
||||
if (a.progress > 0) {
|
||||
return ((a.file || {}).size || 0) * a.progress;
|
||||
}
|
||||
return 0;
|
||||
})
|
||||
.reduce((a, b) => {
|
||||
return a + b;
|
||||
});
|
||||
var todo_size = this.state.upload_manager.currentUploadFiles
|
||||
.map(a => {
|
||||
return (a.file || {}).size || 0;
|
||||
})
|
||||
.reduce((a, b) => {
|
||||
return a + b;
|
||||
});
|
||||
|
||||
var remaining_time = 0;
|
||||
if (total_finished_size > 0) {
|
||||
remaining_time =
|
||||
((todo_size - total_finished_size) / 1000000) *
|
||||
((new Date().getTime() - this.state.upload_manager.currentUploadStartTime) /
|
||||
(total_finished_size / 1000000));
|
||||
}
|
||||
|
||||
return (
|
||||
<div
|
||||
className={
|
||||
'upload_viewer ' +
|
||||
(this.state.upload_manager.will_close ? 'fade_out ' : 'skew_in_left_nobounce ')
|
||||
}
|
||||
>
|
||||
<div className="title" onClick={() => this.setState({ large: !this.state.large })}>
|
||||
{Languages.t('general.uploading')} {total_finished}/{todo}
|
||||
</div>
|
||||
{remaining_time > 0 && (
|
||||
<div className="subtitle">
|
||||
Will end {moment(new Date().getTime() + remaining_time).fromNow()}
|
||||
</div>
|
||||
)}
|
||||
<div className="uploads" style={{ display: this.state.large ? 'block' : 'none' }}>
|
||||
{documents
|
||||
.sort((a, b) => (a.progress === 1) - (b.progress === 1))
|
||||
.map(item => {
|
||||
return (
|
||||
<div
|
||||
key={item.unid}
|
||||
className={
|
||||
'uploadingFile ' +
|
||||
(item.cancelled || item.error ? 'stopped ' : '') +
|
||||
(item.progress === 1 && !item.error ? 'done ' : '') +
|
||||
(item.progress < 1 && !item.error && !item.cancelled ? 'progress ' : '')
|
||||
}
|
||||
>
|
||||
<div
|
||||
className="progress_bar"
|
||||
style={{ width: parseInt(item.progress * 100) + '%' }}
|
||||
/>
|
||||
<div className="name">
|
||||
{item.name} {item.folder_total !== undefined && '(Folder)'}
|
||||
</div>
|
||||
{item.path && item.path.substr(1) && (
|
||||
<div className="path">{item.path.substr(1)}</div>
|
||||
)}
|
||||
{item.folder_total !== undefined && (
|
||||
<div className="path">
|
||||
{item.folder_total_uploaded}/{item.folder_total}
|
||||
</div>
|
||||
)}
|
||||
<div className="progress">{parseInt((item.progress || 0) * 100)}%</div>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -2,7 +2,6 @@
|
||||
/* eslint-disable @typescript-eslint/no-explicit-any */
|
||||
import React from 'react';
|
||||
|
||||
import UploadManager from './upload-manager';
|
||||
import Languages from '@features/global/services/languages-service';
|
||||
import { Upload } from 'react-feather';
|
||||
import classNames from 'classnames';
|
||||
@@ -18,8 +17,6 @@ type StateType = { [key: string]: any };
|
||||
|
||||
type FileInputType = any;
|
||||
|
||||
type FileObjectType = { [key: string]: any };
|
||||
|
||||
let sharedFileInput: any = null;
|
||||
let sharedFolderInput: any = null;
|
||||
|
||||
@@ -30,14 +27,7 @@ export default class UploadZone extends React.Component<PropsType, StateType> {
|
||||
|
||||
constructor(props: PropsType) {
|
||||
super(props);
|
||||
this.state = {
|
||||
upload_manager: UploadManager,
|
||||
};
|
||||
UploadManager.addListener(this);
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
UploadManager.removeListener(this);
|
||||
this.state = {};
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
|
||||
@@ -1,211 +0,0 @@
|
||||
import Observable from '@deprecated/CollectionsV1/observable.js';
|
||||
|
||||
import Globals from '@features/global/services/globals-tdrive-app-service';
|
||||
|
||||
class UploadManager extends Observable {
|
||||
constructor() {
|
||||
super();
|
||||
this.observableName = 'uploadService';
|
||||
|
||||
this.globalStatus = 0;
|
||||
this.uploads = [];
|
||||
this.sessionUploaded = 0;
|
||||
this.uploaded_entities = [];
|
||||
this.uploading = 0;
|
||||
|
||||
Globals.window.uploads = this;
|
||||
}
|
||||
|
||||
updateData() {
|
||||
var totalSize = 0;
|
||||
var totalUp = 0;
|
||||
for (var i = 0; i < this.uploads.length; i++) {
|
||||
totalSize += this.uploads[i].size;
|
||||
totalUp += this.uploads[i].uploaded;
|
||||
this.uploads[i].status = (100 * this.uploads[i].uploaded) / (this.uploads[i].size + 1);
|
||||
}
|
||||
|
||||
if (this.sessionUploaded + this.uploads.length === 0) {
|
||||
this.globalStatus = 0;
|
||||
} else if (totalSize === 0) {
|
||||
this.globalStatus =
|
||||
(100 * this.sessionUploaded) / (this.sessionUploaded + this.uploads.length);
|
||||
} else {
|
||||
this.globalStatus =
|
||||
(100 * (totalUp / totalSize + this.sessionUploaded)) /
|
||||
(this.sessionUploaded + this.uploads.length);
|
||||
}
|
||||
|
||||
if (this.uploads.length === 0) {
|
||||
this.globalStatus = 0;
|
||||
this.sessionUploaded = 0;
|
||||
|
||||
if (this.callback) {
|
||||
var uploaded = [];
|
||||
// eslint-disable-next-line no-redeclare
|
||||
for (var i = 0; i < this.uploaded_entities.length; i++) {
|
||||
uploaded.push(this.uploaded_entities[i]);
|
||||
}
|
||||
|
||||
this.callback(uploaded);
|
||||
this.uploaded_entities = [];
|
||||
}
|
||||
}
|
||||
|
||||
this.notify();
|
||||
}
|
||||
|
||||
getFilesTree(event, fcb) {
|
||||
function newDirectoryApi(input, cb) {
|
||||
var fd = [],
|
||||
files = [];
|
||||
var iterate = function (entries, path, resolve) {
|
||||
var promises = [];
|
||||
entries.forEach(function (entry) {
|
||||
promises.push(
|
||||
new Promise(function (resolve) {
|
||||
if ('getFilesAndDirectories' in entry) {
|
||||
entry.getFilesAndDirectories().then(function (entries) {
|
||||
iterate(entries, entry.path + '/', resolve);
|
||||
});
|
||||
} else {
|
||||
if (entry.name) {
|
||||
var p = (path + entry.name).replace(/^[/\\]/, '');
|
||||
fd.push(entry);
|
||||
files.push(p);
|
||||
}
|
||||
resolve();
|
||||
}
|
||||
}),
|
||||
);
|
||||
});
|
||||
Promise.all(promises).then(resolve);
|
||||
};
|
||||
input.getFilesAndDirectories().then(function (entries) {
|
||||
new Promise(function (resolve) {
|
||||
iterate(entries, '/', resolve);
|
||||
}).then(cb.bind(null, fd, files));
|
||||
});
|
||||
}
|
||||
|
||||
// old prefixed API implemented in Chrome 11+ as well as array fallback
|
||||
function arrayApi(input, cb) {
|
||||
var fd = [],
|
||||
files = [];
|
||||
[].slice.call(input.files).forEach(function (file) {
|
||||
fd.push(file);
|
||||
files.push(file.webkitRelativePath || file.name);
|
||||
});
|
||||
cb(fd, files);
|
||||
}
|
||||
|
||||
// old drag and drop API implemented in Chrome 11+
|
||||
function entriesApi(items, cb) {
|
||||
var fd = [],
|
||||
files = [],
|
||||
rootPromises = [];
|
||||
|
||||
function readEntries(entry, reader, oldEntries, cb) {
|
||||
var dirReader = reader || entry.createReader();
|
||||
dirReader.readEntries(function (entries) {
|
||||
var newEntries = oldEntries ? oldEntries.concat(entries) : entries;
|
||||
if (entries.length) {
|
||||
setTimeout(readEntries.bind(null, entry, dirReader, newEntries, cb), 0);
|
||||
} else {
|
||||
cb(newEntries);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function readDirectory(entry, path, resolve) {
|
||||
if (!path) path = entry.name;
|
||||
readEntries(entry, 0, 0, function (entries) {
|
||||
var promises = [];
|
||||
entries.forEach(function (entry) {
|
||||
promises.push(
|
||||
new Promise(function (resolve) {
|
||||
if (entry.isFile) {
|
||||
entry.file(function (file) {
|
||||
var p = path + '/' + file.name;
|
||||
fd.push(file);
|
||||
files.push(p);
|
||||
resolve();
|
||||
}, resolve.bind());
|
||||
} else readDirectory(entry, path + '/' + entry.name, resolve);
|
||||
}),
|
||||
);
|
||||
});
|
||||
Promise.all(promises).then(resolve.bind());
|
||||
});
|
||||
}
|
||||
|
||||
[].slice.call(items).forEach(function (entry) {
|
||||
entry = entry.webkitGetAsEntry();
|
||||
if (entry) {
|
||||
rootPromises.push(
|
||||
new Promise(function (resolve) {
|
||||
if (entry.isFile) {
|
||||
entry.file(function (file) {
|
||||
fd.push(file);
|
||||
files.push(file.name);
|
||||
resolve();
|
||||
}, resolve.bind());
|
||||
} else if (entry.isDirectory) {
|
||||
readDirectory(entry, null, resolve);
|
||||
}
|
||||
}),
|
||||
);
|
||||
}
|
||||
});
|
||||
Promise.all(rootPromises).then(cb.bind(null, fd, files));
|
||||
}
|
||||
|
||||
var cb = function (event, files, paths) {
|
||||
var tree = {};
|
||||
paths.forEach(function (path, file_index) {
|
||||
var dirs = tree;
|
||||
var real_file = files[file_index];
|
||||
path.split('/').forEach(function (dir, dir_index) {
|
||||
if (dir.indexOf('.') === 0) {
|
||||
return;
|
||||
}
|
||||
if (dir_index === path.split('/').length - 1) {
|
||||
dirs[dir] = real_file;
|
||||
} else {
|
||||
if (!dirs[dir]) {
|
||||
dirs[dir] = {};
|
||||
}
|
||||
dirs = dirs[dir];
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
fcb(tree);
|
||||
};
|
||||
|
||||
if (event.dataTransfer) {
|
||||
var dt = event.dataTransfer;
|
||||
if (dt.items && dt.items.length && 'webkitGetAsEntry' in dt.items[0]) {
|
||||
entriesApi(dt.items, cb.bind(null, event));
|
||||
} else if ('getFilesAndDirectories' in dt) {
|
||||
newDirectoryApi(dt, cb.bind(null, event));
|
||||
} else if (dt.files) {
|
||||
arrayApi(dt, cb.bind(null, event));
|
||||
} else cb();
|
||||
} else if (event.target) {
|
||||
var t = event.target;
|
||||
if (t.files && t.files.length) {
|
||||
arrayApi(t, cb.bind(null, event));
|
||||
} else if ('getFilesAndDirectories' in t) {
|
||||
newDirectoryApi(t, cb.bind(null, event));
|
||||
} else {
|
||||
cb(event);
|
||||
}
|
||||
} else {
|
||||
fcb(event);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const upload = new UploadManager();
|
||||
export default upload;
|
||||
Reference in New Issue
Block a user