mirror of
https://github.com/ascribe/onion.git
synced 2024-12-23 01:39:36 +01:00
make media container robust
This commit is contained in:
parent
e3e8f088c7
commit
26fc2f14b3
@ -14,21 +14,13 @@ import AclProxy from '../acl_proxy';
|
||||
|
||||
let MediaContainer = React.createClass({
|
||||
propTypes: {
|
||||
content: React.PropTypes.object
|
||||
digitalWork: React.PropTypes.object.isRequired,
|
||||
thumbnail: React.PropTypes.string
|
||||
},
|
||||
|
||||
render() {
|
||||
let thumbnail = this.props.content.thumbnail;
|
||||
let mimetype = this.props.content.digital_work.mime;
|
||||
let embed = null;
|
||||
let extraData = null;
|
||||
|
||||
if (this.props.content.digital_work.encoding_urls) {
|
||||
extraData = this.props.content.digital_work.encoding_urls.map(e => { return { url: e.url, type: e.label }; });
|
||||
}
|
||||
|
||||
if (['video', 'audio'].indexOf(mimetype) > -1){
|
||||
embed = (
|
||||
getEmbed() {
|
||||
if (['video', 'audio'].indexOf(mimetype) > -1) {
|
||||
return (
|
||||
<CollapsibleButton
|
||||
button={
|
||||
<Button bsSize="xsmall" className="ascribe-margin-1px">
|
||||
@ -44,21 +36,35 @@ let MediaContainer = React.createClass({
|
||||
}/>
|
||||
);
|
||||
}
|
||||
},
|
||||
|
||||
render() {
|
||||
if(!this.props.digitalWork) {
|
||||
return null;
|
||||
}
|
||||
|
||||
let extraData = null;
|
||||
|
||||
if (this.props.digitalWork.encoding_urls) {
|
||||
extraData = this.props.digitalWork.encoding_urls.map(e => { return { url: e.url, type: e.label }; });
|
||||
}
|
||||
|
||||
return (
|
||||
<div>
|
||||
<MediaPlayer mimetype={mimetype}
|
||||
preview={thumbnail}
|
||||
url={this.props.content.digital_work.url}
|
||||
extraData={extraData} />
|
||||
<MediaPlayer
|
||||
mimetype={this.props.digitalWork.mime}
|
||||
preview={this.props.thumbnail}
|
||||
url={this.props.digitalWork.url}
|
||||
extraData={extraData} />
|
||||
<p className="text-center">
|
||||
<AclProxy
|
||||
aclObject={this.props.content.acl}
|
||||
aclName="acl_download">
|
||||
<Button bsSize="xsmall" className="ascribe-margin-1px" href={this.props.content.digital_work.url} target="_blank">
|
||||
<Button bsSize="xsmall" className="ascribe-margin-1px" href={this.props.digitalWork.url} target="_blank">
|
||||
Download <Glyphicon glyph="cloud-download"/>
|
||||
</Button>
|
||||
</AclProxy>
|
||||
{embed}
|
||||
{this.getEmbed()}
|
||||
</p>
|
||||
</div>
|
||||
);
|
||||
|
@ -128,7 +128,8 @@ let Piece = React.createClass({
|
||||
<Row>
|
||||
<Col md={6}>
|
||||
<MediaContainer
|
||||
content={this.props.piece}/>
|
||||
digitalWork={this.props.piece.digitalWork}
|
||||
thumbnail={this.props.piece.thumbnail}/>
|
||||
</Col>
|
||||
<Col md={6} className="ascribe-edition-details">
|
||||
<div className="ascribe-detail-header">
|
||||
|
Loading…
Reference in New Issue
Block a user