diff --git a/js/components/ascribe_detail/media_container.js b/js/components/ascribe_detail/media_container.js index 6ac2f745..d31a205f 100644 --- a/js/components/ascribe_detail/media_container.js +++ b/js/components/ascribe_detail/media_container.js @@ -92,7 +92,7 @@ let MediaContainer = React.createClass({ aclObject={this.props.content.acl} aclName="acl_download"> {embed} diff --git a/js/components/ascribe_media/media_player.js b/js/components/ascribe_media/media_player.js index a7e56fb7..19d6a1c7 100644 --- a/js/components/ascribe_media/media_player.js +++ b/js/components/ascribe_media/media_player.js @@ -50,25 +50,35 @@ let Other = React.createClass({ let Image = React.createClass({ propTypes: { - url: React.PropTypes.string.isRequired, + url: React.PropTypes.string, preview: React.PropTypes.string.isRequired }, mixins: [InjectInHeadMixin], componentDidMount() { - this.inject('https://code.jquery.com/jquery-2.1.4.min.js') - .then(() => - Q.all([ - this.inject(AppConstants.baseUrl + 'static/thirdparty/shmui/shmui.css'), - this.inject(AppConstants.baseUrl + 'static/thirdparty/shmui/jquery.shmui.js') - ]).then(() => { window.jQuery('.shmui-ascribe').shmui(); })); + if(this.props.url) { + this.inject('https://code.jquery.com/jquery-2.1.4.min.js') + .then(() => + Q.all([ + this.inject(AppConstants.baseUrl + 'static/thirdparty/shmui/shmui.css'), + this.inject(AppConstants.baseUrl + 'static/thirdparty/shmui/jquery.shmui.js') + ]).then(() => { window.jQuery('.shmui-ascribe').shmui(); })); + } }, render() { - return ( - - ); + const { url, preview } = this.props; + + if(url) { + return ( + + ); + } else { + return ( + + ); + } } }); @@ -202,26 +212,50 @@ let MediaPlayer = React.createClass({ }, render() { - if (this.props.mimetype === 'video' && this.props.encodingStatus !== undefined && this.props.encodingStatus !== 100) { + const { mimetype, + preview, + url, + extraData, + encodingStatus } = this.props; + + if (mimetype === 'video' && encodingStatus !== undefined && encodingStatus !== 100) { return (

We successfully received your video and it is now being encoded.
You can leave this page and check back on the status later.

-
); } else { - let Component = resourceMap[this.props.mimetype] || Other; + let Component = resourceMap[mimetype] || Other; + let componentProps = { + preview, + url, + extraData, + encodingStatus + }; + + // Since the launch of the portfolio whitelabel submission, + // we allow the user to specify a thumbnail upon piece-registration. + // As the `Component` is chosen according to its filetype but could potentially + // have a manually submitted thumbnail, we match if the to `Mediaplayer` submitted thumbnail + // is not the generally used fallback `url` (ascribe_spiral.png). + // + // If this is the case, we disable shmui by deleting the original `url` prop and replace + // the assigned component to `Image`. + if(!decodeURIComponent(preview).match(/https:\/\/.*\/media\/thumbnails\/ascribe_spiral.png/) && + Component === Other) { + Component = resourceMap.image; + delete componentProps.url; + } + return (
- +
); }