2016-10-25 21:36:33 +13:00
|
|
|
|
|
|
|
|
import React, { PropTypes } from 'react'
|
|
|
|
|
import FontAwesome from 'react-fontawesome'
|
|
|
|
|
import { Link } from 'react-router'
|
|
|
|
|
|
|
|
|
|
export default class ArtistSentence extends React.Component{
|
|
|
|
|
|
2017-10-10 13:05:28 +13:00
|
|
|
constructor(props){
|
2016-10-25 21:36:33 +13:00
|
|
|
super(props);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
render(){
|
2017-10-10 13:05:28 +13:00
|
|
|
if (!this.props.artists ) return <span>-</span>
|
2016-11-08 13:36:13 +13:00
|
|
|
|
2016-10-25 21:36:33 +13:00
|
|
|
return (
|
2016-11-25 16:08:19 +13:00
|
|
|
<span className={ this.props.className ? this.props.className+" artist-sentence" : "artist-sentence" }>
|
2016-10-25 21:36:33 +13:00
|
|
|
{
|
2017-10-10 13:05:28 +13:00
|
|
|
this.props.artists.map((artist, index) => {
|
2017-01-14 22:32:39 +13:00
|
|
|
if (!artist) return <span>-</span>
|
2016-10-25 21:36:33 +13:00
|
|
|
var separator = null;
|
2017-10-10 13:05:28 +13:00
|
|
|
if (index == this.props.artists.length - 2){
|
2016-10-25 21:36:33 +13:00
|
|
|
separator = ' and ';
|
2017-10-10 13:05:28 +13:00
|
|
|
}else if (index < this.props.artists.length - 2){
|
2016-10-25 21:36:33 +13:00
|
|
|
separator = ', ';
|
|
|
|
|
}
|
2017-01-15 11:40:08 +13:00
|
|
|
if (!artist.name){
|
|
|
|
|
var content = <span>-</span>
|
2017-05-12 05:22:57 +12:00
|
|
|
} else if (!artist.uri || this.props.nolinks){
|
2016-11-08 13:36:13 +13:00
|
|
|
var content = <span>{ artist.name }</span>
|
2017-10-10 13:32:04 +13:00
|
|
|
} else {
|
2017-05-12 05:22:57 +12:00
|
|
|
var content = <Link className="artist" to={global.baseURL+'artist/'+artist.uri}>{ artist.name }</Link>
|
2016-11-08 13:36:13 +13:00
|
|
|
}
|
2016-10-25 21:36:33 +13:00
|
|
|
return (
|
2016-11-07 18:09:42 +13:00
|
|
|
<span key={'index_'+artist.uri}>
|
2016-11-08 13:36:13 +13:00
|
|
|
{ content }
|
|
|
|
|
{ separator }
|
2016-10-25 21:36:33 +13:00
|
|
|
</span>
|
|
|
|
|
);
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
</span>
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
}
|