1
0
mirror of https://github.com/ascribe/onion.git synced 2024-11-14 17:15:08 +01:00

show overall progress

This commit is contained in:
Tim Daubenschütz 2015-09-04 14:54:39 +02:00
parent c33976ad37
commit 8e98a7bff7
9 changed files with 72 additions and 27 deletions

View File

@ -45,7 +45,6 @@ requests.defaults({
class AppGateway {
start() {
let settings;
let subdomain = window.location.host.split('.')[0];

View File

@ -72,7 +72,7 @@ let FileDragAndDropPreview = React.createClass({
if(this.props.areAssetsEditable) {
removeBtn = (<div className="delete-file">
<span
<span
className="glyphicon glyphicon-remove text-center"
aria-hidden="true"
title={getLangText('Remove file')}

View File

@ -3,6 +3,8 @@
import React from 'react';
import FileDragAndDropPreview from './file_drag_and_drop_preview';
import FileDragAndDropPreviewProgress from './file_drag_and_drop_preview_progress';
let FileDragAndDropPreviewIterator = React.createClass({
propTypes: {
@ -16,26 +18,29 @@ let FileDragAndDropPreviewIterator = React.createClass({
},
render() {
if(this.props.files) {
if(this.props.files && this.props.files.length > 0) {
return (
<div>
{this.props.files.map((file, i) => {
if(file.status !== 'deleted' && file.status !== 'canceled' && file.size !== -1) {
return (
<FileDragAndDropPreview
key={i}
file={file}
handleDeleteFile={this.props.handleDeleteFile}
handleCancelFile={this.props.handleCancelFile}
handlePauseFile={this.props.handlePauseFile}
handleResumeFile={this.props.handleResumeFile}
areAssetsDownloadable={this.props.areAssetsDownloadable}
areAssetsEditable={this.props.areAssetsEditable}/>
);
} else {
return null;
}
})}
<div className="file-drag-and-drop-preview-iterator">
<div>
{this.props.files.map((file, i) => {
if(file.status !== 'deleted' && file.status !== 'canceled' && file.size !== -1) {
return (
<FileDragAndDropPreview
key={i}
file={file}
handleDeleteFile={this.props.handleDeleteFile}
handleCancelFile={this.props.handleCancelFile}
handlePauseFile={this.props.handlePauseFile}
handleResumeFile={this.props.handleResumeFile}
areAssetsDownloadable={this.props.areAssetsDownloadable}
areAssetsEditable={this.props.areAssetsEditable}/>
);
} else {
return null;
}
})}
</div>
{/* <FileDragAndDropPreviewProgress files={this.props.files} /> */}
</div>
);
} else {

View File

@ -0,0 +1,38 @@
'use strict';
import React from 'react';
let FileDragAndDropPreviewProgress = React.createClass({
propTypes: {
files: React.PropTypes.array
},
calcOverallProgress() {
let overallProgress = 0;
let sizeOfAllFiles = 0;
let files = this.props.files.filter((file) => file.status !== 'deleted' || file.status !== 'canceled');
console.log(this.props.files.filter);
for(let i = 0; i < files.length; i++) {
sizeOfAllFiles += files[i].size;
}
for(let i = 0; i < files.length; i++) {
overallProgress += files[i].size / sizeOfAllFiles * files[i].progress;
}
return overallProgress.toFixed(2);
},
render() {
return (
<span
className="file-drag-and-drop-progress-time">
Overall progress: {this.calcOverallProgress()}%
</span>
);
}
});
export default FileDragAndDropPreviewProgress;

View File

@ -461,7 +461,6 @@ var ReactS3FineUploader = React.createClass({
},
onProgress(id, name, uploadedBytes, totalBytes) {
let newState = React.addons.update(this.state, {
filesToUpload: { [id]: {
progress: { $set: (uploadedBytes / totalBytes) * 100} }

View File

@ -1,7 +1,6 @@
'use strict';
import React from 'react';
import Router from 'react-router';
import AccordionListItemPiece from '../../../../../ascribe_accordion_list/accordion_list_item_piece';
@ -17,8 +16,6 @@ import IkonotvSubmitButton from '../ascribe_buttons/ikonotv_submit_button';
import AclProxy from '../../../../../acl_proxy';
import AclButton from '../../../../../ascribe_buttons/acl_button';
import { getLangText } from '../../../../../../utils/lang_utils';
import { mergeOptions } from '../../../../../../utils/general_utils';

View File

@ -71,7 +71,7 @@ let ROUTES = {
<Route name="logout" path="logout" handler={LogoutContainer} />
<Route name="signup" path="signup" handler={SignupContainer} />
<Route name="password_reset" path="password_reset" handler={PasswordResetContainer} />
<Route name="request_loan" path="request_loan" handler={IkonotvRequestLoan}/>
<Route name="request_loan" path="request_loan" handler={IkonotvRequestLoan} headerTitle="SEND NEW CONTRACT"/>
<Route name="register_piece" path="register_piece" handler={RegisterPiece} headerTitle="+ NEW WORK"/>
<Route name="pieces" path="collection" handler={IkonotvPieceList} headerTitle="COLLECTION"/>
<Route name="piece" path="pieces/:pieceId" handler={IkonotvPieceContainer} />

View File

@ -3,7 +3,6 @@
import alt from '../alt';
import EventActions from '../actions/event_actions';
class GoogleAnalyticsHandler {
constructor() {
this.bindActions(EventActions);

View File

@ -29,6 +29,14 @@
}
}
.file-drag-and-drop-preview-iterator {
text-align: right;
> div:first-child {
text-align: center;
}
}
.file-drag-and-drop .file-drag-and-drop-dialog > p:first-child {
font-size: 1.5em !important;