LBRYCommunity/lbry-desktop
1
0
Fork 0
Code Issues 596 Pull requests 6 Projects Releases 238 Packages Wiki Activity

more file tile refactor and fix file info unsubscribe

Browse source
This commit is contained in:
Jeremy Kauffman 2017-01-12 22:23:12 -05:00 committed by Alex Liebowitz
parent b7f23aa0dd
commit e0eb36d032
5 changed files with 60 additions and 38 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
js/component/common.js
View file

@ -124,7 +124,7 @@ export let Thumbnail = React.createClass({
_isMounted: false,
propTypes: {
src: React.PropTypes.string.isRequired,
src: React.PropTypes.string,
},
handleError: function() {
if (this.state.imageUrl != this._defaultImageUri) {

2
js/component/file-actions.js
View file

@ -168,7 +168,7 @@ export let FileActions = React.createClass({
componentWillUnmount: function() {
this._isMounted = false;
if (this._fileInfoSubscribeId) {
lbry.fileInfoUnsubscribe(this.props.name, this._fileInfoSubscribeId);
lbry.fileInfoUnsubscribe(this.props.streamName, this._fileInfoSubscribeId);
}
},
render: function() {

90
js/component/file-tile.js
View file

@ -49,11 +49,10 @@ let FilePrice = React.createClass({
}
});
let FileTile = React.createClass({
_isMounted: false,
/*should be merged into FileTile once FileTile is refactored to take a single id*/
let FileTileStream = React.createClass({
propTypes: {
name: React.PropTypes.string,
metadata: React.PropTypes.object,
sdHash: React.PropTypes.string,
showPrice: React.PropTypes.bool,
obscureNsfw: React.PropTypes.bool,
@ -62,12 +61,11 @@ let FileTile = React.createClass({
getInitialState: function() {
return {
metadata: null,
title: null,
showNsfwHelp: false,
isRemoved: false
}
},
getDefaultProps: function() {
return {
hideOnRemove: false,
@ -76,7 +74,7 @@ let FileTile = React.createClass({
}
},
handleMouseOver: function() {
if (this.props.obscureNsfw && this.state.metadata && this.state.metadata.nsfw) {
if (this.props.obscureNsfw && this.props.metadata && this.props.metadata.nsfw) {
this.setState({
showNsfwHelp: true,
});
@ -94,34 +92,20 @@ let FileTile = React.createClass({
isRemoved: true,
});
},
componentDidMount: function() {
this._isMounted = true;
lbry.resolveName(this.props.name, (metadata) => {
if (this._isMounted) {
this.setState({
metadata: metadata,
title: metadata && metadata.title ? metadata.title : ('lbry://' + this.props.name),
});
}
});
},
componentWillUnmount: function() {
this._isMounted = false;
},
render: function() {
if (this.state.metadata === null || (this.props.hideOnRemove && this.state.isRemoved)) {
if (this.props.metadata === null || (this.props.hideOnRemove && this.state.isRemoved)) {
return null;
}
const obscureNsfw = this.props.obscureNsfw && this.state.metadata.nsfw;
const metadata = this.props.metadata || {},
obscureNsfw = this.props.obscureNsfw && metadata.nsfw,
title = metadata.title ? metadata.title : ('lbry://' + this.props.name);
return (
<section className={ 'file-tile card ' + (obscureNsfw ? 'card-obscured ' : '') } onMouseEnter={this.handleMouseOver} onMouseLeave={this.handleMouseOut}>
<div className="row-fluid card-content file-tile__row">
<div className="span3">
<a href={'/?show=' + this.props.name}><Thumbnail className="file-tile__thumbnail" src={this.state.metadata.thumbnail} alt={'Photo for ' + (this.state.metadata.title || this.props.name)} /></a>
<a href={'/?show=' + this.props.name}><Thumbnail className="file-tile__thumbnail" src={metadata.thumbnail} alt={'Photo for ' + (title || this.props.name)} /></a>
</div>
<div className="span9">
{ this.props.showPrice
@ -131,29 +115,67 @@ let FileTile = React.createClass({
<h3 className="file-tile__title">
<a href={'/?show=' + this.props.name}>
<TruncatedText lines={2}>
{this.state.metadata.title}
{title}
</TruncatedText>
</a>
</h3>
<FileActions streamName={this.props.name} metadata={this.state.metadata} />
<FileActions streamName={this.props.name} metadata={metadata} />
<p className="file-tile__description">
<TruncatedText lines={3}>
{this.state.metadata.description}
{metadata.description}
</TruncatedText>
</p>
</div>
</div>
{this.state.showNsfwHelp
? <div className='card-overlay'>
<p>
This content is Not Safe For Work.
To view adult content, please change your <Link href="?settings" label="Settings" />.
</p>
</div>
<p>
This content is Not Safe For Work.
To view adult content, please change your <Link href="?settings" label="Settings" />.
</p>
</div>
: null}
</section>
);
}
});
let FileTile = React.createClass({
_isMounted: false,
propTypes: {
name: React.PropTypes.string
},
getInitialState: function() {
return {
sdHash: null,
metadata: null
}
},
componentDidMount: function() {
this._isMounted = true;
lbry.resolveName(this.props.name, (metadata) => {
if (this._isMounted) {
this.setState({
sdHash: metadata.sources.lbry_sd_hash,
metadata: metadata,
});
}
});
},
componentWillUnmount: function() {
this._isMounted = false;
},
render: function() {
if (this.state.metadata === null || this.state.sdHash === null) {
return null;
}
return <FileTileStream name={this.props.name} sdHash={this.state.sdHash} metadata={this.state.metadata} />;
}
});
export default FileTile;

2
js/lbry.js
View file

@ -506,7 +506,7 @@ lbry.fileInfoSubscribeByName = function(name, callback) {
// }
lbry.fileInfoUnsubscribe = function(name, subscribeId) {
delete lbry._fileInfoSubscribeCallbacks[name][subscribeId];
lbry._fileInfoSubscribeCallbacks[name] = lbry._fileInfoSubscribeCallbacks[name].splice(subscribeId, 1);
}
export default lbry;

2
js/page/discover.js
View file

@ -44,7 +44,7 @@ var SearchResults = React.createClass({
var rows = [];
this.props.results.forEach(function({name, value}) {
rows.push(
<FileTile key={name} name={name} sdHash={value.sources.lbry_sd_hash} metadata={value} />
<FileTile key={name} name={name} />
);
});
return (