ascribe/onion
1
0
Fork 0
mirror of https://github.com/ascribe/onion.git synced 2024-06-28 00:28:00 +02:00
Code Issues Releases Wiki Activity

Add Lumenus specific data forms to edition and piece details

Browse Source
This commit is contained in:
Brett Sun 2015-10-28 11:26:54 +01:00
parent 82b49fc653
commit c72a5aa308
11 changed files with 170 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
js/components/ascribe_detail/edition.js
View File

@ -40,6 +40,8 @@ import { getLangText } from '../../utils/lang_utils';
*/
let Edition = React.createClass({
propTypes: {
actionPanelButtonListType: React.PropTypes.func,
furtherDetailsType: React.PropTypes.func,
edition: React.PropTypes.object,
loadEdition: React.PropTypes.func,
location: React.PropTypes.object
@ -47,6 +49,12 @@ let Edition = React.createClass({
mixins: [History],
getDefaultProps() {
return {
furtherDetailsType: FurtherDetails
};
},
getInitialState() {
return UserStore.getState();
},
@ -74,6 +82,8 @@ let Edition = React.createClass({
},
render() {
let FurtherDetailsType = this.props.furtherDetailsType;
return (
<Row>
<Col md={6}>
@ -89,6 +99,7 @@ let Edition = React.createClass({
<hr/>
</div>
<EditionSummary
actionPanelButtonListType={this.props.actionPanelButtonListType}
edition={this.props.edition}
currentUser={this.state.currentUser}
handleSuccess={this.props.loadEdition}/>
@ -151,13 +162,13 @@ let Edition = React.createClass({
show={this.props.edition.acl.acl_edit
|| Object.keys(this.props.edition.extra_data).length > 0
|| this.props.edition.other_data.length > 0}>
<FurtherDetails
<FurtherDetailsType
editable={this.props.edition.acl.acl_edit}
pieceId={this.props.edition.parent}
extraData={this.props.edition.extra_data}
otherData={this.props.edition.other_data}
handleSuccess={this.props.loadEdition}
location={this.props.location}/>
location={this.props.location} />
</CollapsibleParagraph>
<CollapsibleParagraph
@ -174,6 +185,7 @@ let Edition = React.createClass({
let EditionSummary = React.createClass({
propTypes: {
actionPanelButtonListType: React.PropTypes.func,
edition: React.PropTypes.object,
currentUser: React.PropTypes.object,
handleSuccess: React.PropTypes.func
@ -198,7 +210,7 @@ let EditionSummary = React.createClass({
},
render() {
let { edition, currentUser } = this.props;
let { actionPanelButtonListType, edition, currentUser } = this.props;
return (
<div className="ascribe-detail-header">
<EditionDetailProperty
@ -214,6 +226,7 @@ let EditionSummary = React.createClass({
<LicenseDetail license={edition.license_type}/>
{this.getStatus()}
<EditionActionPanel
actionPanelButtonListType={actionPanelButtonListType}
edition={edition}
currentUser={currentUser}
handleSuccess={this.handleSuccess} />

26
js/components/ascribe_detail/edition_action_panel.js
View File

@ -34,6 +34,7 @@ import { getLangText } from '../../utils/lang_utils';
*/
let EditionActionPanel = React.createClass({
propTypes: {
actionPanelButtonListType: React.PropTypes.func,
edition: React.PropTypes.object,
currentUser: React.PropTypes.object,
handleSuccess: React.PropTypes.func
@ -41,6 +42,12 @@ let EditionActionPanel = React.createClass({
mixins: [History],
getDefaultProps() {
return {
actionPanelButtonListType: AclButtonList
};
},
getInitialState() {
return PieceListStore.getState();
},
@ -85,7 +92,8 @@ let EditionActionPanel = React.createClass({
},
render(){
let {edition, currentUser} = this.props;
let { edition, currentUser } = this.props;
let ActionPanelButtonListType = this.props.actionPanelButtonListType;
if (edition &&
edition.notifications &&
@ -102,7 +110,7 @@ let EditionActionPanel = React.createClass({
return (
<Row>
<Col md={12}>
<AclButtonList
<ActionPanelButtonListType
className="text-center ascribe-button-list"
availableAcls={edition.acl}
editions={[edition]}
@ -119,8 +127,9 @@ let EditionActionPanel = React.createClass({
name="bitcoin_id"
hidden={true}>
<input
type="text"
value={edition.bitcoin_id} />
type="text"
value={edition.bitcoin_id}
readOnly />
</Property>
<Button bsStyle="danger" className="btn-delete pull-center" bsSize="small" type="submit">
{getLangText('WITHDRAW TRANSFER')}
@ -139,8 +148,9 @@ let EditionActionPanel = React.createClass({
name="bitcoin_id"
hidden={true}>
<input
type="text"
value={edition.bitcoin_id} />
type="text"
value={edition.bitcoin_id}
readOnly />
</Property>
<Button bsStyle="danger" className="btn-delete pull-center" bsSize="small" type="submit">
{getLangText('WITHDRAW CONSIGN')}
@ -158,7 +168,7 @@ let EditionActionPanel = React.createClass({
<DeleteButton
handleSuccess={this.handleDeleteSuccess}
editions={[edition]}/>
</AclButtonList>
</ActionPanelButtonListType>
</Col>
</Row>
);
@ -166,4 +176,4 @@ let EditionActionPanel = React.createClass({
}
});
export default EditionActionPanel;
export default EditionActionPanel;

4
js/components/ascribe_detail/edition_container.js
View File

@ -17,6 +17,8 @@ import { setDocumentTitle } from '../../utils/dom_utils';
*/
let EditionContainer = React.createClass({
propTypes: {
actionPanelButtonListType: React.PropTypes.func,
furtherDetailsType: React.PropTypes.func,
location: React.PropTypes.object
},
@ -71,6 +73,8 @@ let EditionContainer = React.createClass({
return (
<Edition
actionPanelButtonListType={this.props.actionPanelButtonListType}
furtherDetailsType={this.props.furtherDetailsType}
edition={this.state.edition}
loadEdition={this.loadEdition}
location={this.props.location}/>

12
js/components/ascribe_detail/piece_container.js
View File

@ -46,11 +46,18 @@ import { setDocumentTitle } from '../../utils/dom_utils';
*/
let PieceContainer = React.createClass({
propTypes: {
furtherDetailsType: React.PropTypes.func,
location: React.PropTypes.object
},
mixins: [History],
getDefaultProps() {
return {
furtherDetailsType: FurtherDetails
};
},
getInitialState() {
return mergeOptions(
UserStore.getState(),
@ -83,7 +90,7 @@ let PieceContainer = React.createClass({
onChange(state) {
/*
ATTENTION:
THIS IS JUST A TEMPORARY USABILITY FIX THAT ESSENTIALLY REMOVES THE LOAN BUTTON
FROM THE PIECE DETAIL PAGE SO THAT USERS DO NOT CONFUSE A PIECE WITH AN EDITION.
@ -212,6 +219,7 @@ let PieceContainer = React.createClass({
render() {
if(this.state.piece && this.state.piece.title) {
let FurtherDetailsType = this.props.furtherDetailsType;
setDocumentTitle([this.state.piece.artist_name, this.state.piece.title].join(', '));
return (
@ -263,7 +271,7 @@ let PieceContainer = React.createClass({
|| Object.keys(this.state.piece.extra_data).length > 0
|| this.state.piece.other_data.length > 0}
defaultExpanded={true}>
<FurtherDetails
<FurtherDetailsType
editable={this.state.piece.acl.acl_edit}
pieceId={this.state.piece.id}
extraData={this.state.piece.extra_data}

30
js/components/whitelabel/wallet/components/lumenus/lumenus_detail/lumenus_edition_container.js Normal file
View File

@ -0,0 +1,30 @@
'use strict';
import React from 'react';
import LumenusFurtherDetails from './lumenus_further_details';
import LumenusAclButtonList from '../lumenus_buttons/lumenus_acl_button_list';
import EditionContainer from '../../../../../ascribe_detail/edition_container';
let LumenusEditionContainer = React.createClass({
propTypes: {
params: React.PropTypes.object,
location: React.PropTypes.object
},
render() {
return (
<div>
<EditionContainer
params={this.props.params}
actionPanelButtonListType={LumenusAclButtonList}
furtherDetailsType={LumenusFurtherDetails}
location={this.props.location} />
</div>
);
}
});
export default LumenusEditionContainer;

46
js/components/whitelabel/wallet/components/lumenus/lumenus_detail/lumenus_further_details.js Normal file
View File

@ -0,0 +1,46 @@
'use strict';
import React from 'react';
import LumenusAdditionalDataForm from '../lumenus_forms/lumenus_additional_data_form'
import GlobalNotificationModel from '../../../../../../models/global_notification_model';
import GlobalNotificationActions from '../../../../../../actions/global_notification_actions';
let FurtherDetails = React.createClass({
propTypes: {
pieceId: React.PropTypes.number,
extraData: React.PropTypes.object,
otherData: React.PropTypes.arrayOf(React.PropTypes.object),
handleSuccess: React.PropTypes.func,
location: React.PropTypes.object
},
showNotification() {
this.props.handleSuccess();
let notification = new GlobalNotificationModel('Further details updated', 'success');
GlobalNotificationActions.appendGlobalNotification(notification);
},
render() {
const { pieceId, extraData, otherData, handleSuccess, location } = this.props;
// Instead of grabbing the entire piece from the PieceStore and making this component
// stateful, we can put together a piece for the additional form solely based on the props
const piece = {
id: pieceId,
extra_data: extraData,
other_data: otherData
};
return (
<LumenusAdditionalDataForm
piece={piece}
handleSuccess={this.showNotification}
isInline
location={location} />
);
}
});
export default FurtherDetails;

27
js/components/whitelabel/wallet/components/lumenus/lumenus_detail/lumenus_piece_container.js Normal file
View File

@ -0,0 +1,27 @@
'use strict';
import React from 'react';
import LumenusFurtherDetails from './lumenus_further_details';
import PieceContainer from '../../../../../ascribe_detail/piece_container';
let LumenusPieceContainer = React.createClass({
propTypes: {
params: React.PropTypes.object,
location: React.PropTypes.object
},
render() {
return (
<div>
<PieceContainer
params={this.props.params}
furtherDetailsType={LumenusFurtherDetails}
location={this.props.location} />
</div>
);
}
});
export default LumenusPieceContainer;

18
js/components/whitelabel/wallet/components/lumenus/lumenus_forms/lumenus_additional_data_form.js
View File

@ -23,7 +23,11 @@ import { getLangText } from '../../../../../../utils/lang_utils';
let LumenusAdditionalDataForm = React.createClass({
propTypes: {
handleSuccess: React.PropTypes.func,
piece: React.PropTypes.object.isRequired,
piece: React.PropTypes.shape({
id: React.PropTypes.number,
extra_data: React.PropTypes.object,
other_data: React.PropTypes.arrayOf(React.PropTypes.object)
}).isRequired,
isInline: React.PropTypes.bool,
location: React.PropTypes.object
},
@ -78,7 +82,7 @@ let LumenusAdditionalDataForm = React.createClass({
let { piece, isInline, handleSuccess } = this.props;
let buttons, spinner, heading;
if(!isInline) {
if (!isInline) {
buttons = (
<button
type="submit"
@ -103,7 +107,7 @@ let LumenusAdditionalDataForm = React.createClass({
);
}
if(piece && piece.id) {
if (piece && piece.id) {
return (
<Form
className="ascribe-form-bordered"
@ -130,7 +134,7 @@ let LumenusAdditionalDataForm = React.createClass({
rows={1}
defaultValue={piece.extra_data.artist_bio}
placeholder={getLangText('Enter a biography of the artist...')}
required/>
required="required"/>
</Property>
<Property
name='work_description'
@ -139,7 +143,7 @@ let LumenusAdditionalDataForm = React.createClass({
rows={1}
defaultValue={piece.extra_data.work_description}
placeholder={getLangText('Enter a description of the work...')}
required/>
required="required"/>
</Property>
<Property
name='tech_details'
@ -148,7 +152,7 @@ let LumenusAdditionalDataForm = React.createClass({
rows={1}
defaultValue={piece.extra_data.tech_details}
placeholder={getLangText('Enter technological details about the work was produced...')}
required/>
required="required"/>
</Property>
<Property
name='display_instructions'
@ -157,7 +161,7 @@ let LumenusAdditionalDataForm = React.createClass({
rows={1}
defaultValue={piece.extra_data.display_instructions}
placeholder={getLangText('Enter instructions on how to best display the work...')}
required/>
required="required"/>
</Property>
</Form>
);

21
js/components/whitelabel/wallet/components/lumenus/lumenus_piece_list.js
View File

@ -6,35 +6,14 @@ import LumenusAclButtonList from './lumenus_buttons/lumenus_acl_button_list';
import PieceList from '../../../../piece_list';
import UserActions from '../../../../../actions/user_actions';
import UserStore from '../../../../../stores/user_store';
import { getLangText } from '../../../../../utils/lang_utils';
import { setDocumentTitle } from '../../../../../utils/dom_utils';
let LumenusPieceList = React.createClass({
propTypes: {
location: React.PropTypes.object
},
getInitialState() {
return UserStore.getState();
},
componentDidMount() {
UserStore.listen(this.onChange);
UserActions.fetchCurrentUser();
},
componentWillUnmount() {
UserStore.unlisten(this.onChange);
},
onChange(state) {
this.setState(state);
},
render() {
setDocumentTitle(getLangText('Collection'));

11
js/components/whitelabel/wallet/components/lumenus/lumenus_register_piece.js
View File

@ -6,19 +6,17 @@ import { History } from 'react-router';
import Col from 'react-bootstrap/lib/Col';
import Row from 'react-bootstrap/lib/Row';
import LumenusAdditionalDataForm from './lumenus_forms/lumenus_additional_data_form';
import Property from '../../../../ascribe_forms/property';
import RegisterPieceForm from '../../../../ascribe_forms/form_register_piece';
import PieceListStore from '../../../../../stores/piece_list_store';
import PieceListActions from '../../../../../actions/piece_list_actions';
import UserStore from '../../../../../stores/user_store';
import UserActions from '../../../../../actions/user_actions';
import PieceStore from '../../../../../stores/piece_store';
import PieceActions from '../../../../../actions/piece_actions';
import LumenusAdditionalDataForm from './lumenus_forms/lumenus_additional_data_form';
import PieceListStore from '../../../../../stores/piece_list_store';
import PieceListActions from '../../../../../actions/piece_list_actions';
import SlidesContainer from '../../../../ascribe_slides_container/slides_container';
@ -26,7 +24,6 @@ import { getLangText } from '../../../../../utils/lang_utils';
import { setDocumentTitle } from '../../../../../utils/dom_utils';
import { mergeOptions } from '../../../../../utils/general_utils';
let LumenusRegisterPiece = React.createClass({
propTypes: {
location: React.PropTypes.object

6
js/components/whitelabel/wallet/wallet_routes.js
View File

@ -31,6 +31,8 @@ import IkonotvContractNotifications from './components/ikonotv/ikonotv_contract_
import LumenusPieceList from './components/lumenus/lumenus_piece_list';
import LumenusRegisterPiece from './components/lumenus/lumenus_register_piece';
import LumenusPieceContainer from './components/lumenus/lumenus_detail/lumenus_piece_container';
import LumenusEditionContainer from './components/lumenus/lumenus_detail/lumenus_edition_container';
import CCRegisterPiece from './components/cc/cc_register_piece';
@ -181,8 +183,8 @@ let ROUTES = {
path='collection'
component={AuthProxyHandler({to: '/login', when: 'loggedOut'})(LumenusPieceList)}
headerTitle='COLLECTION'/>
<Route path='pieces/:pieceId' component={PieceContainer} />
<Route path='editions/:editionId' component={EditionContainer} />
<Route path='pieces/:pieceId' component={LumenusPieceContainer} />
<Route path='editions/:editionId' component={LumenusEditionContainer} />
<Route path='verify' component={CoaVerifyContainer} />
<Route path='*' component={ErrorNotFoundPage} />
</Route>