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

Change AccordionListItems and parents for loading UserStore from top level app

Browse Source
This commit is contained in:
Brett Sun 2016-01-11 19:06:50 +01:00
parent d4064ee83a
commit 8009174787
7 changed files with 127 additions and 140 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -21,16 +21,16 @@ let AccordionListItem = React.createClass({
},
render() {
const { linkData,
className,
thumbnail,
heading,
subheading,
subsubheading,
buttons,
badge,
children } = this.props;
const {
linkData,
className,
thumbnail,
heading,
subheading,
subsubheading,
buttons,
badge,
children } = this.props;
return (
<div className="row">

5
js/components/ascribe_accordion_list/accordion_list_item_piece.js
View File

@ -34,11 +34,10 @@ let AccordionListItemPiece = React.createClass({
},
getLinkData() {
let { piece } = this.props;
const { piece } = this.props;
if(piece && piece.first_edition) {
if (piece && piece.first_edition) {
return `/editions/${piece.first_edition.bitcoin_id}`;
} else {
return `/pieces/${piece.id}`;
}

7
js/components/ascribe_accordion_list/accordion_list_item_wallet.js
View File

@ -29,8 +29,9 @@ import { mergeOptions } from '../../utils/general_utils';
let AccordionListItemWallet = React.createClass({
propTypes: {
content: React.PropTypes.object.isRequired,
className: React.PropTypes.string,
content: React.PropTypes.object,
thumbnailPlaceholder: React.PropTypes.func,
children: React.PropTypes.oneOfType([
React.PropTypes.arrayOf(React.PropTypes.element),
@ -62,8 +63,8 @@ let AccordionListItemWallet = React.createClass({
this.setState(state);
},
getGlyphicon(){
if ((this.props.content.notifications && this.props.content.notifications.length > 0)){
getGlyphicon() {
if (this.props.content.notifications && this.props.content.notifications.length){
return (
<OverlayTrigger
delay={500}

7
js/components/piece_list.js
View File

@ -325,13 +325,14 @@ let PieceList = React.createClass({
page={this.state.page}
pageSize={this.state.pageSize}
loadingElement={loadingElement}>
{this.state.pieceList.map((piece, i) => {
{this.state.pieceList.map((piece) => {
return (
<AccordionListItemType
key={piece.id}
className="col-xs-12 col-sm-10 col-md-8 col-lg-8 col-sm-offset-1 col-md-offset-2 col-lg-offset-2 ascribe-accordion-list-item"
content={piece}
thumbnailPlaceholder={customThumbnailPlaceholder}
key={i}>
currentUser={currentUser}
thumbnailPlaceholder={customThumbnailPlaceholder}>
<AccordionListItemTableEditions
className="ascribe-accordion-list-item-table col-xs-12 col-sm-10 col-md-8 col-lg-8 col-sm-offset-1 col-md-offset-2 col-lg-offset-2"
parentId={piece.id} />

99
js/components/whitelabel/prize/simple_prize/components/ascribe_accordion_list/accordion_list_item_prize.js
View File

@ -10,8 +10,6 @@ import PieceListStore from '../../../../../../stores/piece_list_store';
import PrizeRatingActions from '../../actions/prize_rating_actions';
import UserStore from '../../../../../../stores/user_store';
import InputCheckbox from '../../../../../ascribe_forms/input_checkbox';
import AccordionListItemPiece from '../../../../../ascribe_accordion_list/accordion_list_item_piece';
@ -23,13 +21,14 @@ import AclProxy from '../../../../../acl_proxy';
import SubmitToPrizeButton from './../ascribe_buttons/submit_to_prize_button';
import { getLangText } from '../../../../../../utils/lang_utils';
import { mergeOptions } from '../../../../../../utils/general_utils';
let AccordionListItemPrize = React.createClass({
propTypes: {
content: React.PropTypes.object.isRequired,
currentUser: React.PropTypes.object.isRequired,
className: React.PropTypes.string,
content: React.PropTypes.object,
children: React.PropTypes.oneOfType([
React.PropTypes.arrayOf(React.PropTypes.element),
React.PropTypes.element
@ -37,20 +36,15 @@ let AccordionListItemPrize = React.createClass({
},
getInitialState() {
return mergeOptions(
PieceListStore.getState(),
UserStore.getState()
);
return PieceListStore.getState();
},
componentDidMount() {
PieceListStore.listen(this.onChange);
UserStore.listen(this.onChange);
},
componentWillUnmount() {
PieceListStore.unlisten(this.onChange);
UserStore.unlisten(this.onChange);
},
onChange(state) {
@ -61,29 +55,30 @@ let AccordionListItemPrize = React.createClass({
PieceListActions.fetchPieceList(this.state.page, this.state.pageSize, this.state.search,
this.state.orderBy, this.state.orderAsc, this.state.filterBy);
let notification = new GlobalNotificationModel(response.notification, 'success', 10000);
const notification = new GlobalNotificationModel(response.notification, 'success', 10000);
GlobalNotificationActions.appendGlobalNotification(notification);
},
getPrizeButtons() {
if (this.state.currentUser && this.state.currentUser.is_jury){
if ((this.props.content.ratings) &&
(this.props.content.ratings.rating || this.props.content.ratings.average)){
const { currentUser, content: { id, ratings } } = this.props;
if (currentUser && (currentUser.is_jury || currentUser.is_judge)) {
if (ratings && (ratings.rating || ratings.average)) {
// jury and rating available
let rating = null,
caption = null;
if (this.props.content.ratings.rating){
rating = parseInt(this.props.content.ratings.rating, 10);
let rating = null;
let caption = null;
if (ratings.rating) {
rating = parseInt(ratings.rating, 10);
caption = getLangText('Your rating');
}
else if (this.props.content.ratings.average){
rating = this.props.content.ratings.average;
caption = getLangText('Average of ' + this.props.content.ratings.num_ratings + ' rating(s)');
} else if (ratings.average) {
rating = ratings.average;
caption = getLangText('Average of ' + ratings.num_ratings + ' rating(s)');
}
return (
<div id="list-rating" className="pull-right">
<Link to={`/pieces/${this.props.content.id}`}>
<Link to={`/pieces/${id}`}>
<StarRating
ref='rating'
name="prize-rating"
@ -94,23 +89,23 @@ let AccordionListItemPrize = React.createClass({
ratingAmount={5} />
</Link>
</div>);
}
else {
if (this.state.currentUser.is_judge){
} else {
if (currentUser.is_judge) {
return (
<div className="react-rating-caption pull-right">
{getLangText('Not rated')}
</div>
);
} else {
// jury and no rating yet
return (
<div className="react-rating-caption pull-right">
<Link to={`/pieces/${id}`}>
{getLangText('Submit your rating')}
</Link>
</div>
);
}
// jury and no rating yet
return (
<div className="react-rating-caption pull-right">
<Link to={`/pieces/${this.props.content.id}`}>
{getLangText('Submit your rating')}
</Link>
</div>
);
}
}
return this.getPrizeButtonsParticipant();
@ -132,8 +127,8 @@ let AccordionListItemPrize = React.createClass({
);
},
handleShortlistSuccess(message){
let notification = new GlobalNotificationModel(message, 'success', 2000);
handleShortlistSuccess(message) {
const notification = new GlobalNotificationModel(message, 'success', 2000);
GlobalNotificationActions.appendGlobalNotification(notification);
},
@ -142,23 +137,17 @@ let AccordionListItemPrize = React.createClass({
this.state.orderBy, this.state.orderAsc, this.state.filterBy);
},
onSelectChange(){
onSelectChange() {
PrizeRatingActions.toggleShortlist(this.props.content.id)
.then(
(res) => {
this.refreshPieceData();
return res;
})
.then(
(res) => {
this.handleShortlistSuccess(res.notification);
}
);
.then((res) => {
this.refreshPieceData();
this.handleShortlistSuccess(res.notification);
});
},
getPrizeBadge(){
if (this.state.currentUser && this.state.currentUser.is_judge) {
getPrizeBadge() {
if (currentUser && currentUser.is_judge) {
return (
<span className="pull-right ascribe-checkbox-wrapper ascribe-checkbox-badge">
<InputCheckbox
@ -166,17 +155,18 @@ let AccordionListItemPrize = React.createClass({
onChange={this.onSelectChange}/>
</span>
);
} else {
return null;
}
return null;
},
render() {
const { children, className, content } = this.props;
const { currentUser } = this.state;
const { children, className, content, currentUser } = this.props;
// Only show the artist name if you are the participant or if you are a judge and the piece is shortlisted
let artistName = ((currentUser.is_jury && !currentUser.is_judge) || (currentUser.is_judge && !content.selected )) ?
const artistName = ((currentUser.is_jury && !currentUser.is_judge) || (currentUser.is_judge && !content.selected )) ?
<span className="glyphicon glyphicon-eye-close" aria-hidden="true"/> : content.artist_name;
return (
<div>
<AccordionListItemPiece
@ -186,7 +176,8 @@ let AccordionListItemPrize = React.createClass({
subsubheading={
<div>
<span>{Moment(content.date_created, 'YYYY-MM-DD').year()}</span>
</div>}
</div>
}
buttons={this.getPrizeButtons()}
badge={this.getPrizeBadge()}>
{children}

55
js/components/whitelabel/wallet/components/cyland/cyland_accordion_list/cyland_accordion_list_item.js
View File

@ -3,27 +3,26 @@
import React from 'react';
import Moment from 'moment';
import AccordionListItemPiece from '../../../../../ascribe_accordion_list/accordion_list_item_piece';
import GlobalNotificationModel from '../../../../../../models/global_notification_model';
import GlobalNotificationActions from '../../../../../../actions/global_notification_actions';
import PieceListActions from '../../../../../../actions/piece_list_actions';
import PieceListStore from '../../../../../../stores/piece_list_store';
import UserStore from '../../../../../../stores/user_store';
import GlobalNotificationModel from '../../../../../../models/global_notification_model';
import GlobalNotificationActions from '../../../../../../actions/global_notification_actions';
import CylandSubmitButton from '../cyland_buttons/cyland_submit_button';
import AccordionListItemPiece from '../../../../../ascribe_accordion_list/accordion_list_item_piece';
import AclProxy from '../../../../../acl_proxy';
import { getLangText } from '../../../../../../utils/lang_utils';
import { mergeOptions } from '../../../../../../utils/general_utils';
let CylandAccordionListItem = React.createClass({
propTypes: {
content: React.PropTypes.object.isRequired,
className: React.PropTypes.string,
content: React.PropTypes.object,
children: React.PropTypes.oneOfType([
React.PropTypes.arrayOf(React.PropTypes.element),
React.PropTypes.element
@ -31,20 +30,15 @@ let CylandAccordionListItem = React.createClass({
},
getInitialState() {
return mergeOptions(
PieceListStore.getState(),
UserStore.getState()
);
return PieceListStore.getState();
},
componentDidMount() {
PieceListStore.listen(this.onChange);
UserStore.listen(this.onChange);
},
componentWillUnmount() {
PieceListStore.unlisten(this.onChange);
UserStore.unlisten(this.onChange);
},
onChange(state) {
@ -55,37 +49,39 @@ let CylandAccordionListItem = React.createClass({
PieceListActions.fetchPieceList(this.state.page, this.state.pageSize, this.state.search,
this.state.orderBy, this.state.orderAsc, this.state.filterBy);
let notification = new GlobalNotificationModel(response.notification, 'success', 10000);
const notification = new GlobalNotificationModel(response.notification, 'success', 10000);
GlobalNotificationActions.appendGlobalNotification(notification);
},
getSubmitButtons() {
const { content } = this.props;
return (
<div>
<AclProxy
aclObject={this.props.content.acl}
aclObject={content.acl}
aclName="acl_wallet_submit">
<CylandSubmitButton
className="pull-right"
piece={this.props.content}
piece={content}
handleSuccess={this.handleSubmitSuccess}/>
</AclProxy>
<AclProxy
aclObject={this.props.content.acl}
aclObject={content.acl}
aclName="acl_wallet_submitted">
<button
disabled
className="btn btn-default btn-xs pull-right">
disabled
className="btn btn-default btn-xs pull-right">
{getLangText('Submitted to Cyland') + ' '}
<span className='ascribe-icon icon-ascribe-ok'/>
</button>
</AclProxy>
<AclProxy
aclObject={this.props.content.acl}
aclObject={content.acl}
aclName="acl_wallet_accepted">
<button
disabled
className="btn btn-default btn-xs pull-right">
disabled
className="btn btn-default btn-xs pull-right">
{getLangText('Loaned to Cyland') + ' '}
<span className='ascribe-icon icon-ascribe-ok'/>
</button>
@ -95,16 +91,19 @@ let CylandAccordionListItem = React.createClass({
},
render() {
const { children, className, content } = this.props;
return (
<AccordionListItemPiece
className={this.props.className}
piece={this.props.content}
className={className}
piece={content}
subsubheading={
<div className="pull-left">
<span>{Moment(this.props.content.date_created, 'YYYY-MM-DD').year()}</span>
</div>}
<span>{Moment(content.date_created, 'YYYY-MM-DD').year()}</span>
</div>
}
buttons={this.getSubmitButtons()}>
{this.props.children}
{children}
</AccordionListItemPiece>
);
}

74
js/components/whitelabel/wallet/components/ikonotv/ikonotv_accordion_list/ikonotv_accordion_list_item.js
View File

@ -3,18 +3,16 @@
import React from 'react';
import Moment from 'moment';
import AccordionListItemPiece from '../../../../../ascribe_accordion_list/accordion_list_item_piece';
import GlobalNotificationModel from '../../../../../../models/global_notification_model';
import GlobalNotificationActions from '../../../../../../actions/global_notification_actions';
import PieceListActions from '../../../../../../actions/piece_list_actions';
import PieceListStore from '../../../../../../stores/piece_list_store';
import UserStore from '../../../../../../stores/user_store';
import GlobalNotificationModel from '../../../../../../models/global_notification_model';
import GlobalNotificationActions from '../../../../../../actions/global_notification_actions';
import IkonotvSubmitButton from '../ikonotv_buttons/ikonotv_submit_button';
import AccordionListItemPiece from '../../../../../ascribe_accordion_list/accordion_list_item_piece';
import AclProxy from '../../../../../acl_proxy';
import { getLangText } from '../../../../../../utils/lang_utils';
@ -23,8 +21,10 @@ import { mergeOptions } from '../../../../../../utils/general_utils';
let IkonotvAccordionListItem = React.createClass({
propTypes: {
content: React.PropTypes.object.isRequired,
currentUser: React.PropTypes.object.isRequired,
className: React.PropTypes.string,
content: React.PropTypes.object,
children: React.PropTypes.oneOfType([
React.PropTypes.arrayOf(React.PropTypes.element),
React.PropTypes.element
@ -32,20 +32,15 @@ let IkonotvAccordionListItem = React.createClass({
},
getInitialState() {
return mergeOptions(
PieceListStore.getState(),
UserStore.getState()
);
return PieceListStore.getState();
},
componentDidMount() {
PieceListStore.listen(this.onChange);
UserStore.listen(this.onChange);
},
componentWillUnmount() {
PieceListStore.unlisten(this.onChange);
UserStore.unlisten(this.onChange);
},
onChange(state) {
@ -56,41 +51,43 @@ let IkonotvAccordionListItem = React.createClass({
PieceListActions.fetchPieceList(this.state.page, this.state.pageSize, this.state.search,
this.state.orderBy, this.state.orderAsc, this.state.filterBy);
let notification = new GlobalNotificationModel(response.notification, 'success', 10000);
const notification = new GlobalNotificationModel(response.notification, 'success', 10000);
GlobalNotificationActions.appendGlobalNotification(notification);
},
getSubmitButtons() {
const { content, currentUser } = this.props;
return (
<div>
<AclProxy
aclObject={this.state.currentUser.acl}
aclObject={currentUser.acl}
aclName="acl_wallet_submit">
<AclProxy
aclObject={this.props.content.acl}
aclObject={content.acl}
aclName="acl_wallet_submit">
<IkonotvSubmitButton
className="btn-xs pull-right"
handleSuccess={this.handleSubmitSuccess}
piece={this.props.content}/>
piece={content}/>
</AclProxy>
</AclProxy>
<AclProxy
aclObject={this.props.content.acl}
aclObject={content.acl}
aclName="acl_wallet_submitted">
<button
disabled
className="btn btn-default btn-xs pull-right">
disabled
className="btn btn-default btn-xs pull-right">
{getLangText('Submitted to IkonoTV') + ' '}
<span className='ascribe-icon icon-ascribe-ok'/>
</button>
</AclProxy>
<AclProxy
aclObject={this.props.content.acl}
aclObject={content.acl}
aclName="acl_wallet_accepted">
<button
disabled
className="btn btn-default btn-xs pull-right">
disabled
className="btn btn-default btn-xs pull-right">
{getLangText('Loaned to IkonoTV') + ' '}
<span className='ascribe-icon icon-ascribe-ok'/>
</button>
@ -100,22 +97,21 @@ let IkonotvAccordionListItem = React.createClass({
},
render() {
if(this.props.content) {
return (
<AccordionListItemPiece
className={this.props.className}
piece={this.props.content}
subsubheading={
<div className="pull-left">
<span>{Moment(this.props.content.date_created, 'YYYY-MM-DD').year()}</span>
</div>}
buttons={this.getSubmitButtons()}>
{this.props.children}
</AccordionListItemPiece>
);
} else {
return null;
}
const { children, className, content } = this.props;
return (
<AccordionListItemPiece
className={className}
piece={content}
subsubheading={
<div className="pull-left">
<span>{Moment(content.date_created, 'YYYY-MM-DD').year()}</span>
</div>
}
buttons={this.getSubmitButtons()}>
{children}
</AccordionListItemPiece>
);
}
});