fix react warnings
This commit is contained in:
Jeremy Kauffman
parent
53843361b6
commit
b60037b8d9
5 changed files with 73 additions and 77 deletions
16
js/app.js
16
js/app.js
|
|
@ -1,17 +1,15 @@
|
|||
var App = React.createClass({
|
||||
getInitialState: function() {
|
||||
// For now, routes are in format ?page or ?page=args
|
||||
var match, param, val;
|
||||
var match, param, val, viewingPage;
|
||||
[match, param, val] = window.location.search.match(/\??([^=]*)(?:=(.*))?/);
|
||||
|
||||
if (['settings', 'help', 'start', 'watch', 'report', 'files', 'claim', 'show', 'wallet', 'publish'].indexOf(param) != -1) {
|
||||
var viewingPage = param;
|
||||
} else {
|
||||
var viewingPage = 'home';
|
||||
if (param && ['settings', 'help', 'start', 'watch', 'report', 'files', 'claim', 'show', 'wallet', 'publish'].indexOf(param) != -1) {
|
||||
viewingPage = param;
|
||||
}
|
||||
|
||||
return {
|
||||
viewingPage: viewingPage,
|
||||
viewingPage: viewingPage ? viewingPage : 'home',
|
||||
pageArgs: val,
|
||||
};
|
||||
},
|
||||
|
|
@ -22,7 +20,7 @@ var App = React.createClass({
|
|||
}
|
||||
|
||||
var message = 'The version of LBRY you\'re using is not up to date.\n\n' +
|
||||
'Choose "OK" to download the latest version."';
|
||||
'Choose "OK" to download the latest version."';
|
||||
|
||||
lbry.getVersionInfo(function(versionInfo) {
|
||||
if (versionInfo.os_system == 'Darwin') {
|
||||
|
|
@ -33,7 +31,7 @@ var App = React.createClass({
|
|||
if (maj == 0 && min <= 2 && patch <= 2) {
|
||||
// On OS X with version <= 0.2.2, we need to notify user to close manually close LBRY
|
||||
message += '\n\nBefore installing the new version, make sure to exit LBRY, if you started the app ' +
|
||||
'click that LBRY icon in your status bar and choose "Quit."';
|
||||
'click that LBRY icon in your status bar and choose "Quit."';
|
||||
}
|
||||
} else {
|
||||
var updateUrl = 'https://lbry.io/get/lbry.deb';
|
||||
|
|
@ -73,4 +71,4 @@ var App = React.createClass({
|
|||
return <PublishPage />;
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
|
|
@ -3,7 +3,7 @@
|
|||
var Icon = React.createClass({
|
||||
propTypes: {
|
||||
style: React.PropTypes.object,
|
||||
fixed: React.PropTypes.boolean,
|
||||
fixed: React.PropTypes.bool,
|
||||
},
|
||||
render: function() {
|
||||
var className = 'icon ' + ('fixed' in this.props ? 'icon-fixed-width ' : '') + this.props.icon;
|
||||
|
|
@ -13,7 +13,7 @@ var Icon = React.createClass({
|
|||
|
||||
var TruncatedText = React.createClass({
|
||||
propTypes: {
|
||||
limit: React.PropTypes.string,
|
||||
limit: React.PropTypes.number,
|
||||
},
|
||||
getDefaultProps: function() {
|
||||
return {
|
||||
|
|
@ -167,7 +167,7 @@ var WatchLink = React.createClass({
|
|||
if (amount > balance) {
|
||||
alert("You don't have enough LBRY credits to pay for this stream.");
|
||||
} else {
|
||||
window.location = '?watch=' + this.props.streamName;
|
||||
window.location = '?watch=' + this.props.streamName;
|
||||
}
|
||||
});
|
||||
});
|
||||
|
|
@ -179,7 +179,7 @@ var WatchLink = React.createClass({
|
|||
}
|
||||
},
|
||||
|
||||
render: function() {
|
||||
render: function() {
|
||||
return <Link button={this.props.button} hidden={this.props.hidden} style={this.props.style}
|
||||
label={this.props.label} icon={this.props.icon} onClick={this.handleClick} />;
|
||||
}
|
||||
|
|
@ -312,7 +312,7 @@ var MenuItem = React.createClass({
|
|||
href: React.PropTypes.string,
|
||||
label: React.PropTypes.string,
|
||||
icon: React.PropTypes.string,
|
||||
onClick: React.PropTypes.function,
|
||||
onClick: React.PropTypes.func,
|
||||
},
|
||||
getDefaultProps: function() {
|
||||
return {
|
||||
|
|
|
|||
|
|
@ -45,7 +45,7 @@ var SearchResults = React.createClass({
|
|||
var rows = [];
|
||||
this.props.results.forEach(function(result) {
|
||||
rows.push(
|
||||
<SearchResultRow name={result.name} title={result.title} imgUrl={result.thumbnail}
|
||||
<SearchResultRow key={result.name} name={result.name} title={result.title} imgUrl={result.thumbnail}
|
||||
description={result.description} cost_est={result.cost_est} />
|
||||
);
|
||||
});
|
||||
|
|
@ -158,7 +158,7 @@ var FeaturedContentItem = React.createClass({
|
|||
lbry.resolveName(this.props.name, (metadata) => {
|
||||
this.setState({
|
||||
metadata: metadata,
|
||||
title: metadata.title || ('lbry://' + this.props.name),
|
||||
title: metadata && metadata.title ? metadata.title : ('lbry://' + this.props.name),
|
||||
})
|
||||
});
|
||||
lbry.getCostEstimate(this.props.name, (amount) => {
|
||||
|
|
@ -282,7 +282,6 @@ var Discover = React.createClass({
|
|||
search: function() {
|
||||
if (this.state.query)
|
||||
{
|
||||
console.log('search');
|
||||
lbry.search(this.state.query, this.searchCallback.bind(this, this.state.query));
|
||||
}
|
||||
else
|
||||
|
|
@ -320,7 +319,6 @@ var Discover = React.createClass({
|
|||
},
|
||||
|
||||
render: function() {
|
||||
console.log(this.state);
|
||||
return (
|
||||
<main style={discoverMainStyle}>
|
||||
<section><input type="search" style={searchInputStyle} onChange={this.onQueryChange}
|
||||
|
|
@ -376,7 +374,7 @@ var mainMenuStyle = {
|
|||
var MainMenu = React.createClass({
|
||||
render: function() {
|
||||
var isLinux = /linux/i.test(navigator.userAgent); // @TODO: find a way to use getVersionInfo() here without messy state management
|
||||
|
||||
|
||||
return (
|
||||
<div style={mainMenuStyle}>
|
||||
<Menu {...this.props}>
|
||||
|
|
|
|||
|
|
@ -12,9 +12,9 @@ var MyFilesRowMoreMenu = React.createClass({
|
|||
lbry.deleteFile(this.props.lbryUri, false);
|
||||
},
|
||||
onDeleteClicked: function() {
|
||||
var alertText = 'Are you sure you\'d like to delete "' + this.props.title + '?" This will ' +
|
||||
(this.completed ? ' stop the download and ' : '') +
|
||||
'permanently remove the file from your system.';
|
||||
var alertText = 'Are you sure you\'d like to delete "' + this.props.title + '?" This will ' +
|
||||
(this.completed ? ' stop the download and ' : '') +
|
||||
'permanently remove the file from your system.';
|
||||
|
||||
if (confirm(alertText)) {
|
||||
lbry.deleteFile(this.props.lbryUri);
|
||||
|
|
@ -34,31 +34,31 @@ var MyFilesRowMoreMenu = React.createClass({
|
|||
});
|
||||
|
||||
var moreButtonColumnStyle = {
|
||||
height: '120px',
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
},
|
||||
moreButtonContainerStyle = {
|
||||
display: 'block',
|
||||
position: 'relative',
|
||||
},
|
||||
moreButtonStyle = {
|
||||
fontSize: '1.3em',
|
||||
},
|
||||
progressBarStyle = {
|
||||
height: '15px',
|
||||
width: '230px',
|
||||
backgroundColor: '#444',
|
||||
border: '2px solid #eee',
|
||||
display: 'inline-block',
|
||||
},
|
||||
artStyle = {
|
||||
maxHeight: '100px',
|
||||
display: 'block',
|
||||
marginLeft: 'auto',
|
||||
marginRight: 'auto',
|
||||
};
|
||||
height: '120px',
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
},
|
||||
moreButtonContainerStyle = {
|
||||
display: 'block',
|
||||
position: 'relative',
|
||||
},
|
||||
moreButtonStyle = {
|
||||
fontSize: '1.3em',
|
||||
},
|
||||
progressBarStyle = {
|
||||
height: '15px',
|
||||
width: '230px',
|
||||
backgroundColor: '#444',
|
||||
border: '2px solid #eee',
|
||||
display: 'inline-block',
|
||||
},
|
||||
artStyle = {
|
||||
maxHeight: '100px',
|
||||
display: 'block',
|
||||
marginLeft: 'auto',
|
||||
marginRight: 'auto',
|
||||
};
|
||||
var MyFilesRow = React.createClass({
|
||||
onPauseResumeClicked: function() {
|
||||
if (this.props.stopped) {
|
||||
|
|
@ -100,24 +100,24 @@ var MyFilesRow = React.createClass({
|
|||
<h2>{this.props.pending ? this.props.title : <a href={'/?show=' + this.props.lbryUri}>{this.props.title}</a>}</h2>
|
||||
{this.props.pending ? <em>This file is pending confirmation</em>
|
||||
: (
|
||||
<div>
|
||||
<div className={this.props.completed ? 'hidden' : ''} style={curProgressBarStyle}></div>
|
||||
{ ' ' }
|
||||
{this.props.completed ? 'Download complete' : (parseInt(this.props.ratioLoaded * 100) + '%')}
|
||||
<div>{ pauseLink }</div>
|
||||
<div>{ watchButton }</div>
|
||||
</div>
|
||||
)
|
||||
<div>
|
||||
<div className={this.props.completed ? 'hidden' : ''} style={curProgressBarStyle}></div>
|
||||
{ ' ' }
|
||||
{this.props.completed ? 'Download complete' : (parseInt(this.props.ratioLoaded * 100) + '%')}
|
||||
<div>{ pauseLink }</div>
|
||||
<div>{ watchButton }</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
</div>
|
||||
<div className="span1" style={moreButtonColumnStyle}>
|
||||
{this.props.pending ? null :
|
||||
<div style={moreButtonContainerStyle}>
|
||||
<Link style={moreButtonStyle} ref="moreButton" icon="icon-ellipsis-h" title="More Options" />
|
||||
<MyFilesRowMoreMenu toggleButton={this.refs.moreButton} title={this.props.title}
|
||||
lbryUri={this.props.lbryUri} fileName={this.props.fileName}
|
||||
path={this.props.path}/>
|
||||
</div>
|
||||
<div style={moreButtonContainerStyle}>
|
||||
<Link style={moreButtonStyle} ref="moreButton" icon="icon-ellipsis-h" title="More Options" />
|
||||
<MyFilesRowMoreMenu toggleButton={this.refs.moreButton} title={this.props.title}
|
||||
lbryUri={this.props.lbryUri} fileName={this.props.fileName}
|
||||
path={this.props.path}/>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -150,14 +150,14 @@ var MyFilesPage = React.createClass({
|
|||
if (!this.state.filesInfo.length) {
|
||||
var content = <span>You haven't downloaded anything from LBRY yet. Go <Link href="/" label="search for your first download" />!</span>;
|
||||
} else {
|
||||
var content = [];
|
||||
var content = [],
|
||||
keyIndex = 0;
|
||||
for (let fileInfo of this.state.filesInfo) {
|
||||
let {completed, written_bytes, total_bytes, lbry_uri, file_name, download_path,
|
||||
stopped, metadata} = fileInfo;
|
||||
stopped, metadata} = fileInfo;
|
||||
|
||||
if (!metadata)
|
||||
{
|
||||
console.log('Empty metadata, skipping render');
|
||||
continue;
|
||||
}
|
||||
|
||||
|
|
@ -175,21 +175,21 @@ var MyFilesPage = React.createClass({
|
|||
var ratioLoaded = written_bytes / total_bytes;
|
||||
var showWatchButton = (lbry.getMediaType(file_name) == 'video' || lbry.getMediaType(file_name) == 'audio');
|
||||
|
||||
content.push(<MyFilesRow lbryUri={lbry_uri} title={title || ('lbry://' + lbry_uri)} completed={completed} stopped={stopped}
|
||||
content.push(<MyFilesRow key={lbry_uri + (++keyIndex)} lbryUri={lbry_uri} title={title || ('lbry://' + lbry_uri)} completed={completed} stopped={stopped}
|
||||
ratioLoaded={ratioLoaded} imgUrl={thumbnail} path={download_path}
|
||||
showWatchButton={showWatchButton} pending={pending} />);
|
||||
}
|
||||
}
|
||||
return (
|
||||
<main className="page">
|
||||
<SubPageLogo />
|
||||
<h1>My Files</h1>
|
||||
<section>
|
||||
{content}
|
||||
</section>
|
||||
<section>
|
||||
<Link href="/" label="<< Return" />
|
||||
</section>
|
||||
<SubPageLogo />
|
||||
<h1>My Files</h1>
|
||||
<section>
|
||||
{content}
|
||||
</section>
|
||||
<section>
|
||||
<Link href="/" label="<< Return" />
|
||||
</section>
|
||||
</main>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -290,7 +290,7 @@ var PublishPage = React.createClass({
|
|||
</FormField>
|
||||
</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="help">
|
||||
<p>How much would you like to charge for this file?</p>
|
||||
If you choose to price this content in dollars, the number of credits charged will be adjusted based on the value of LBRY credits at the time of purchase.
|
||||
|
|
@ -304,8 +304,8 @@ var PublishPage = React.createClass({
|
|||
<label htmlFor="title">Title</label><FormField type="text" ref="meta_title" name="title" placeholder="My Show, Episode 1" style={publishFieldStyle} />
|
||||
<label htmlFor="author">Author</label><FormField type="text" ref="meta_author" name="author" placeholder="My Company, Inc." style={publishFieldStyle} />
|
||||
<label htmlFor="license">License info</label><FormField type="text" ref="meta_license" name="license" defaultValue="Creative Commons Attribution 3.0 United States" style={publishFieldStyle} />
|
||||
<label htmlFor="language">Language</label> <FormField type="select" ref="meta_language" name="language">
|
||||
<option value="en" selected>English</option>
|
||||
<label htmlFor="language">Language</label> <FormField type="select" defaultValue="en" ref="meta_language" name="language">
|
||||
<option value="en">English</option>
|
||||
<option value="zh">Chinese</option>
|
||||
<option value="fr">French</option>
|
||||
<option value="de">German</option>
|
||||
|
|
@ -319,7 +319,7 @@ var PublishPage = React.createClass({
|
|||
<div><label><FormField type="checkbox" ref="meta_nsfw" name="nsfw" placeholder="Description of your content" /> Not Safe For Work</label></div>
|
||||
</section>
|
||||
|
||||
|
||||
|
||||
|
||||
<section className="section-block">
|
||||
<h4>Additional Content Information (Optional)</h4>
|
||||
|
|
|
|||
Loading…
Reference in a new issue