diff --git a/dist/index.html b/dist/index.html index 7d9f9d14e..ce99f828c 100644 --- a/dist/index.html +++ b/dist/index.html @@ -33,7 +33,7 @@ - + diff --git a/js/app.js b/js/app.js index ac436b306..a064fab1f 100644 --- a/js/app.js +++ b/js/app.js @@ -6,16 +6,23 @@ var App = React.createClass({ [match, param, val] = window.location.search.match(/\??([^=]*)(?:=(.*))?/); - if (param && ['settings', 'help', 'start', 'watch', 'report', 'files', 'claim', 'show', 'wallet', 'publish'].indexOf(param) != -1) { + if (param && ['settings', 'discover', 'help', 'start', 'watch', 'report', 'files', 'claim', 'show', 'wallet', 'publish'].indexOf(param) != -1) { viewingPage = param; } - + return { - viewingPage: viewingPage ? viewingPage : 'home', + viewingPage: viewingPage ? viewingPage : 'discover', drawerOpen: drawerOpenRaw !== null ? JSON.parse(drawerOpenRaw) : true, pageArgs: val, }; }, + componentDidMount: function() { + lbry.getStartNotice(function(notice) { + if (notice) { + alert(notice); + } + }); + }, componentWillMount: function() { lbry.checkNewVersionAvailable(function(isAvailable) { @@ -59,12 +66,15 @@ var App = React.createClass({ sessionStorage.setItem('drawerOpen', false); this.setState({ drawerOpen: false }); }, + onSearchStart: function() { + this.setState({ viewingPage: 'discover' }); + }, getMainContent: function() { switch(this.state.viewingPage) { - case 'home': - return ; + case 'discover': + return ; case 'settings': return ; case 'help': @@ -83,8 +93,6 @@ var App = React.createClass({ return ; case 'show': return ; - case 'wallet': - return ; case 'publish': return ; } @@ -96,7 +104,7 @@ var App = React.createClass({
-
+
{mainContent}
diff --git a/js/component/drawer.js b/js/component/drawer.js index 748c9af52..509c95b09 100644 --- a/js/component/drawer.js +++ b/js/component/drawer.js @@ -23,18 +23,20 @@ var Drawer = React.createClass({ }.bind(this)); }, render: function() { + var isLinux = false && /linux/i.test(navigator.userAgent); // @TODO: find a way to use getVersionInfo() here without messy state management return ( ); } diff --git a/js/component/header.js b/js/component/header.js index 2ceb46f61..b29f28ad2 100644 --- a/js/component/header.js +++ b/js/component/header.js @@ -24,13 +24,30 @@ var Header = React.createClass({ isScrolled: event.srcElement.body.scrollTop > 0 }); }, + onQueryChange: function(event) { + + this.props.onSearchStart(); + + if (this.userTypingTimer) + { + clearTimeout(this.userTypingTimer); + } + + //@TODO: Switch to React.js timing + this.userTypingTimer = setTimeout(this.search, 800); // 800ms delay, tweak for faster/slower + + // this.setState({ + // searching: event.target.value.length > 0, + // query: event.target.value + // }); + }, render: function() { - var isLinux = /linux/i.test(navigator.userAgent); // @TODO: find a way to use getVersionInfo() here without messy state management return ( ); } diff --git a/js/lbry.js b/js/lbry.js index 6ded99a0a..e92303ac6 100644 --- a/js/lbry.js +++ b/js/lbry.js @@ -14,10 +14,10 @@ lbry.call = function (method, params, callback, errorCallback, connectFailedCall if (response.error) { if (errorCallback) { - errorCallback(response.error); + errorCallback(response.error); } } else if (callback) { - callback(response.result); + callback(response.result); } }); @@ -33,7 +33,7 @@ lbry.call = function (method, params, callback, errorCallback, connectFailedCall 'method': method, 'params': [params, ], 'id': 0 - })); + })); } //core @@ -223,7 +223,7 @@ lbry.loadJs = function(src, type, onload) var lbryScriptTag = document.getElementById('lbry'), newScriptTag = document.createElement('script'), type = type || 'text/javascript'; - + newScriptTag.src = src; newScriptTag.type = type; if (onload) @@ -234,8 +234,8 @@ lbry.loadJs = function(src, type, onload) } lbry.imagePath = function(file) -{ - return lbry.rootPath + '/img/' + file; +{ + return lbry.rootPath + '/img/' + file; } lbry.getMediaType = function(filename) { diff --git a/js/main.js b/js/main.js index ed8398146..b6782635b 100644 --- a/js/main.js +++ b/js/main.js @@ -6,7 +6,7 @@ var init = function() { { if (balance <= 0) { window.location.href = '?claim'; diff --git a/js/page/home.js b/js/page/discover.js similarity index 94% rename from js/page/home.js rename to js/page/discover.js index 54d64a0c0..7c02b7c96 100644 --- a/js/page/home.js +++ b/js/page/discover.js @@ -265,13 +265,13 @@ var FeaturedContent = React.createClass({ } }); -var discoverMainStyle = { - color: '#333' -}; - -var Discover = React.createClass({ +var DiscoverPage = React.createClass({ userTypingTimer: null, + componentDidMount: function() { + document.title = "Discover"; + }, + getInitialState: function() { return { results: [], @@ -321,9 +321,7 @@ var Discover = React.createClass({ render: function() { return ( -
-
+
{ this.state.searching ? : null } { !this.state.searching && this.state.query && this.state.results.length ? : null } { !this.state.searching && this.state.query && !this.state.results.length ? : null } @@ -331,20 +329,4 @@ var Discover = React.createClass({
); } -}); - -var HomePage = React.createClass({ - componentDidMount: function() { - document.title = "Discover"; - lbry.getStartNotice(function(notice) { - if (notice) { - alert(notice); - } - }); - }, - render: function() { - return ( - - ); - } -}); +}); \ No newline at end of file diff --git a/js/page/my_files.js b/js/page/my_files.js index 021d239f8..e962cf9d9 100644 --- a/js/page/my_files.js +++ b/js/page/my_files.js @@ -126,6 +126,7 @@ var MyFilesRow = React.createClass({ }); var MyFilesPage = React.createClass({ + fileTimeout: null, getInitialState: function() { return { filesInfo: null, @@ -137,12 +138,18 @@ var MyFilesPage = React.createClass({ componentWillMount: function() { this.updateFilesInfo(); }, + componentWillUnmount: function() { + if (this.fileTimeout) + { + clearTimeout(this.fileTimeout); + } + }, updateFilesInfo: function() { lbry.getFilesInfo((filesInfo) => { this.setState({ filesInfo: (filesInfo ? filesInfo : []), }); - setTimeout(() => { this.updateFilesInfo() }, 1000); + this.fileTimeout = setTimeout(() => { this.updateFilesInfo() }, 1000); }); }, render: function() { diff --git a/scss/_canvas.scss b/scss/_canvas.scss index 74912aefb..710f303a4 100644 --- a/scss/_canvas.scss +++ b/scss/_canvas.scss @@ -67,7 +67,7 @@ $drawer-width: 240px; #window.drawer-open { #main-content { margin-left: $drawer-width; } - .open-drawer-link { display: none; } + .open-drawer-link { visibility: hidden; } } #header @@ -81,7 +81,7 @@ $drawer-width: 240px; left: 0; width: 100%; box-sizing: border-box; - h1 { font-size: 1.8em; line-height: $header-height - $spacing-vertical; } + h1 { font-size: 1.8em; line-height: $header-height - $spacing-vertical; display: inline-block; } &.header-scrolled { box-shadow: $default-box-shadow;