store upgrade skip in session

This commit is contained in:
Jeremy Kauffman 2016-08-07 17:05:04 -04:00 committed by Alex Liebowitz
parent 98ebf02ca6
commit 640001c597
8 changed files with 71 additions and 95 deletions

View file

@ -18,7 +18,8 @@ var App = React.createClass({
},
componentWillMount: function() {
lbry.checkNewVersionAvailable(function(isAvailable) {
if (!isAvailable) {
if (!isAvailable || sessionStorage.getItem('upgradeSkipped')) {
return;
}
@ -40,9 +41,12 @@ var App = React.createClass({
var updateUrl = 'https://lbry.io/get/lbry.deb';
}
if (window.confirm(message)) {
if (window.confirm(message))
{
lbry.stop();
window.location = updateUrl;
} else {
sessionStorage.setItem('upgradeSkipped', true);
};
});
});

View file

@ -1,3 +1,13 @@
var DrawerItem = React.createClass({
render: function() {
return <Link {...this.props} className="drawer-item" />
}
});
var drawerImageStyle = { //@TODO: remove this, img should be properly scaled once size is settled
height: '36px'
};
var Drawer = React.createClass({
getInitialState: function() {
return {
@ -16,15 +26,16 @@ var Drawer = React.createClass({
return (
<nav id="drawer">
<div id="drawer-handle">
<Link title="Close" onClick={this.props.onCloseDrawer} icon="icon-bars" />
<Link title="Close" onClick={this.props.onCloseDrawer} icon="icon-bars" className="button-text close-drawer-link"/>
<a href="/"><img src="./img/lbry-dark-1600x528.png" style={drawerImageStyle}/></a>
</div>
<Link href='/?home' label="Discover" icon="icon-search" />
<Link icon="icon-bank" href="/?wallet" label={<CreditAmount amount={this.state.balance}/>} />
<Link href='/?publish' label="Publish" icon="icon-upload" />
<Link href='/?files' label="My Files" icon='icon-cloud-download' />
<Link href='/?settings' label="Settings" icon='icon-gear' />
<Link href='/?help' label="Help" icon='icon-question-circle' />
{isLinux ? <Link href="/?start" label="Exit LBRY" icon="icon-close" /> : null}
<DrawerItem href='/?home' label="Discover" icon="icon-search" />
<DrawerItem href='/?publish' label="Publish" icon="icon-upload" />
<DrawerItem href='/?files' label="My Files" icon='icon-cloud-download' />
<DrawerItem href="/?wallet" label={ lbry.formatCredits(this.state.balance) } icon="icon-bank" />
<DrawerItem href='/?settings' label="Settings" icon='icon-gear' />
<DrawerItem href='/?help' label="Help" icon='icon-question-circle' />
{isLinux ? <DrawerItem href="/?start" label="Exit LBRY" icon="icon-close" /> : null}
</nav>
);
}

View file

@ -1,83 +1,9 @@
var topBarStyle = {
'float': 'right',
'position': 'absolute',
'right': 0,
'top': 0
},
balanceStyle = {
'marginRight': '5px',
'position': 'relative',
'top': '1px',
},
menuDropdownStyle = {
position: 'absolute',
top: '26px',
right: '0px',
};
var TopBar = React.createClass({
getInitialState: function() {
return {
balance: 0,
};
},
componentDidMount: function() {
lbry.getBalance(function(balance) {
this.setState({
balance: balance
});
}.bind(this));
},
onClose: function() {
window.location.href = "?start";
},
render: function() {
var isLinux = /linux/i.test(navigator.userAgent); // @TODO: find a way to use getVersionInfo() here without messy state management
return (
<span className='top-bar' style={topBarStyle}>
<Link icon="icon-bank" href="/?wallet" label={<CreditAmount amount={this.state.balance}/>} style={balanceStyle} />
<Link href='/?publish' label="Publish" icon="icon-upload" button="text" />
<Link ref="menuButton" title="LBRY Menu" icon="icon-bars" />
<div style={menuDropdownStyle}>
<Menu toggleButton={this.refs.menuButton} >
<MenuItem href='/?files' label="My Files" icon='icon-cloud-download' />
<MenuItem href='/?settings' label="Settings" icon='icon-gear' />
<MenuItem href='/?help' label="Help" icon='icon-question-circle' />
{isLinux ? <MenuItem href="/?start" label="Exit LBRY" icon="icon-close" />
: null}
</Menu>
</div>
</span>
);
}
});
var subPageLogoStyle = {
maxWidth: '150px',
display: 'block',
marginTop: '36px',
};
var SubPageLogo = React.createClass({
render: function() {
return <a href="/"><img src="img/lbry-dark-1600x528.png" style={subPageLogoStyle} /></a>;
}
});
var headerStyle = {
padding: '12px 12px 36px',
position: 'relative'
},
headerImageStyle = { //@TODO: remove this, img should be properly scaled once size is settled
height: '48px'
};
var Header = React.createClass({
render: function() {
return (
<header style={headerStyle}>
<header id="header">
<h1>{ document.title ? document.title : 'LBRY' }</h1>
<Link onClick={this.props.onOpenDrawer} icon="icon-bars" className="open-drawer-link" />
<a href="/"><img src="./img/lbry-dark-1600x528.png" style={headerImageStyle}/></a>
</header>
);
}

View file

@ -6,12 +6,14 @@ var Link = React.createClass({
},
render: function() {
var href = this.props.href ? this.props.href : 'javascript:;',
icon = this.props.icon ? <Icon icon={this.props.icon} /> : '',
className = (this.props.button ? 'button-block button-' + this.props.button : 'button-text') +
(this.props.hidden ? ' hidden' : '') + (this.props.disabled ? ' disabled' : '') + ' ' + this.props.className;
icon = this.props.icon ? <Icon icon={this.props.icon} fixed={true} /> : '',
className = (this.props.className ? this.props.className : '') +
(this.props.button ? ' button-block button-' + this.props.button : '') +
(this.props.hidden ? ' hidden' : '') +
(this.props.disabled ? ' disabled' : '');
return (
<a className={className} href={href} style={this.props.style ? this.props.style : {}}
<a className={className ? className : 'button-text'} href={href} style={this.props.style ? this.props.style : {}}
title={this.props.title} onClick={this.handleClick}>
{this.props.icon ? icon : '' }
{this.props.label}
@ -48,13 +50,14 @@ var ToolTipLink = React.createClass({
render: function() {
var href = this.props.href ? this.props.href : 'javascript:;',
icon = this.props.icon ? <Icon icon={this.props.icon} /> : '',
className = (this.props.button ? 'button-block button-' + this.props.button : 'button-text') +
(this.props.hidden ? ' hidden' : '') + (this.props.disabled ? ' disabled' : '') + ' ' + this.props.className;
className = this.props.className +
(this.props.button ? ' button-block button-' + this.props.button : '') +
(this.props.hidden ? ' hidden' : '') +
(this.props.disabled ? ' disabled' : '');
return (
<span style={linkContainerStyle}>
<a className={className} href={href} style={this.props.style ? this.props.style : {}}
<a className={className ? className : 'button-text'} href={href} style={this.props.style ? this.props.style : {}}
title={this.props.title} onClick={this.handleClick}>
{this.props.icon ? icon : '' }
{this.props.label}

View file

@ -335,6 +335,7 @@ var Discover = React.createClass({
var HomePage = React.createClass({
componentDidMount: function() {
document.title = "Discover";
lbry.getStartNotice(function(notice) {
if (notice) {
alert(notice);

View file

@ -58,6 +58,9 @@ var SettingsPage = React.createClass({
settings: null
}
},
componentDidMount: function() {
document.title = "Settings";
},
componentWillMount: function() {
lbry.getSettings(function(settings) {
this.setState({

View file

@ -25,11 +25,22 @@ body
min-height: 100vh;
left: 0;
top: 0;
.button-text
.drawer-item
{
display: block;
padding: $spacing-vertical / 2;
font-size: 1.2em;
.icon
{
margin-right: 6px;
}
}
}
#drawer-handle
{
padding: $spacing-vertical / 2;
max-height: $header-height;
}
#window.drawer-closed
{
@ -41,6 +52,21 @@ body
.open-drawer-link { display: none; }
}
#header
{
background: $color-primary;
color: white;
height: $header-height;
padding: $spacing-vertical / 2;
}
.open-drawer-link, .close-drawer-link
{
display: inline-block;
font-size: 1.5em;
padding: 0 18px 0 6px;
}
.page {
margin-left: auto;
margin-right: auto;

View file

@ -15,6 +15,8 @@ $mobile-width-threshold: 801px;
$max-content-width: 1000px;
$max-text-width: 660px;
$header-height: $spacing-vertical * 1.5;
@mixin clearfix()
{