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 */
|
/* eslint-disable @typescript-eslint/no-explicit-any */
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
|
||||||
import UploadManager from './upload-manager';
|
|
||||||
import Languages from '@features/global/services/languages-service';
|
import Languages from '@features/global/services/languages-service';
|
||||||
import { Upload } from 'react-feather';
|
import { Upload } from 'react-feather';
|
||||||
import classNames from 'classnames';
|
import classNames from 'classnames';
|
||||||
@@ -18,8 +17,6 @@ type StateType = { [key: string]: any };
|
|||||||
|
|
||||||
type FileInputType = any;
|
type FileInputType = any;
|
||||||
|
|
||||||
type FileObjectType = { [key: string]: any };
|
|
||||||
|
|
||||||
let sharedFileInput: any = null;
|
let sharedFileInput: any = null;
|
||||||
let sharedFolderInput: any = null;
|
let sharedFolderInput: any = null;
|
||||||
|
|
||||||
@@ -30,14 +27,7 @@ export default class UploadZone extends React.Component<PropsType, StateType> {
|
|||||||
|
|
||||||
constructor(props: PropsType) {
|
constructor(props: PropsType) {
|
||||||
super(props);
|
super(props);
|
||||||
this.state = {
|
this.state = {};
|
||||||
upload_manager: UploadManager,
|
|
||||||
};
|
|
||||||
UploadManager.addListener(this);
|
|
||||||
}
|
|
||||||
|
|
||||||
componentWillUnmount() {
|
|
||||||
UploadManager.removeListener(this);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
componentDidMount() {
|
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