diff --git a/react/components/AssetInfo/index.js b/react/components/AssetInfo/index.js index 0fabd5a1..4c0306aa 100644 --- a/react/components/AssetInfo/index.js +++ b/react/components/AssetInfo/index.js @@ -1,12 +1,173 @@ import React from 'react'; -const AssetTitle = ({claimId}) => { - return ( -
-

Show asset info here

-

claimId: {claimId}

-
- ); +class AssetInfo extends React.Component { + constructor (props) { + super(props); + this.toggleSection = this.toggleSection.bind(this); + this.copyToClipboard = this.copyToClipboard.bind(this); + } + toggleSection (event) { + var dataSet = event.target.dataset; + var status = dataSet.status; + var toggle = document.getElementById('show-details-toggle'); + var details = document.getElementById('show-details'); + if (status === 'closed') { + details.hidden = false; + toggle.innerText = '[less]'; + toggle.dataset.status = 'open'; + } else { + details.hidden = true; + toggle.innerText = '[more]'; + toggle.dataset.status = 'closed'; + } + } + copyToClipboard (event) { + var elementToCopy = event.target.dataset.elementtocopy; + var element = document.getElementById(elementToCopy); + element.select(); + try { + document.execCommand('copy'); + } catch (err) { + this.setState({error: 'Oops, unable to copy'}); + } + } + render () { + return ( +
+ {this.props.channelName && +
+
+ Channel: +
+
+ {this.props.channelName} +
+
+ } + + {this.props.description && +
+ {this.props.description} +
+ } + +
+ +
+
+ Embed: +
+
+
+
+ + {(this.props.contentType === 'video/mp4') ? ( + `}/> + ) : ( + `} + /> + )} +
+
+
+ +
+
+
+
+
+ +
+
+
+ Share: +
+
+
+ twitter + facebook + tumblr + reddit +
+
+
+
+ + + +
+ [more] +
+
+ ); + } }; -export default AssetTitle; +// required props +// {channelName, certificateId, description, shortId, name, fileExt, claimId, contentType, thumbnail, host} + +export default AssetInfo; diff --git a/react/components/ChannelClaimsDisplay/index.js b/react/components/ChannelClaimsDisplay/index.js index 09049419..021e03e0 100644 --- a/react/components/ChannelClaimsDisplay/index.js +++ b/react/components/ChannelClaimsDisplay/index.js @@ -1,5 +1,4 @@ import React from 'react'; -import NavBar from 'containers/NavBar'; import AssetPreview from 'components/AssetPreview'; import request from 'utils/request';