ascribe/onion
1
0
Fork 0
mirror of https://github.com/ascribe/onion.git synced 2024-12-22 17:33:14 +01:00
Code Issues Releases Wiki Activity

Merge remote-tracking branch 'remotes/origin/AD-496-add-control-buttons-to-fineupload' into AD-368-harmonize-functionality-of-ascrib

Browse Source 
Conflicts:
	js/components/ascribe_uploader/react_s3_fine_uploader.js
This commit is contained in:
diminator 2015-06-30 17:12:21 +02:00
commit 5ecd1368f0
12 changed files with 62 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
js/components/ascribe_accordion_list/accordion_list_item.js
View File

@ -19,7 +19,7 @@ let AccordionListItem = React.createClass({
<div className="col-xs-4 col-sm-4 col-md-4 col-lg-4 thumbnail-wrapper">
<img src={this.props.content.thumbnail} />
</div>
<div className="col-xs-8 col-sm-8 col-md-8 col-lg-8">
<div className="col-xs-7 col-sm-7 col-md-7 col-lg-7 col-xs-offset-1 col-sm-offset-1 col-md-offset-1 col-lg-offset-1">
<h1>{this.props.content.title}</h1>
<h3>{getLangText('by %s', this.props.content.artist_name)}</h3>
<h3>{this.props.content.date_created.split('-')[0]}</h3>

1
js/components/ascribe_accordion_list/accordion_list_item_table_editions.js
View File

@ -4,7 +4,6 @@ import React from 'react';
import EditionListStore from '../../stores/edition_list_store';
import EditionListActions from '../../actions/edition_list_actions';
import PieceListActions from '../../actions/piece_list_actions';
import AccordionListItemTable from './accordion_list_item_table';
import AccordionListItemTableToggle from './accordion_list_item_table_toggle';

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

@ -40,8 +40,11 @@ let FileDragAndDropPreview = React.createClass({
}
},
// implement a handle cancel action here that triggers fineuploaders cancel method
// to delete files that are currently uploading
handleDownloadFile() {
if(this.props.file.s3Url) {
open(this.props.file.s3Url);
}
},
render() {
let previewElement;
@ -53,14 +56,16 @@ let FileDragAndDropPreview = React.createClass({
progress={this.props.file.progress}
url={this.props.file.url}
toggleUploadProcess={this.toggleUploadProcess}
areAssetsDownloadable={this.props.areAssetsDownloadable}/>);
areAssetsDownloadable={this.props.areAssetsDownloadable}
downloadFile={this.handleDownloadFile}/>);
} else {
previewElement = (<FileDragAndDropPreviewOther
onClick={this.handleDeleteFile}
progress={this.props.file.progress}
type={this.props.file.type.split('/')[1]}
toggleUploadProcess={this.toggleUploadProcess}
areAssetsDownloadable={this.props.areAssetsDownloadable}/>);
areAssetsDownloadable={this.props.areAssetsDownloadable}
downloadFile={this.handleDownloadFile}/>);
}
return (

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

@ -31,10 +31,6 @@ let FileDragAndDropPreviewImage = React.createClass({
this.props.toggleUploadProcess();
},
downloadFile() {
console.log('implement this');
},
render() {
let imageStyle = {
backgroundImage: 'url("' + this.props.url + '")',

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

@ -11,7 +11,7 @@ let FileDragAndDropPreviewOther = React.createClass({
progress: React.PropTypes.number,
areAssetsDownloadable: React.PropTypes.bool,
toggleUploadProcess: React.PropTypes.func,
downloadFile: React.PropTypes.func,
downloadFile: React.PropTypes.func
},
getInitialState() {
@ -31,10 +31,6 @@ let FileDragAndDropPreviewOther = React.createClass({
this.props.toggleUploadProcess();
},
downloadFile() {
console.log('implement this');
},
render() {
let actionSymbol;

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

@ -314,25 +314,6 @@ var ReactS3FineUploader = React.createClass({
}
},
onDeleteComplete(id, xhr, isError) {
if(isError) {
let notification = new GlobalNotificationModel('Couldn\'t delete file', 'danger', 10000);
GlobalNotificationActions.appendGlobalNotification(notification);
} else {
this.removeFileWithIdFromFilesToUpload(id);
let notification = new GlobalNotificationModel('File deleted', 'success', 5000);
GlobalNotificationActions.appendGlobalNotification(notification);
}
if(this.props.isReadyForFormSubmission && this.props.isReadyForFormSubmission(this.state.filesToUpload)) {
// if so, set uploadstatus to true
this.props.setIsUploadReady(true);
} else {
this.props.setIsUploadReady(false);
}
},
onProgress(id, name, uploadedBytes, totalBytes) {
let newState = React.addons.update(this.state, {
filesToUpload: { [id]: {
@ -364,15 +345,37 @@ var ReactS3FineUploader = React.createClass({
let newState = React.addons.update(this.state, {filesToUpload: {$set: updatedFilesToUpload}});
this.setState(newState);
} else {
let notification = new GlobalNotificationModel('Could not load attached files (Further data)', 'danger', 10000);
GlobalNotificationActions.appendGlobalNotification(notification);
throw new Error('The session request failed', response);
}
},
onDeleteComplete(id, xhr, isError) {
if(isError) {
let notification = new GlobalNotificationModel('Couldn\'t delete file', 'danger', 10000);
GlobalNotificationActions.appendGlobalNotification(notification);
} else {
this.removeFileWithIdFromFilesToUpload(id);
let notification = new GlobalNotificationModel('File deleted', 'success', 5000);
GlobalNotificationActions.appendGlobalNotification(notification);
}
if(this.props.isReadyForFormSubmission && this.props.isReadyForFormSubmission(this.state.filesToUpload)) {
// if so, set uploadstatus to true
this.props.setIsUploadReady(true);
} else {
this.props.setIsUploadReady(false);
}
},
handleDeleteFile(fileId) {
// In some instances (when the file was already uploaded and is just displayed to the user)
// fineuploader does not register an id on the file (we do, don't be confused by this!).
// Since you can only delete a file by its id, we have to implement this method ourselves
//
//
// So, if an id is not present, we delete the file manually
// To check which files are already uploaded from previous sessions we check their status.
// If they are, it is "online"
@ -387,12 +390,8 @@ var ReactS3FineUploader = React.createClass({
let fileToDelete = this.state.filesToUpload[fileId];
S3Fetcher
.deleteFile(fileToDelete.s3Key, fileToDelete.s3Bucket)
.then((res) => {
console.log(res);
})
.catch((err) => {
console.log(err);
});
.then(() => this.onDeleteComplete(fileToDelete.id, null, false))
.catch(() => this.onDeleteComplete(fileToDelete.id, null, true));
}
},

2
js/utils/general_utils.js
View File

@ -100,4 +100,4 @@ function _mergeOptions(obj1, obj2){
}
}
return obj3;
}
}

15
sass/ascribe_accordion_list.scss
View File

@ -21,12 +21,19 @@ $ascribe-accordion-list-font: 'Source Sans Pro';
height:100%;
// ToDo: Include media queries for thumbnail
.thumbnail-wrapper {
margin-left:0;
padding-left:0;
width: 110px;
height: 110px;
padding:0;
img {
display:block;
height: $ascribe-accordion-list-item-height;
max-width: 100%;
max-height: 100%;
}
&::before {
content: ' ';
display: inline-block;
vertical-align: middle; /* vertical alignment of the inline element */
height: 100%;
}
}
h1 {
margin-top: .3em;

5
sass/ascribe_theme.scss Normal file
View File

@ -0,0 +1,5 @@
/* All bootstrap overwrites should take place in this file */
.pager li a {
color: white;
}

2
sass/ascribe_uploader.scss
View File

@ -29,7 +29,7 @@
margin-top: 1em;
&:before {
&::before {
content: ' ';
display: inline-block;
vertical-align: middle; /* vertical alignment of the inline element */

1
sass/main.scss
View File

@ -7,6 +7,7 @@ $BASE_URL: '<%= BASE_URL %>';
@import 'variables';
@import '../node_modules/bootstrap-sass/assets/stylesheets/bootstrap';
@import '../node_modules/react-datepicker/dist/react-datepicker';
@import 'ascribe_theme';
@import './ascribe-fonts/style';
@import './ascribe-fonts/ascribe-fonts';
@import 'ascribe_login';

14
sass/variables.scss
View File

@ -468,16 +468,16 @@ $pagination-disabled-border: #ddd !default;
//
//##
$pager-bg: $pagination-bg !default;
$pager-border: $pagination-border !default;
$pager-border-radius: 15px !default;
$pager-bg: $ascribe-color-full !default;
$pager-border: $ascribe-color-full !default;
$pager-border-radius: 0 !default;
$pager-hover-bg: $pagination-hover-bg !default;
$pager-hover-bg: darken($ascribe-color-full, 10%) !default;
$pager-active-bg: $pagination-active-bg !default;
$pager-active-color: $pagination-active-color !default;
$pager-active-bg: $ascribe-color-full !default;
$pager-active-color: $ascribe-color-full !default;
$pager-disabled-color: $pagination-disabled-color !default;
$pager-disabled-color: lighten($ascribe-color-full, 10%) !default;
//== Jumbotron