ascribe/onion
1
0
Fork 0
mirror of https://github.com/ascribe/onion.git synced 2024-11-15 01:25:17 +01:00
Code Issues Releases Wiki Activity

first cut pause

Browse Source
This commit is contained in:
Tim Daubenschütz 2015-06-29 16:46:12 +02:00
parent 8064fdb39d
commit e44ae60b75
6 changed files with 24 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
js/components/ascribe_uploader/file_drag_and_drop_preview_image.js
View File

@ -14,11 +14,11 @@ let FileDragAndDropPreviewImage = React.createClass({
getInitialState() {
return {
loading: false
paused: false
};
},
onClick(e) {
/*onClick(e) {
e.preventDefault();
e.stopPropagation();
@ -27,6 +27,15 @@ let FileDragAndDropPreviewImage = React.createClass({
});
this.props.onClick(e);
},*/
toggleUploadProcess(e) {
e.preventDefault();
e.stopPropagation();
this.setState({
paused: true
});
},
render() {
@ -35,13 +44,14 @@ let FileDragAndDropPreviewImage = React.createClass({
backgroundSize: 'cover'
};
let actionSymbol = this.state.loading ? <img src={AppConstants.baseUrl + 'static/img/ascribe_animated_medium.gif'} /> : <span className="glyphicon glyphicon-remove delete-file" aria-hidden="true" title="Delete or cancel upload" onClick={this.onClick} />;
//let actionSymbol = this.state.loading ? <img src={AppConstants.baseUrl + 'static/img/ascribe_animated_medium.gif'} /> : <span className="glyphicon glyphicon-remove delete-file" aria-hidden="true" title="Delete or cancel upload" onClick={this.onClick} />;
let actionSymbol = this.state.paused ? <span className="glyphicon glyphicon-pause action-file" aria-hidden="true" title="Pause upload" onClick={this.toggleUploadProcess}/> : <span className="glyphicon glyphicon-play action-file" aria-hidden="true" title="Pause upload" onClick={this.toggleUploadProcess}/>
return (
<div
className="file-drag-and-drop-preview-image"
style={imageStyle}>
<ProgressBar completed={this.props.progress} color="black"/>
{actionSymbol}
</div>
);
}

4
js/components/ascribe_uploader/file_drag_and_drop_preview_other.js
View File

@ -30,14 +30,14 @@ let FileDragAndDropPreviewOther = React.createClass({
},
render() {
let actionSymbol = this.state.loading ? <img src={AppConstants.baseUrl + 'static/img/ascribe_animated_medium.gif'} /> : <span className="glyphicon glyphicon-remove delete-file" aria-hidden="true" title="Delete or cancel upload" onClick={this.onClick} />;
//let actionSymbol = this.state.loading ? <img src={AppConstants.baseUrl + 'static/img/ascribe_animated_medium.gif'} /> : <span className="glyphicon glyphicon-remove delete-file" aria-hidden="true" title="Delete or cancel upload" onClick={this.onClick} />;
return (
<div
className="file-drag-and-drop-preview">
<ProgressBar completed={this.props.progress} color="black"/>
<div className="file-drag-and-drop-preview-table-wrapper">
<div className="file-drag-and-drop-preview-other">
{actionSymbol}
<span className="glyphicon glyphicon-pause delete-file" aria-hidden="true" title="Delete or cancel upload"/>
<span>{'.' + this.props.type}</span>
</div>
</div>

13
js/components/ascribe_uploader/file_drag_and_drop_toolbar.js
View File

@ -1,13 +0,0 @@
'use strict';
import React from 'react';
let FileDragAndDropToolbar = React.createClass({
render() {
return (
<div></div>
);
}
});
export default FileDragAndDropToolbar;

3
js/components/ascribe_uploader/react_s3_fine_uploader.js
View File

@ -12,7 +12,6 @@ import { getCookie } from '../../utils/fetch_api_utils';
import fineUploader from 'fineUploader';
import FileDragAndDrop from './file_drag_and_drop';
import FileDragAndDropToolbar from './file_drag_and_drop_toolbar';
import GlobalNotificationModel from '../../models/global_notification_model';
import GlobalNotificationActions from '../../actions/global_notification_actions';
@ -179,7 +178,6 @@ var ReactS3FineUploader = React.createClass({
onComplete: this.onComplete,
onCancel: this.onCancel,
onDelete: this.onDelete,
onSessionRequestComplete: this.onSessionRequestComplete,
onProgress: this.onProgress,
onRetry: this.onRetry,
onAutoRetry: this.onAutoRetry,
@ -431,7 +429,6 @@ var ReactS3FineUploader = React.createClass({
handleCancelFile={this.handleCancelFile}
multiple={this.props.multiple}
dropzoneInactive={!this.props.multiple && this.state.filesToUpload.filter((file) => file.status !== 'deleted' && file.status !== 'canceled').length > 0} />
<FileDragAndDropToolbar />
</div>
);
}

7
js/components/edition.js
View File

@ -36,6 +36,8 @@ import GlobalNotificationActions from '../actions/global_notification_actions';
import apiUrls from '../constants/api_urls';
import AppConstants from '../constants/application_constants';
import { getCookie } from '../utils/fetch_api_utils';
let Link = Router.Link;
/**
* This is the component that implements display-specific functionality
@ -528,7 +530,10 @@ let FileUploader = React.createClass({
setUploadStatus={this.props.setUploadStatus}
isReadyForFormSubmission={this.props.isReadyForFormSubmission}
session={{
endpoint: '/api/ownership/loans/contract/'
endpoint: AppConstants.serverUrl + 'api/ownership/loans/contract/',
customHeaders: {
'X-CSRFToken': getCookie('csrftoken')
}
}}/>
);
}

4
sass/ascribe_uploader.scss
View File

@ -70,7 +70,7 @@
text-align: center;
}
.file-drag-and-drop-preview-image .delete-file {
.file-drag-and-drop-preview-image .action-file {
font-size: 2.5em;
margin-top: .3em;
color: white;
@ -82,7 +82,7 @@
}
}
.file-drag-and-drop-preview-other .delete-file {
.file-drag-and-drop-preview-other .action-file {
position: relative;
top: .3em;
margin-top: 0;