Skip to content
This repository has been archived by the owner on Nov 25, 2020. It is now read-only.

Commit

Permalink
Add a show/hide processed files
Browse files Browse the repository at this point in the history
  • Loading branch information
@cdujeu
cdujeu committed Sep 19, 2016
1 parent 2fa8ad0 commit c913927
Show file tree
Hide file tree
Showing 5 changed files with 57 additions and 13 deletions.
2 changes: 1 addition & 1 deletion core/src/plugins/gui.ajax/res/themes/orbit/css/allz.css
View file

Large diffs are not rendered by default.

16 changes: 16 additions & 0 deletions core/src/plugins/gui.ajax/res/themes/orbit/css/components/uploaders.less
View file
Expand Up @@ -158,6 +158,22 @@ div#upload_files_list{
width: 0;
transition: all 550ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;
}
&.section-processed, &.header{
display: none;
}
&.upload-error{
display: block;
color: #d32f2f;
span.status{
color: #d32f2f;
}
}
}

&.show-processed{
> div.section-processed, > div.header{
display: block;
}
}

span.item_relative_path{
Expand Down
15 changes: 15 additions & 0 deletions core/src/plugins/gui.ajax/res/themes/orbit/css/pydio.css
View file
Expand Up @@ -2164,6 +2164,21 @@ div#upload_files_list > div div.uploader-pgbar {
width: 0;
transition: all 550ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;
}
div#upload_files_list > div.section-processed,
div#upload_files_list > div.header {
display: none;
}
div#upload_files_list > div.upload-error {
display: block;
color: #d32f2f;
}
div#upload_files_list > div.upload-error span.status {
color: #d32f2f;
}
div#upload_files_list.show-processed > div.section-processed,
div#upload_files_list.show-processed > div.header {
display: block;
}
div#upload_files_list span.item_relative_path {
color: #5f5f5f;
margin-left: 15px;
Expand Down
7 changes: 6 additions & 1 deletion core/src/plugins/uploader.html/js/react/UploaderModel.js
View file
Expand Up @@ -5,6 +5,10 @@
super();
this._status = 'new';
this._type = type;
this._id = Math.random();
}
getId(){
return this._id;
}
getLabel(){

Expand All @@ -24,6 +28,7 @@
}
abort(completeCallback){
if(this._status !== 'loading') return;
console.log('Should Stop XHR');
this._doAbort(completeCallback);
}
}
Expand Down Expand Up @@ -306,7 +311,7 @@
let processable = this.getNext();
if(processable){
this._processing.push(processable);
UploadTask.getInstance().setRunning(this.getQueueSize() + 1);
UploadTask.getInstance().setRunning(this.getQueueSize());
processable.process(function(){
this._processing = LangUtils.arrayWithout(this._processing, this._processing.indexOf(processable));
this._processed.push(processable);
Expand Down
30 changes: 19 additions & 11 deletions core/src/plugins/uploader.html/js/react/UploaderView.js
View file
Expand Up @@ -91,7 +91,8 @@
var TransferFile = React.createClass({

propTypes: {
item: React.PropTypes.object.isRequired
item: React.PropTypes.object.isRequired,
className:React.PropTypes.string
},

componentDidMount: function(){
Expand Down Expand Up @@ -139,7 +140,7 @@
style = {width: this.state.progress + '%'};
}
return (
<div className="file-row">
<div className={"file-row upload-" + this.props.item.getStatus() + " " + (this.props.className?this.props.className:"")}>
<span className="mdi mdi-file"/> {this.props.item.getFile().name}
{relativeMessage}
<span className="status">{statusMessage}</span>
Expand All @@ -162,7 +163,7 @@
statusMessage = 'Created';
}
return (
<div className="folder-row">
<div className={"folder-row upload-" + this.props.item.getStatus() + " " + (this.props.className?this.props.className:"")}>
<span className="mdi mdi-folder"/> {this.props.item.getPath()} <span className="status">{statusMessage}</span>
</div>
);
Expand All @@ -187,9 +188,9 @@
}
},

renderSection: function(accumulator, items, title = ""){
renderSection: function(accumulator, items, title = "", className=""){
if(title && items.length){
accumulator.push(<div className="header">{title}</div>);
accumulator.push(<div className={className + " header"}>{title}</div>);
}
items.sort(function(a, b){
let aType = a instanceof UploaderModel.FolderItem? 'folder' : 'file';
Expand All @@ -202,22 +203,22 @@
});
items.forEach(function(f){
if(f instanceof UploaderModel.FolderItem){
accumulator.push( <TransferFolder key={f.getLabel()} item={f} /> );
accumulator.push( <TransferFolder key={f.getId()} item={f} className={className}/> );
}else{
accumulator.push( <TransferFile key={f.getLabel()} item={f} /> );
accumulator.push( <TransferFile key={f.getId()} item={f} className={className}/> );
}
});
},

render: function(){
let items = [];
if(this.state && this.state.items){
this.renderSection(items, this.state.items.processing, 'Processing');
this.renderSection(items, this.state.items.pending, 'Pending');
this.renderSection(items, this.state.items.processed, 'Processed');
this.renderSection(items, this.state.items.processing, 'Processing', 'section-processing');
this.renderSection(items, this.state.items.pending, 'Pending', 'section-pending');
this.renderSection(items, this.state.items.processed, 'Processed', 'section-processed');
}
return (
<div id="upload_files_list">
<div id="upload_files_list" className={UploaderModel.Configs.getInstance().getOptionAsBool('UPLOAD_SHOW_PROCESSED', 'upload_show_processed', false) ? 'show-processed' : ''}>
{items}
</div>
)
Expand Down Expand Up @@ -249,6 +250,11 @@
toggleStart = !toggleStart;
this.state.configs.updateOption('upload_auto_close', toggleStart, true);
}else if(fName === 'existing'){
this.state.configs.updateOption('upload_existing', event.target.getSelectedValue());
}else if(fName === 'show_processed'){
let toggleShowProcessed = this.state.configs.getOptionAsBool('UPLOAD_SHOW_PROCESSED', 'upload_show_processed', false);
toggleShowProcessed = !toggleShowProcessed;
this.state.configs.updateOption('upload_show_processed', toggleShowProcessed, true);
}
this.setState({random: Math.random()});
},
Expand All @@ -264,6 +270,7 @@
let maxUploadMessage = MessageHash[282] + ':' + PathUtils.roundFileSize(maxUpload, '');
let toggleStart = this.state.configs.getOptionAsBool('DEFAULT_AUTO_START', 'upload_auto_send');
let toggleClose = this.state.configs.getOptionAsBool('DEFAULT_AUTO_CLOSE', 'upload_auto_close');
let toggleShowProcessed = this.state.configs.getOptionAsBool('UPLOAD_SHOW_PROCESSED', 'upload_show_processed', false);
let overwriteType = this.state.configs.getOption('DEFAULT_EXISTING', 'upload_existing');

return (
Expand All @@ -272,6 +279,7 @@
<div className="option-row">{maxUploadMessage}</div>
<div className="option-row"><ReactMUI.Toggle label="Start uploading automatically" labelPosition="right" toggled={toggleStart} defaultToggled={toggleStart} onToggle={this.updateField.bind(this, 'autostart')}/></div>
<div className="option-row"><ReactMUI.Toggle label="Close panel after upload is finished" labelPosition="right" toggled={toggleClose} onToggle={this.updateField.bind(this, 'autoclose')}/></div>
<div className="option-row"><ReactMUI.Toggle label="Show/hide processed files" labelPosition="right" toggled={toggleShowProcessed} onToggle={this.updateField.bind(this, 'show_processed')}/></div>
<div className="option-row">
<div style={{marginBottom: 10}}>If a file with the same name exists</div>
<ReactMUI.RadioButtonGroup ref="group" name="shipSpeed" defaultSelected={overwriteType} onChange={this.radioChange}>
Expand Down

0 comments on commit c913927

Please sign in to comment.