ExternalVendorCode/ZeroTierOne
1
0
Fork 0
mirror of https://github.com/zerotier/ZeroTierOne.git synced 2025-01-18 18:56:24 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

UI tweaks

Browse Source
This commit is contained in:
Adam Ierymenko 2015-05-06 17:42:29 -07:00
parent 4a2c46e008
commit 03dbec960a
2 changed files with 23 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
ui/ZeroTierNode.jsx
View File

@ -10,8 +10,10 @@ var ZeroTierNode = React.createClass({
}, },
ago: function(ms) { ago: function(ms) {
var tmp = (Date.now() - ms); if (ms > 0) {
return ((tmp > 0) ? tmp : 0); var tmp = Math.round((Date.now() - ms) / 1000);
return ((tmp > 0) ? tmp : 0);
} else return 0;
}, },
updatePeers: function() { updatePeers: function() {
@ -88,7 +90,7 @@ var ZeroTierNode = React.createClass({
componentDidMount: function() { componentDidMount: function() {
this.tabIndex = 0; this.tabIndex = 0;
this.updateAll(); this.updateAll();
this.updateIntervalId = setInterval(this.updateAll,5000); this.updateIntervalId = setInterval(this.updateAll,2500);
}, },
componentWillUnmount: function() { componentWillUnmount: function() {
clearInterval(this.updateIntervalId); clearInterval(this.updateIntervalId);
@ -105,12 +107,12 @@ var ZeroTierNode = React.createClass({
{ {
(this.tabIndex === 1) ? ( (this.tabIndex === 1) ? (
<div className="peers"> <div className="peers">
<div className="peer"> <div className="peerHeader">
<div className="f"><b>Address</b></div> <div className="f">Address</div>
<div className="f"><b>Version</b></div> <div className="f">Version</div>
<div className="f"><b>Latency</b></div> <div className="f">Latency</div>
<div className="f"><b>Direct&nbsp;Paths</b></div> <div className="f">Direct&nbsp;Paths</div>
<div className="f"><b>Role</b></div> <div className="f">Role</div>
</div> </div>
{ {
this.state._peers.map(function(peer) { this.state._peers.map(function(peer) {
@ -129,7 +131,7 @@ var ZeroTierNode = React.createClass({
peer['paths'].map(function(path) { peer['paths'].map(function(path) {
if ((path.active)||(path.fixed)) { if ((path.active)||(path.fixed)) {
return ( return (
<div className="peerPath">{path.address}&nbsp;{this.ago(path.lastSend)}&nbsp;{this.ago(path.lastReceive)}</div> <div className="peerPath">{path.address}&nbsp;{this.ago(path.lastSend)}&nbsp;{this.ago(path.lastReceive)}{path.preferred ? ' *' : ''}</div>
); );
} else { } else {
return ( return (

11
ui/zerotier.css
View File

@ -116,6 +116,17 @@ html,body {
display: table-cell; display: table-cell;
font-size: 10pt; font-size: 10pt;
} }
.zeroTierNode > .middle > .middleScroll > .peers > .peerHeader {
width: 100%;
display: table-row;
background: #ffffff;
border-bottom: 1px solid #000000;
}
.zeroTierNode > .middle > .middleScroll > .peers > .peerHeader > .f {
display: table-cell;
font-size: 10pt;
font-weight: bold;
}
.zeroTierNode > .bottom { .zeroTierNode > .bottom {
width: 100%; width: 100%;