LBRYFoundation/lbry-desktop
1
0
Fork 0
mirror of https://github.com/LBRYFoundation/lbry-desktop.git synced 2025-09-01 01:35:11 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge pull request #124 from lbryio/development

Browse source 
Merge development into master
This commit is contained in:
Job Evers‐Meltzer 2017-01-04 11:14:59 -06:00 • committed by GitHub
commit a490554365
14 changed files with 174 additions and 56 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
dist/index.html vendored
View file

@ -20,6 +20,8 @@
</head> </head>
<body> <body>
<div id="canvas"></div> <div id="canvas"></div>
<script src="./js/mediaelement/jquery.js"></script>
<script src="./js/mediaelement/mediaelement-and-player.min.js"></script>
<script src="./js/bundle.js"></script> <script src="./js/bundle.js"></script>
</body> </body>
</html> </html>

7
js/app.js
View file

@ -13,6 +13,7 @@ import DetailPage from './page/show.js';
import PublishPage from './page/publish.js'; import PublishPage from './page/publish.js';
import DiscoverPage from './page/discover.js'; import DiscoverPage from './page/discover.js';
import SplashScreen from './component/splash.js'; import SplashScreen from './component/splash.js';
import DeveloperPage from './page/developer.js';
import Drawer from './component/drawer.js'; import Drawer from './component/drawer.js';
import Header from './component/header.js'; import Header from './component/header.js';
import Modal from './component/modal.js'; import Modal from './component/modal.js';
@ -39,7 +40,7 @@ var App = React.createClass({
return { return {
viewingPage: viewingPage, viewingPage: viewingPage,
drawerOpen: drawerOpenRaw !== null ? JSON.parse(drawerOpenRaw) : true, drawerOpen: drawerOpenRaw !== null ? JSON.parse(drawerOpenRaw) : true,
pageArgs: val, pageArgs: typeof val !== 'undefined' ? val : null,
errorInfo: null, errorInfo: null,
modal: null, modal: null,
startNotice: null, startNotice: null,
@ -191,9 +192,11 @@ var App = React.createClass({
return <DetailPage name={this.state.pageArgs} />; return <DetailPage name={this.state.pageArgs} />;
case 'publish': case 'publish':
return <PublishPage />; return <PublishPage />;
case 'developer':
return <DeveloperPage />;
case 'discover': case 'discover':
default: default:
return <DiscoverPage query={this.state.pageArgs} />; return <DiscoverPage {... this.state.pageArgs !== null ? {query: this.state.pageArgs} : {} } />;
} }
}, },
render: function() { render: function() {

8
js/lbry.js
View file

@ -10,6 +10,9 @@ var lbry = {
}, },
defaultClientSettings: { defaultClientSettings: {
showNsfw: false, showNsfw: false,
debug: false,
useCustomLighthouseServers: false,
customLighthouseServers: [],
} }
}; };
@ -383,10 +386,7 @@ lbry.getSessionInfo = function(callback) {
} }
lbry.reportBug = function(message, callback) { lbry.reportBug = function(message, callback) {
lbry.call('upload_log', { lbry.call('report_bug', {
name_prefix: 'report',
exclude_previous: false,
force: true,
message: message message: message
}, callback); }, callback);
} }

57
js/lighthouse.js
View file

@ -1,8 +1,8 @@
import lbry from './lbry.js'; import lbry from './lbry.js';
var lighthouse = { var lighthouse = {
_search_timeout: 5000, _query_timeout: 5000,
_max_search_tries: 5, _max_query_tries: 5,
servers: [ servers: [
'http://lighthouse4.lbry.io:50005', 'http://lighthouse4.lbry.io:50005',
@ -12,37 +12,56 @@ var lighthouse = {
path: '/', path: '/',
call: function(method, params, callback, errorCallback, connectFailedCallback, timeout) { call: function(method, params, callback, errorCallback, connectFailedCallback, timeout) {
lbry.jsonrpc_call(this.server + this.path, method, params, callback, errorCallback, connectFailedCallback, timeout); const handleConnectFailed = function(tryNum=0) {
}, if (tryNum > lighthouse._max_query_tries) {
search: function(query, callback, errorCallback, connectFailedCallback, timeout) {
let handleSearchFailed = function(tryNum=0) {
if (tryNum > lighthouse._max_search_tries) {
if (connectFailedCallback) { if (connectFailedCallback) {
connectFailedCallback(); connectFailedCallback();
} else { } else {
throw new Error(`Could not connect to Lighthouse server. Last server attempted: ${lighthouse.server}`); throw new Error(`Could not connect to Lighthouse server. Last server attempted: ${lighthouse.server}`);
} }
} else { } else {
// Randomly choose one of the other search servers to switch to lbry.call(method, params, callback, errorCallback, () => { handleConnectFailed(tryNum + 1) }, timeout);
let otherServers = lighthouse.servers.slice();
otherServers.splice(otherServers.indexOf(lighthouse.server), 1);
lighthouse.server = otherServers[Math.round(Math.random() * (otherServers.length - 1))];
lighthouse.call('search', [query], callback, errorCallback, function() {
handleSearchFailed(tryNum + 1);
}, lighthouse._search_timeout);
} }
} }
lighthouse.call('search', [query], callback, errorCallback, function() { handleSearchFailed() }, lighthouse._search_timeout); // Set the Lighthouse server if it hasn't been set yet, or if the current server is not in
// the current set of servers (most likely because of a settings change).
if (typeof lighthouse.server === 'undefined' || lighthouse.getServers().indexOf(lighthouse.server) == -1) {
lighthouse.chooseNewServer();
}
lbry.jsonrpc_call(this.server + this.path, method, params, callback, errorCallback,
() => { handleConnectFailed() }, timeout || lighthouse.query_timeout);
},
getServers: function() {
return lbry.getClientSetting('useCustomLighthouseServers')
? lbry.getClientSetting('customLighthouseServers')
: lighthouse.servers;
},
chooseNewServer: function() {
// Randomly choose a new Lighthouse server and switch to it. If a server is already set, this
// will choose a different one (used for switching servers after a failed query).
const servers = lighthouse.getServers();
let newServerChoices;
if (!lighthouse.server) {
newServerChoices = servers;
} else {
newServerChoices = lighthouse.getServers().slice();
newServerChoices.splice(newServerChoices.indexOf(lighthouse.server), 1);
}
lighthouse.server = newServerChoices[Math.round(Math.random() * (newServerChoices.length - 1))];
},
search: function(query, callback, errorCallback, connectFailedCallback, timeout) {
lighthouse.call('search', [query], callback, errorCallback, connectFailedCallback, timeout);
}, },
getSizeForName: function(name, callback, errorCallback, connectFailedCallback, timeout) { getSizeForName: function(name, callback, errorCallback, connectFailedCallback, timeout) {
return lighthouse.call('get_size_for_name', [name], callback, errorCallback, connectFailedCallback, timeout); lighthouse.call('get_size_for_name', [name], callback, errorCallback, connectFailedCallback, timeout);
} }
}; };
lighthouse.server = lighthouse.servers[Math.round(Math.random() * (lighthouse.servers.length - 1))];
export default lighthouse; export default lighthouse;

6
js/main.js
View file

@ -1,11 +1,17 @@
import React from 'react'; import React from 'react';
import ReactDOM from 'react-dom'; import ReactDOM from 'react-dom';
import lbry from './lbry.js'; import lbry from './lbry.js';
import lighthouse from './lighthouse.js';
import App from './app.js'; import App from './app.js';
import SplashScreen from './component/splash.js'; import SplashScreen from './component/splash.js';
var init = function() { var init = function() {
if (lbry.getClientSetting('debug')) {
window.lbry = lbry;
window.lighthouse = lighthouse;
}
var canvas = document.getElementById('canvas'); var canvas = document.getElementById('canvas');
ReactDOM.render( ReactDOM.render(

56
js/page/developer.js Normal file
View file

@ -0,0 +1,56 @@
import lbry from '../lbry.js';
import React from 'react';
import FormField from '../component/form.js';
const DeveloperPage = React.createClass({
getInitialState: function() {
return {
debugMode: lbry.getClientSetting('debug'),
useCustomLighthouseServers: lbry.getClientSetting('useCustomLighthouseServers'),
customLighthouseServers: lbry.getClientSetting('customLighthouseServers').join('\n'),
};
},
handleDebugModeChange: function(event) {
lbry.setClientSetting('debug', event.target.checked);
this.setState({
debugMode: event.target.checked,
});
},
handleUseCustomLighthouseServersChange: function(event) {
lbry.setClientSetting('useCustomLighthouseServers', event.target.checked);
this.setState({
useCustomLighthouseServers: event.target.checked,
});
},
handleCustomLighthouseServersChange: function(event) {
lbry.setClientSetting('customLighthouseServers', event.target.value.trim().split('\n'));
this.setState({
customLighthouseServers: event.target.value,
});
},
render: function() {
return (
<main>
<section className="card">
<h3>Developer Settings</h3>
<div className="form-row">
<label><FormField type="checkbox" onChange={this.handleDebugModeChange} checked={this.state.debugMode} /> Enable debug mode (exposes LBRY modules in global scope)</label>
</div>
<div className="form-row">
<label><FormField type="checkbox" onChange={this.handleUseCustomLighthouseServersChange} checked={this.state.useCustomLighthouseServers} /> Use custom search servers</label>
</div>
{this.state.useCustomLighthouseServers
? <div className="form-row">
<label>
Custom search servers (one per line)
<div><FormField type="textarea" className="developer-page__custom-lighthouse-servers" value={this.state.customLighthouseServers} onChange={this.handleCustomLighthouseServersChange} checked={this.state.debugMode} /></div>
</label>
</div>
: null}
</section>
</main>
);
}
});
export default DeveloperPage;

29
js/page/discover.js
View file

@ -2,7 +2,7 @@ import React from 'react';
import lbry from '../lbry.js'; import lbry from '../lbry.js';
import lighthouse from '../lighthouse.js'; import lighthouse from '../lighthouse.js';
import {Link, ToolTipLink, DownloadLink, WatchLink} from '../component/link.js'; import {Link, ToolTipLink, DownloadLink, WatchLink} from '../component/link.js';
import {Thumbnail, CreditAmount, TruncatedText} from '../component/common.js'; import {Thumbnail, CreditAmount, TruncatedText, BusyMessage} from '../component/common.js';
var fetchResultsStyle = { var fetchResultsStyle = {
color: '#888', color: '#888',
@ -268,20 +268,27 @@ var DiscoverPage = React.createClass({
componentDidUpdate: function() { componentDidUpdate: function() {
if (this.props.query != this.state.query) if (this.props.query != this.state.query)
{ {
this.handleSearchChanged(); this.handleSearchChanged(this.props.query);
} }
}, },
handleSearchChanged: function() { componentWillReceiveProps: function(nextProps, nextState) {
this.setState({ if (nextProps.query != nextState.query)
searching: true, {
query: this.props.query, this.handleSearchChanged(nextProps.query);
}); }
lighthouse.search(this.props.query, this.searchCallback);
}, },
componentDidMount: function() { handleSearchChanged: function(query) {
this.setState({
searching: true,
query: query,
});
lighthouse.search(query, this.searchCallback);
},
componentWillMount: function() {
document.title = "Discover"; document.title = "Discover";
if (this.props.query) { if (this.props.query) {
// Rendering with a query already typed // Rendering with a query already typed
@ -293,7 +300,7 @@ var DiscoverPage = React.createClass({
return { return {
results: [], results: [],
query: this.props.query, query: this.props.query,
searching: this.props.query && this.props.query.length > 0 searching: ('query' in this.props) && (this.props.query.length > 0)
}; };
}, },

12
js/page/help.js
View file

@ -27,7 +27,7 @@ var HelpPage = React.createClass({
document.title = "Help"; document.title = "Help";
}, },
render: function() { render: function() {
let ver, osName, platform, newVerLink; let ver, osName, platform, newVerLink, uiVersion;
if (this.state.versionInfo) { if (this.state.versionInfo) {
ver = this.state.versionInfo; ver = this.state.versionInfo;
@ -43,6 +43,12 @@ var HelpPage = React.createClass({
platform = `Windows (${ver.platform})`; platform = `Windows (${ver.platform})`;
newVerLink = 'https://lbry.io/get/lbry.msi'; newVerLink = 'https://lbry.io/get/lbry.msi';
} }
if (ver.ui_version == 'user-specified') {
uiVersion = '(User specified)';
} else {
uiVersion = ver.ui_version || '(Unknown)';
}
} else { } else {
ver = null; ver = null;
} }
@ -86,6 +92,10 @@ var HelpPage = React.createClass({
<th>lbryum (wallet)</th> <th>lbryum (wallet)</th>
<td>{ver.lbryum_version}</td> <td>{ver.lbryum_version}</td>
</tr> </tr>
<tr>
<th>lbry-web-ui (interface)</th>
<td>{uiVersion}</td>
</tr>
<tr> <tr>
<th>Platform</th> <th>Platform</th>
<td>{platform}</td> <td>{platform}</td>

38
js/page/my_files.js
View file

@ -175,7 +175,6 @@ var MyFilesPage = React.createClass({
}, },
title: function(filesInfo) { title: function(filesInfo) {
return filesInfo.sort(function(a, b) { return filesInfo.sort(function(a, b) {
console.log('in title sort. a is', a, '; b is', b)
return ((a.metadata ? a.metadata.title.toLowerCase() : a.name) > return ((a.metadata ? a.metadata.title.toLowerCase() : a.name) >
(b.metadata ? b.metadata.title.toLowerCase() : b.name)); (b.metadata ? b.metadata.title.toLowerCase() : b.name));
}); });
@ -236,15 +235,9 @@ var MyFilesPage = React.createClass({
clearTimeout(this._fileTimeout); clearTimeout(this._fileTimeout);
} }
}, },
setFilesInfo: function(filesInfo) {
this.setState({
filesInfo: this._sortFunctions[this.state.sortBy](filesInfo),
});
},
handleSortChanged: function(event) { handleSortChanged: function(event) {
this.setState({ this.setState({
sortBy: event.target.value, sortBy: event.target.value,
filesInfo: this._sortFunctions[event.target.value](this.state.filesInfo),
}); });
}, },
updateFilesInfo: function() { updateFilesInfo: function() {
@ -253,17 +246,29 @@ var MyFilesPage = React.createClass({
if (this.props.show == 'published') { if (this.props.show == 'published') {
// We're in the Published tab, so populate this.state.filesInfo with data from the user's claims // We're in the Published tab, so populate this.state.filesInfo with data from the user's claims
lbry.getMyClaims((claimsInfo) => { lbry.getMyClaims((claimsInfo) => {
let newFilesInfo = []; /**
* Build newFilesInfo as a sparse array and drop elements in at the same position they
* occur in claimsInfo, so the order is preserved even if the API calls inside this loop
* return out of order.
*/
let newFilesInfo = Array(claimsInfo.length);
let claimInfoProcessedCount = 0; let claimInfoProcessedCount = 0;
for (let claimInfo of claimsInfo) { for (let [i, claimInfo] of claimsInfo.entries()) {
let metadata = JSON.parse(claimInfo.value); let metadata = JSON.parse(claimInfo.value);
lbry.getFileInfoBySdHash(metadata.sources.lbry_sd_hash, (fileInfo) => { lbry.getFileInfoBySdHash(metadata.sources.lbry_sd_hash, (fileInfo) => {
claimInfoProcessedCount++; claimInfoProcessedCount++;
if (fileInfo !== false) { if (fileInfo !== false) {
newFilesInfo.push(fileInfo); newFilesInfo[i] = fileInfo;
} }
if (claimInfoProcessedCount >= claimsInfo.length) { if (claimInfoProcessedCount >= claimsInfo.length) {
this.setFilesInfo(newFilesInfo); /**
* newFilesInfo may have gaps from claims that don't have associated files in
* lbrynet, so filter out any missing elements
*/
this.setState({
filesInfo: newFilesInfo.filter(function() { return true }),
});
this._fileTimeout = setTimeout(() => { this.updateFilesInfo() }, 1000); this._fileTimeout = setTimeout(() => { this.updateFilesInfo() }, 1000);
} }
@ -274,9 +279,11 @@ var MyFilesPage = React.createClass({
// We're in the Downloaded tab, so populate this.state.filesInfo with files the user has in // We're in the Downloaded tab, so populate this.state.filesInfo with files the user has in
// lbrynet, with published files filtered out. // lbrynet, with published files filtered out.
lbry.getFilesInfo((filesInfo) => { lbry.getFilesInfo((filesInfo) => {
this.setFilesInfo(filesInfo.filter(({sd_hash}) => { this.setState({
return this.state.publishedFilesSdHashes.indexOf(sd_hash) == -1; filesInfo: filesInfo.filter(({sd_hash}) => {
})); return this.state.publishedFilesSdHashes.indexOf(sd_hash) == -1;
}),
});
let newFilesAvailable; let newFilesAvailable;
if (!(this._fileInfoCheckNum % this._fileInfoCheckRate)) { if (!(this._fileInfoCheckNum % this._fileInfoCheckRate)) {
@ -320,7 +327,8 @@ var MyFilesPage = React.createClass({
var content = [], var content = [],
seenUris = {}; seenUris = {};
for (let fileInfo of this.state.filesInfo) { const filesInfoSorted = this._sortFunctions[this.state.sortBy](this.state.filesInfo);
for (let fileInfo of filesInfoSorted) {
let {completed, written_bytes, total_bytes, lbry_uri, file_name, download_path, let {completed, written_bytes, total_bytes, lbry_uri, file_name, download_path,
stopped, metadata, sd_hash} = fileInfo; stopped, metadata, sd_hash} = fileInfo;

2
js/page/report.js
View file

@ -1,4 +1,6 @@
import React from 'react'; import React from 'react';
import {Link} from '../component/link.js';
import Modal from '../component/modal.js';
import lbry from '../lbry.js'; import lbry from '../lbry.js';
var ReportPage = React.createClass({ var ReportPage = React.createClass({

2
js/page/watch.js
View file

@ -1,8 +1,6 @@
import React from 'react'; import React from 'react';
import lbry from '../lbry.js'; import lbry from '../lbry.js';
import LoadScreen from '../component/load_screen.js' import LoadScreen from '../component/load_screen.js'
import MediaElementPlayer from 'mediaelement';
var WatchPage = React.createClass({ var WatchPage = React.createClass({
propTypes: { propTypes: {

3
scss/_gui.scss
View file

@ -365,4 +365,5 @@ input[type="text"], input[type="search"]
.download-started-modal__file-path { .download-started-modal__file-path {
word-break: break-all; word-break: break-all;
} }

3
scss/all.scss
View file

@ -4,4 +4,5 @@
@import "_mediaelement"; @import "_mediaelement";
@import "_canvas"; @import "_canvas";
@import "_table"; @import "_table";
@import "_gui"; @import "_gui";
@import "page/_developer.scss";

5
scss/page/_developer.scss Normal file
View file

@ -0,0 +1,5 @@
.developer-page__custom-lighthouse-servers {
font: 0.8em monospace;
width: 30em;
height: 10em;
}