From 85340a91269672813c215c28d366318992a0e0c4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= Date: Wed, 2 Dec 2015 12:23:38 +0100 Subject: [PATCH 1/4] Fix bug that threw an error when passing nullish prop to PieceListFilterDisplay --- js/components/piece_list.js | 5 ++--- js/components/piece_list_filter_display.js | 2 +- .../whitelabel/wallet/components/market/market_piece_list.js | 2 +- 3 files changed, 4 insertions(+), 5 deletions(-) diff --git a/js/components/piece_list.js b/js/components/piece_list.js index 383d870f..9208df92 100644 --- a/js/components/piece_list.js +++ b/js/components/piece_list.js @@ -133,7 +133,7 @@ let PieceList = React.createClass({ const defaultFilterBy = {}; if (filterParams && typeof filterParams.forEach === 'function') { - filterParams.forEach(({ label, items }) => { + filterParams.forEach(({ items }) => { items.forEach((item) => { if (typeof item === 'object' && item.defaultValue) { defaultFilterBy[item.key] = true; @@ -211,7 +211,7 @@ let PieceList = React.createClass({ }, loadPieceList({ page, filterBy = this.state.filterBy, search = this.state.search }) { - let orderBy = this.state.orderBy ? this.state.orderBy : this.props.orderBy; + const orderBy = this.state.orderBy || this.props.orderBy; return PieceListActions.fetchPieceList(page, this.state.pageSize, search, orderBy, this.state.orderAsc, filterBy); @@ -259,7 +259,6 @@ let PieceList = React.createClass({ const availableAcls = getAvailableAcls(selectedEditions, (aclName) => aclName !== 'acl_view'); setDocumentTitle(getLangText('Collection')); - return (
diff --git a/js/components/whitelabel/wallet/components/market/market_piece_list.js b/js/components/whitelabel/wallet/components/market/market_piece_list.js index 64198bb3..8ffab5a5 100644 --- a/js/components/whitelabel/wallet/components/market/market_piece_list.js +++ b/js/components/whitelabel/wallet/components/market/market_piece_list.js @@ -50,7 +50,7 @@ let MarketPieceList = React.createClass({ render() { const { currentUser, whitelabel } = this.state; - let filterParams = undefined; + let filterParams = null; let canLoadPieceList = false; if (currentUser.email && whitelabel.user) { From 8b3060d6133e72765b1c07c3b1c9a0cc3b88e10d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= Date: Wed, 2 Dec 2015 12:25:11 +0100 Subject: [PATCH 2/4] Fix simple comments in pr --- .../ascribe_detail/further_details_fileuploader.js | 4 +++- .../market/market_buttons/market_submit_button.js | 4 ++-- .../market_forms/market_additional_data_form.js | 6 ++++-- .../wallet/components/market/market_register_piece.js | 11 +---------- js/components/whitelabel/wallet/wallet_routes.js | 11 ----------- 5 files changed, 10 insertions(+), 26 deletions(-) diff --git a/js/components/ascribe_detail/further_details_fileuploader.js b/js/components/ascribe_detail/further_details_fileuploader.js index c8e17036..dc638816 100644 --- a/js/components/ascribe_detail/further_details_fileuploader.js +++ b/js/components/ascribe_detail/further_details_fileuploader.js @@ -10,6 +10,8 @@ import ApiUrls from '../../constants/api_urls'; import AppConstants from '../../constants/application_constants'; import { getCookie } from '../../utils/fetch_api_utils'; +import { getLangText } from '../../utils/lang_utils'; + let FurtherDetailsFileuploader = React.createClass({ propTypes: { @@ -26,7 +28,7 @@ let FurtherDetailsFileuploader = React.createClass({ getDefaultProps() { return { - label: 'Additional files', + label: getLangText('Additional files'), multiple: false }; }, diff --git a/js/components/whitelabel/wallet/components/market/market_buttons/market_submit_button.js b/js/components/whitelabel/wallet/components/market/market_buttons/market_submit_button.js index 6a617bfb..d75282af 100644 --- a/js/components/whitelabel/wallet/components/market/market_buttons/market_submit_button.js +++ b/js/components/whitelabel/wallet/components/market/market_buttons/market_submit_button.js @@ -53,8 +53,8 @@ let MarketSubmitButton = React.createClass({ const { extra_data, other_data } = edition; if (extra_data.artist_bio && extra_data.work_description && - extra_data.technology_details && extra_data.display_instructions && - other_data.length > 0) { + extra_data.technology_details && extra_data.display_instructions && + other_data.length > 0) { return true; } } diff --git a/js/components/whitelabel/wallet/components/market/market_forms/market_additional_data_form.js b/js/components/whitelabel/wallet/components/market/market_forms/market_additional_data_form.js index a2318b99..90baebb0 100644 --- a/js/components/whitelabel/wallet/components/market/market_forms/market_additional_data_form.js +++ b/js/components/whitelabel/wallet/components/market/market_forms/market_additional_data_form.js @@ -8,6 +8,7 @@ import Property from '../../../../../ascribe_forms/property'; import InputTextAreaToggable from '../../../../../ascribe_forms/input_textarea_toggable'; import FurtherDetailsFileuploader from '../../../../../ascribe_detail/further_details_fileuploader'; +import AscribeSpinner from '../../../../../ascribe_spinner'; import GlobalNotificationModel from '../../../../../../models/global_notification_model'; import GlobalNotificationActions from '../../../../../../actions/global_notification_actions'; @@ -24,6 +25,7 @@ import requests from '../../../../../../utils/requests'; import { mergeOptions } from '../../../../../../utils/general_utils'; import { getLangText } from '../../../../../../utils/lang_utils'; + let MarketAdditionalDataForm = React.createClass({ propTypes: { pieceId: React.PropTypes.oneOfType([ @@ -96,7 +98,7 @@ let MarketAdditionalDataForm = React.createClass({ }, isUploadReadyOnChange(piece) { - return piece && piece.other_data && piece.other_data.length > 0 ? true : false; + return piece && piece.other_data && piece.other_data.length > 0; }, handleSuccessWithNotification() { @@ -211,7 +213,7 @@ let MarketAdditionalDataForm = React.createClass({ } else { return (
- +
); } diff --git a/js/components/whitelabel/wallet/components/market/market_register_piece.js b/js/components/whitelabel/wallet/components/market/market_register_piece.js index a59ce5fa..9a919561 100644 --- a/js/components/whitelabel/wallet/components/market/market_register_piece.js +++ b/js/components/whitelabel/wallet/components/market/market_register_piece.js @@ -35,8 +35,6 @@ let MarketRegisterPiece = React.createClass({ UserStore.getState(), PieceListStore.getState(), { - selectedLicense: 0, - isFineUploaderActive: false, step: 0 }); }, @@ -58,13 +56,6 @@ let MarketRegisterPiece = React.createClass({ onChange(state) { this.setState(state); - - if (this.state.currentUser && this.state.currentUser.email) { - // we should also make the fineuploader component editable again - this.setState({ - isFineUploaderActive: true - }); - } }, handleRegisterSuccess(response) { @@ -140,7 +131,7 @@ let MarketRegisterPiece = React.createClass({ enableLocalHashing={false} headerMessage={getLangText('Consign to Market')} submitMessage={getLangText('Proceed to additional details')} - isFineUploaderActive={this.state.isFineUploaderActive} + isFineUploaderActive={true} handleSuccess={this.handleRegisterSuccess} onLoggedOut={this.onLoggedOut} location={this.props.location}> diff --git a/js/components/whitelabel/wallet/wallet_routes.js b/js/components/whitelabel/wallet/wallet_routes.js index 08adec44..92b53dc6 100644 --- a/js/components/whitelabel/wallet/wallet_routes.js +++ b/js/components/whitelabel/wallet/wallet_routes.js @@ -228,16 +228,6 @@ let ROUTES = { ) }; - -function getRoutes(commonRoutes, subdomain) { - if(subdomain in ROUTES) { - return ROUTES[subdomain]; - } else { - throw new Error('Subdomain wasn\'t specified in the wallet app.'); - } -}; - - function getRoutes(commonRoutes, subdomain) { if(subdomain in ROUTES) { return ROUTES[subdomain]; @@ -246,5 +236,4 @@ function getRoutes(commonRoutes, subdomain) { } } - export default getRoutes; From fe24a5e15a47c67271d1ef8d6d751ea142482038 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= Date: Wed, 2 Dec 2015 12:37:21 +0100 Subject: [PATCH 3/4] Remove all occurrences of inactivity mgmt of ReactS3Fineuploader --- .../ascribe_forms/form_register_piece.js | 2 -- .../ascribe_forms/input_fineuploader.js | 21 +++++++++-------- .../file_drag_and_drop.js | 9 -------- .../react_s3_fine_uploader.js | 3 --- js/components/register_piece.js | 14 ++--------- .../cyland/cyland_register_piece.js | 17 +------------- .../ikonotv/ikonotv_register_piece.js | 23 +------------------ .../market/market_register_piece.js | 6 ----- 8 files changed, 15 insertions(+), 80 deletions(-) diff --git a/js/components/ascribe_forms/form_register_piece.js b/js/components/ascribe_forms/form_register_piece.js index b09d29ac..5b5f97fe 100644 --- a/js/components/ascribe_forms/form_register_piece.js +++ b/js/components/ascribe_forms/form_register_piece.js @@ -26,7 +26,6 @@ let RegisterPieceForm = React.createClass({ isFineUploaderActive: React.PropTypes.bool, isFineUploaderEditable: React.PropTypes.bool, enableLocalHashing: React.PropTypes.bool, - onLoggedOut: React.PropTypes.func, // For this form to work with SlideContainer, we sometimes have to disable it disabled: React.PropTypes.bool, @@ -116,7 +115,6 @@ let RegisterPieceForm = React.createClass({ setIsUploadReady={this.setIsUploadReady} isReadyForFormSubmission={formSubmissionValidation.atLeastOneUploadedFile} isFineUploaderActive={this.props.isFineUploaderActive} - onLoggedOut={this.props.onLoggedOut} disabled={!this.props.isFineUploaderEditable} enableLocalHashing={enableLocalHashing} uploadMethod={this.props.location.query.method} /> diff --git a/js/components/ascribe_forms/input_fineuploader.js b/js/components/ascribe_forms/input_fineuploader.js index 948521c0..1a9889db 100644 --- a/js/components/ascribe_forms/input_fineuploader.js +++ b/js/components/ascribe_forms/input_fineuploader.js @@ -38,7 +38,6 @@ const InputFineUploader = React.createClass({ // a user is actually not logged in already to prevent him from droping files // before login in isFineUploaderActive: bool, - onLoggedOut: func, enableLocalHashing: bool, uploadMethod: string, @@ -51,7 +50,10 @@ const InputFineUploader = React.createClass({ fileClassToUpload: shape({ singular: string, plural: string - }) + }), + + // Provided by `Property` + onChange: React.PropTypes.func }, getDefaultProps() { @@ -101,16 +103,16 @@ const InputFineUploader = React.createClass({ setIsUploadReady, isReadyForFormSubmission, areAssetsDownloadable, - onLoggedOut, enableLocalHashing, + uploadMethod, fileClassToUpload, - location } = this.props; + disabled } = this.props; let editable = this.props.isFineUploaderActive; // if disabled is actually set by property, we want to override // isFineUploaderActive - if(typeof this.props.disabled !== 'undefined') { - editable = !this.props.disabled; + if(typeof disabled !== 'undefined') { + editable = !disabled; } return ( @@ -139,10 +141,9 @@ const InputFineUploader = React.createClass({ 'X-CSRFToken': getCookie(AppConstants.csrftoken) } }} - onInactive={this.props.onLoggedOut} - enableLocalHashing={this.props.enableLocalHashing} - uploadMethod={this.props.uploadMethod} - fileClassToUpload={this.props.fileClassToUpload} /> + enableLocalHashing={enableLocalHashing} + uploadMethod={uploadMethod} + fileClassToUpload={fileClassToUpload} /> ); } }); diff --git a/js/components/ascribe_uploader/ascribe_file_drag_and_drop/file_drag_and_drop.js b/js/components/ascribe_uploader/ascribe_file_drag_and_drop/file_drag_and_drop.js index 0cc7ff5e..2f3d6af5 100644 --- a/js/components/ascribe_uploader/ascribe_file_drag_and_drop/file_drag_and_drop.js +++ b/js/components/ascribe_uploader/ascribe_file_drag_and_drop/file_drag_and_drop.js @@ -15,7 +15,6 @@ let FileDragAndDrop = React.createClass({ className: React.PropTypes.string, onDrop: React.PropTypes.func.isRequired, onDragOver: React.PropTypes.func, - onInactive: React.PropTypes.func, filesToUpload: React.PropTypes.array, handleDeleteFile: React.PropTypes.func, handleCancelFile: React.PropTypes.func, @@ -63,11 +62,6 @@ let FileDragAndDrop = React.createClass({ let files; if(this.props.dropzoneInactive) { - // if there is a handle function for doing stuff - // when the dropzone is inactive, then call it - if(this.props.onInactive) { - this.props.onInactive(); - } return; } @@ -119,9 +113,6 @@ let FileDragAndDrop = React.createClass({ if(this.props.dropzoneInactive) { // if there is a handle function for doing stuff // when the dropzone is inactive, then call it - if(this.props.onInactive) { - this.props.onInactive(); - } return; } diff --git a/js/components/ascribe_uploader/react_s3_fine_uploader.js b/js/components/ascribe_uploader/react_s3_fine_uploader.js index bf4250c5..911f887e 100644 --- a/js/components/ascribe_uploader/react_s3_fine_uploader.js +++ b/js/components/ascribe_uploader/react_s3_fine_uploader.js @@ -99,7 +99,6 @@ let ReactS3FineUploader = React.createClass({ areAssetsDownloadable: React.PropTypes.bool, areAssetsEditable: React.PropTypes.bool, defaultErrorMessage: React.PropTypes.string, - onInactive: React.PropTypes.func, // We encountered some cases where people had difficulties to upload their // works to ascribe due to a slow internet connection. @@ -891,7 +890,6 @@ let ReactS3FineUploader = React.createClass({ multiple, areAssetsDownloadable, areAssetsEditable, - onInactive, enableLocalHashing, fileClassToUpload, fileInputElement: FileInputElement, @@ -901,7 +899,6 @@ let ReactS3FineUploader = React.createClass({ multiple, areAssetsDownloadable, areAssetsEditable, - onInactive, enableLocalHashing, uploadMethod, fileClassToUpload, diff --git a/js/components/register_piece.js b/js/components/register_piece.js index 43ac7bb7..bc0639e3 100644 --- a/js/components/register_piece.js +++ b/js/components/register_piece.js @@ -45,10 +45,7 @@ let RegisterPiece = React.createClass( { UserStore.getState(), WhitelabelStore.getState(), PieceListStore.getState(), - { - selectedLicense: 0, - isFineUploaderActive: false - }); + ); }, componentDidMount() { @@ -66,13 +63,6 @@ let RegisterPiece = React.createClass( { onChange(state) { this.setState(state); - - if(this.state.currentUser && this.state.currentUser.email) { - // we should also make the fineuploader component editable again - this.setState({ - isFineUploaderActive: true - }); - } }, handleSuccess(response){ @@ -117,7 +107,7 @@ let RegisterPiece = React.createClass( { {this.props.children} diff --git a/js/components/whitelabel/wallet/components/cyland/cyland_register_piece.js b/js/components/whitelabel/wallet/components/cyland/cyland_register_piece.js index 470da761..85cd01bd 100644 --- a/js/components/whitelabel/wallet/components/cyland/cyland_register_piece.js +++ b/js/components/whitelabel/wallet/components/cyland/cyland_register_piece.js @@ -53,8 +53,6 @@ let CylandRegisterPiece = React.createClass({ PieceStore.getState(), WhitelabelStore.getState(), { - selectedLicense: 0, - isFineUploaderActive: false, step: 0 }); }, @@ -90,13 +88,6 @@ let CylandRegisterPiece = React.createClass({ onChange(state) { this.setState(state); - - if(this.state.currentUser && this.state.currentUser.email) { - // we should also make the fineuploader component editable again - this.setState({ - isFineUploaderActive: true - }); - } }, handleRegisterSuccess(response){ @@ -167,11 +158,6 @@ let CylandRegisterPiece = React.createClass({ } }, - // basically redirects to the second slide (index: 1), when the user is not logged in - onLoggedOut() { - this.history.pushState(null, '/login'); - }, - render() { let today = new Moment(); @@ -197,9 +183,8 @@ let CylandRegisterPiece = React.createClass({ enableLocalHashing={false} headerMessage={getLangText('Submit to Cyland Archive')} submitMessage={getLangText('Submit')} - isFineUploaderActive={this.state.isFineUploaderActive} + isFineUploaderActive={true} handleSuccess={this.handleRegisterSuccess} - onLoggedOut={this.onLoggedOut} location={this.props.location}/> diff --git a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_register_piece.js b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_register_piece.js index d3f93ddf..16d893b7 100644 --- a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_register_piece.js +++ b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_register_piece.js @@ -85,13 +85,6 @@ let IkonotvRegisterPiece = React.createClass({ onChange(state) { this.setState(state); - - if(this.state.currentUser && this.state.currentUser.email) { - // we should also make the fineuploader component editable again - this.setState({ - isFineUploaderActive: true - }); - } }, @@ -157,19 +150,6 @@ let IkonotvRegisterPiece = React.createClass({ ); }, - changeSlide() { - // only transition to the login store, if user is not logged in - // ergo the currentUser object is not properly defined - if(this.state.currentUser && !this.state.currentUser.email) { - this.onLoggedOut(); - } - }, - - // basically redirects to the second slide (index: 1), when the user is not logged in - onLoggedOut() { - this.history.pushState(null, '/login'); - }, - canSubmit() { let currentUser = this.state.currentUser; return currentUser && currentUser.acl && currentUser.acl.acl_wallet_submit; @@ -260,9 +240,8 @@ let IkonotvRegisterPiece = React.createClass({ enableLocalHashing={false} headerMessage={getLangText('Register work')} submitMessage={getLangText('Register')} - isFineUploaderActive={this.state.isFineUploaderActive} + isFineUploaderActive={true} handleSuccess={this.handleRegisterSuccess} - onLoggedOut={this.onLoggedOut} location={this.props.location}/> diff --git a/js/components/whitelabel/wallet/components/market/market_register_piece.js b/js/components/whitelabel/wallet/components/market/market_register_piece.js index 9a919561..3572fd6d 100644 --- a/js/components/whitelabel/wallet/components/market/market_register_piece.js +++ b/js/components/whitelabel/wallet/components/market/market_register_piece.js @@ -106,11 +106,6 @@ let MarketRegisterPiece = React.createClass({ ); }, - // basically redirects to the second slide (index: 1), when the user is not logged in - onLoggedOut() { - this.history.pushState(null, '/login'); - }, - render() { setDocumentTitle(getLangText('Register a new piece')); @@ -133,7 +128,6 @@ let MarketRegisterPiece = React.createClass({ submitMessage={getLangText('Proceed to additional details')} isFineUploaderActive={true} handleSuccess={this.handleRegisterSuccess} - onLoggedOut={this.onLoggedOut} location={this.props.location}> Date: Wed, 2 Dec 2015 13:52:17 +0100 Subject: [PATCH 4/4] Rearrange handleDrop() to flow more naturally --- .../file_drag_and_drop.js | 65 +++++++++---------- 1 file changed, 30 insertions(+), 35 deletions(-) diff --git a/js/components/ascribe_uploader/ascribe_file_drag_and_drop/file_drag_and_drop.js b/js/components/ascribe_uploader/ascribe_file_drag_and_drop/file_drag_and_drop.js index 2f3d6af5..1157a540 100644 --- a/js/components/ascribe_uploader/ascribe_file_drag_and_drop/file_drag_and_drop.js +++ b/js/components/ascribe_uploader/ascribe_file_drag_and_drop/file_drag_and_drop.js @@ -59,23 +59,21 @@ let FileDragAndDrop = React.createClass({ handleDrop(event) { event.preventDefault(); event.stopPropagation(); - let files; - if(this.props.dropzoneInactive) { - return; + if (!this.props.dropzoneInactive) { + let files; + + // handle Drag and Drop + if(event.dataTransfer && event.dataTransfer.files.length > 0) { + files = event.dataTransfer.files; + } else if(event.target.files) { // handle input type file + files = event.target.files; + } + + if(typeof this.props.onDrop === 'function' && files) { + this.props.onDrop(files); + } } - - // handle Drag and Drop - if(event.dataTransfer && event.dataTransfer.files.length > 0) { - files = event.dataTransfer.files; - } else if(event.target.files) { // handle input type file - files = event.target.files; - } - - if(typeof this.props.onDrop === 'function' && files) { - this.props.onDrop(files); - } - }, handleDeleteFile(fileId) { @@ -107,28 +105,25 @@ let FileDragAndDrop = React.createClass({ }, handleOnClick() { - let evt; - // when multiple is set to false and the user already uploaded a piece, - // do not propagate event - if(this.props.dropzoneInactive) { - // if there is a handle function for doing stuff - // when the dropzone is inactive, then call it - return; - } + // do not propagate event if the drop zone's inactive, + // for example when multiple is set to false and the user already uploaded a piece + if (!this.props.dropzoneInactive) { + let evt; - try { - evt = new MouseEvent('click', { - view: window, - bubbles: true, - cancelable: true - }); - } catch(e) { - // For browsers that do not support the new MouseEvent syntax - evt = document.createEvent('MouseEvents'); - evt.initMouseEvent('click', true, true, window, 0, 0, 0, 80, 20, false, false, false, false, 0, null); - } + try { + evt = new MouseEvent('click', { + view: window, + bubbles: true, + cancelable: true + }); + } catch(e) { + // For browsers that do not support the new MouseEvent syntax + evt = document.createEvent('MouseEvents'); + evt.initMouseEvent('click', true, true, window, 0, 0, 0, 80, 20, false, false, false, false, 0, null); + } - this.refs.fileSelector.getDOMNode().dispatchEvent(evt); + this.refs.fileSelector.getDOMNode().dispatchEvent(evt); + } }, render: function () {