summaryrefslogtreecommitdiff
path: root/ui
diff options
context:
space:
mode:
authorAdam Ierymenko <adam.ierymenko@gmail.com>2015-05-08 14:47:01 -0700
committerAdam Ierymenko <adam.ierymenko@gmail.com>2015-05-08 14:47:01 -0700
commit257187a284108a8bc291aa093035ec17ecb65fa5 (patch)
tree5014eab96a3f129ca0afb384e1ee5af630c19e88 /ui
parent8e888f8df9494ecb57673b4a356312131e198519 (diff)
downloadinfinitytier-257187a284108a8bc291aa093035ec17ecb65fa5.tar.gz
infinitytier-257187a284108a8bc291aa093035ec17ecb65fa5.zip
Fixes for Windows WebControl.
Diffstat (limited to 'ui')
-rw-r--r--ui/Makefile1
-rw-r--r--ui/ZeroTierNetwork.jsx2
-rw-r--r--ui/ZeroTierNode.jsx13
-rw-r--r--ui/index.html55
-rw-r--r--ui/zerotier.css70
-rw-r--r--ui/ztui.min.js4
6 files changed, 89 insertions, 56 deletions
diff --git a/ui/Makefile b/ui/Makefile
index 48b4446d..4be03228 100644
--- a/ui/Makefile
+++ b/ui/Makefile
@@ -1,5 +1,6 @@
all:
mkdir -p build
jsx --target es3 -x jsx . ./build
+ rm -f ztui.min.js
minify build/*.js >>ztui.min.js
rm -rf build
diff --git a/ui/ZeroTierNetwork.jsx b/ui/ZeroTierNetwork.jsx
index 1dda1117..f842d758 100644
--- a/ui/ZeroTierNetwork.jsx
+++ b/ui/ZeroTierNetwork.jsx
@@ -67,7 +67,7 @@ var ZeroTierNetwork = React.createClass({
</div>
</div>
</div>
- <button className="leaveNetworkButton" onClick={this.leaveNetwork}>Leave&nbsp;Network</button>
+ <button type="button" className="leaveNetworkButton" onClick={this.leaveNetwork}>Leave&nbsp;Network</button>
</div>
);
}
diff --git a/ui/ZeroTierNode.jsx b/ui/ZeroTierNode.jsx
index 3782219e..956b892c 100644
--- a/ui/ZeroTierNode.jsx
+++ b/ui/ZeroTierNode.jsx
@@ -96,7 +96,7 @@ var ZeroTierNode = React.createClass({
},
handleNetworkIdEntry: function(event) {
this.networkInputElement = event.target;
- var nid = event.target.value;
+ var nid = this.networkInputElement.value;
if (nid) {
nid = nid.toLowerCase();
var nnid = '';
@@ -105,10 +105,10 @@ var ZeroTierNode = React.createClass({
nnid += nid.charAt(i);
}
this.networkToJoin = nnid;
- event.target.value = nnid;
+ this.networkInputElement.value = nnid;
} else {
this.networkToJoin = '';
- event.target.value = '';
+ this.networkInputElement.value = '';
}
},
@@ -138,9 +138,8 @@ var ZeroTierNode = React.createClass({
<div className="top">&nbsp;&nbsp;
<button disabled={this.tabIndex === 0} onClick={function() {this.tabIndex = 0; this.forceUpdate();}.bind(this)}>Networks</button>
<button disabled={this.tabIndex === 1} onClick={function() {this.tabIndex = 1; this.forceUpdate();}.bind(this)}>Peers</button>
- <div className="logo">&#x23c1;&nbsp;</div>
</div>
- <div className="middle">
+ <div className="middle"><div className="middleCell">
<div className="middleScroll">
{
(this.tabIndex === 1) ? (
@@ -198,13 +197,13 @@ var ZeroTierNode = React.createClass({
)
}
</div>
- </div>
+ </div></div>
<div className="bottom">
<div className="left">
<span className="statusLine"><span className="zeroTierAddress">{this.state.address}</span>&nbsp;&nbsp;{this.state.online ? 'ONLINE' : 'OFFLINE'}&nbsp;&nbsp;{this.state.version}</span>
</div>
<div className="right">
- <form onSubmit={this.joinNetwork}><input type="text" placeholder=" [ Network ID ]" onChange={this.handleNetworkIdEntry} size="16"/><button type="submit">Join</button></form>
+ <form onSubmit={this.joinNetwork}><input type="text" maxlength="16" placeholder="[ Network ID ]" onChange={this.handleNetworkIdEntry} size="16"/><button type="button" onClick={this.joinNetwork}>Join</button></form>
</div>
</div>
</div>
diff --git a/ui/index.html b/ui/index.html
index 5ab32eb7..857c7ddb 100644
--- a/ui/index.html
+++ b/ui/index.html
@@ -1,16 +1,39 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
- <title>ZeroTier One</title>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width, initial-scale=1">
- <link rel="stylesheet" href="zerotier.css">
- <script src="simpleajax.min.js"></script>
- <!-- <script src="https://fb.me/react-0.13.2.js"></script> -->
- <script src="react.min.js"></script>
- <script src="ztui.min.js"></script>
-</head>
-<body><div style="width: 100%; height: 100%;" id="main"></div></body>
-<script src="main.js"></script>
-</html>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <title>ZeroTier One</title>
+ <link rel="stylesheet" href="zerotier.css">
+ <script src="simpleajax.min.js"></script>
+ <!-- <script src="https://fb.me/react-0.13.2.js"></script> -->
+ <script src="react.min.js"></script>
+ <script src="ztui.min.js"></script>
+</head>
+<body><div style="width: 100%; height: 100%;" id="main"></div></body>
+<script src="main.js"></script>
+<script>
+function isIE() {
+ var myNav = navigator.userAgent.toLowerCase();
+ return (myNav.indexOf('msie') != -1) ? parseInt(myNav.split('msie')[1]) : false;
+}
+var ieVersion = isIE();
+function resizeMiddleScrollClasses() {
+ var elems = document.getElementsByTagName('*'), i;
+ for (i in elems) {
+ if ((' ' + elems[i].className + ' ').indexOf(' middleScroll ') > -1) {
+ elems[i].style.height = (document.body.clientHeight - (elems[i].parentNode.parentNode.previousElementSibling.clientHeight + elems[i].parentNode.parentNode.nextElementSibling.clientHeight)) + "px";
+ }
+ }
+}
+if (ieVersion !== false) {
+ if (ieVersion < 7) {
+ alert("Upgrade Internet Explorer on your system to use this interface. (detected version: " + ieVersion + ")");
+ } else {
+ resizeMiddleScrollClasses();
+ window.onresize = resizeMiddleScrollClasses;
+ }
+}
+</script>
+</html>
diff --git a/ui/zerotier.css b/ui/zerotier.css
index 85ac9d6f..2211ac59 100644
--- a/ui/zerotier.css
+++ b/ui/zerotier.css
@@ -20,7 +20,6 @@ html,body {
.zeroTierNode {
width: 100%;
height: 100%;
- max-height: 100%;
padding: 0;
margin: 0;
display: table;
@@ -36,14 +35,6 @@ html,body {
padding: 0;
margin: 0;
}
-.zeroTierNode > .top > .logo {
- display: inline-block;
- padding: 0.1em 0 0 0;
- margin: 0;
- font-size: 12pt;
- font-weight: bold;
- float: right;
-}
.zeroTierNode > .top button {
display: inline-block;
padding: 0.25rem 0.75rem 0.25rem 0.75rem;
@@ -63,33 +54,39 @@ html,body {
}
.zeroTierNode > .middle {
- height: 100%;
width: 100%;
+ height: 100%;
padding: 0;
margin: 0;
overflow: hidden;
display: table-row;
}
-.zeroTierNode > .middle > .middleScroll {
+.zeroTierNode > .middle > .middleCell {
+ width: 100%;
+ height: 100%;
+ display: table-cell;
+}
+.zeroTierNode > .middle > .middleCell > .middleScroll {
display: block;
width: 100%;
height: 100%;
padding: 0;
margin: 0;
+ overflow: scroll;
overflow-x: hidden;
overflow-y: scroll;
background: #dddddd;
}
-.zeroTierNode > .middle > .middleScroll > .networks {
+.zeroTierNode > .middle > .middleCell > .middleScroll > .networks {
display: block;
width: 100%;
- padding: 0;
+ padding: 0 0 0.25rem 0;
margin: 0;
border: 0;
text-align: left;
border-collapse: collapse;
}
-.zeroTierNode > .middle > .middleScroll > .networks > .network {
+.zeroTierNode > .middle > .middleCell > .middleScroll > .networks > .network {
display: inline-block;
padding: 0.25rem;
margin: 0.25rem 0 0 1%;
@@ -98,36 +95,36 @@ html,body {
border: 1px solid #234447;
background: #ffffff;
}
-.zeroTierNode > .middle > .middleScroll > .peers {
+.zeroTierNode > .middle > .middleCell > .middleScroll > .peers {
display: table;
width: 100%;
margin: 0;
border-collapse: collapse;
}
-.zeroTierNode > .middle > .middleScroll > .peers > .peer {
+.zeroTierNode > .middle > .middleCell > .middleScroll > .peers > .peer {
width: 100%;
display: table-row;
background: #ffffff;
}
-.zeroTierNode > .middle > .middleScroll > .peers > .peer:nth-child(odd) {
+.zeroTierNode > .middle > .middleCell > .middleScroll > .peers > .peer:nth-child(odd) {
background: #f3f3f3;
}
-.zeroTierNode > .middle > .middleScroll > .peers > .peer:nth-child(even) {
+.zeroTierNode > .middle > .middleCell > .middleScroll > .peers > .peer:nth-child(even) {
}
-.zeroTierNode > .middle > .middleScroll > .peers > .peer .peerPathActive {
+.zeroTierNode > .middle > .middleCell > .middleScroll > .peers > .peer .peerPathActive {
font-size: 10pt;
color: #555555;
font-style: italic;
font-family: monospace;
white-space: nowrap;
}
-.zeroTierNode > .middle > .middleScroll > .peers > .peer .peerPathPreferred {
+.zeroTierNode > .middle > .middleCell > .middleScroll > .peers > .peer .peerPathPreferred {
font-size: 10pt;
color: #000000;
font-family: monospace;
white-space: nowrap;
}
-.zeroTierNode > .middle > .middleScroll > .peers > .peer .peerPathInactive {
+.zeroTierNode > .middle > .middleCell > .middleScroll > .peers > .peer .peerPathInactive {
font-size: 10pt;
font-family: monospace;
color: #aaaaaa;
@@ -135,18 +132,18 @@ html,body {
text-decoration: line-through;
white-space: nowrap;
}
-.zeroTierNode > .middle > .middleScroll > .peers > .peer > .f {
+.zeroTierNode > .middle > .middleCell > .middleScroll > .peers > .peer > .f {
display: table-cell;
padding: 0.05rem 0.15rem 0.05rem 0.15rem;
font-size: 10pt;
}
-.zeroTierNode > .middle > .middleScroll > .peers > .peerHeader {
+.zeroTierNode > .middle > .middleCell > .middleScroll > .peers > .peerHeader {
width: 100%;
display: table-row;
background: #ffffff;
border-bottom: 1px solid #000000;
}
-.zeroTierNode > .middle > .middleScroll > .peers > .peerHeader > .f {
+.zeroTierNode > .middle > .middleCell > .middleScroll > .peers > .peerHeader > .f {
display: table-cell;
font-size: 10pt;
padding: 0.05rem 0.15rem 0.05rem 0.15rem;
@@ -154,6 +151,7 @@ html,body {
}
.zeroTierNode > .bottom {
+ font-size: 12pt;
width: 100%;
overflow: hidden;
display: table-row;
@@ -165,17 +163,24 @@ html,body {
white-space: nowrap;
float: left;
padding: 0 0 0 0.5rem;
+ font-size: 12pt;
+ height: 100%;
}
.zeroTierNode > .bottom > .left > .statusLine {
font-family: monospace;
white-space: nowrap;
font-size: 12pt;
+ height: 100%;
}
.zeroTierNode > .bottom > .right {
- background: #91a2a3;
text-align: right;
+ height: 100%;
white-space: nowrap;
float: right;
+ font-size: 12pt;
+}
+.zeroTierNode > .bottom > .right form {
+ height: 100%;
}
.zeroTierNode > .bottom > .right input {
font-family: monospace;
@@ -183,10 +188,13 @@ html,body {
background: #ffffff;
color: #000000;
outline: none;
- border: 1px solid #234447;
+ outline-style: none;
+ box-shadow: 0;
+ border: 0;
margin: 0;
- padding: 0.05rem 0.25rem 0.05rem 0.25rem;
- display: inline-block;
+ padding: 0 0.25rem 0 0.25rem;
+ display: inline;
+ height: 100%;
}
.zeroTierNode > .bottom > .right button {
display: inline-block;
@@ -196,10 +204,14 @@ html,body {
color: #000000;
margin: 0;
padding: 0.05rem 0.75rem 0.05rem 0.75rem;
+ outline: none;
+ outline-style: none;
height: 100%;
}
.zeroTierNode > .bottom > .right button:hover {
cursor: pointer;
+ outline: none;
+ outline-style: none;
border: 1px solid #000000;
}
@@ -217,7 +229,7 @@ html,body {
font-size: 12pt;
}
.zeroTierNetwork .networkInfo .networkId {
- font-size: 10pt;
+ font-size: 11pt;
font-family: monospace;
color: #91a2a3;
}
diff --git a/ui/ztui.min.js b/ui/ztui.min.js
index f4213a0f..cefd9e87 100644
--- a/ui/ztui.min.js
+++ b/ui/ztui.min.js
@@ -1,3 +1 @@
-var ZeroTierNetwork=React.createClass({displayName:"ZeroTierNetwork",getInitialState:function(){return{}},leaveNetwork:function(e){Ajax.call({url:"network/"+this.props.nwid+"?auth="+this.props.authToken,cache:!1,type:"DELETE",success:function(e){this.props.onNetworkDeleted&&this.props.onNetworkDeleted(this.props.nwid)}.bind(this),error:function(e){}.bind(this)}),e.preventDefault()},render:function(){return React.createElement("div",{className:"zeroTierNetwork"},React.createElement("div",{className:"networkInfo"},React.createElement("span",{className:"networkId"},this.props.nwid)," ",React.createElement("span",{className:"networkName"},this.props.name)),React.createElement("div",{className:"networkProps"},React.createElement("div",{className:"row"},React.createElement("div",{className:"name"},"Status"),React.createElement("div",{className:"value"},this.props.status)),React.createElement("div",{className:"row"},React.createElement("div",{className:"name"},"Type"),React.createElement("div",{className:"value"},this.props.type)),React.createElement("div",{className:"row"},React.createElement("div",{className:"name"},"MAC"),React.createElement("div",{className:"value zeroTierAddress"},this.props.mac)),React.createElement("div",{className:"row"},React.createElement("div",{className:"name"},"MTU"),React.createElement("div",{className:"value"},this.props.mtu)),React.createElement("div",{className:"row"},React.createElement("div",{className:"name"},"Broadcast"),React.createElement("div",{className:"value"},this.props.broadcastEnabled?"ENABLED":"DISABLED")),React.createElement("div",{className:"row"},React.createElement("div",{className:"name"},"Bridging"),React.createElement("div",{className:"value"},this.props.bridge?"ACTIVE":"DISABLED")),React.createElement("div",{className:"row"},React.createElement("div",{className:"name"},"Device"),React.createElement("div",{className:"value"},this.props.portDeviceName?this.props.portDeviceName:"(none)")),React.createElement("div",{className:"row"},React.createElement("div",{className:"name"},"Managed IPs"),React.createElement("div",{className:"value ipList"},this.props.assignedAddresses.map(function(e){return React.createElement("div",{key:e,className:"ipAddress"},e)})))),React.createElement("button",{className:"leaveNetworkButton",onClick:this.leaveNetwork},"Leave Network"))}}); var ZeroTierNode=React.createClass({displayName:"ZeroTierNode",getInitialState:function(){return{address:"----------",online:!1,version:"_._._",_networks:[],_peers:[]}},ago:function(e){if(e>0){var t=Math.round((Date.now()-e)/1e3);return t>0?t:0}return 0},updatePeers:function(){Ajax.call({url:"peer?auth="+this.props.authToken,cache:!1,type:"GET",success:function(e){if(e){var t=JSON.parse(e);Array.isArray(t)&&this.setState({_peers:t})}}.bind(this),error:function(){}.bind(this)})},updateNetworks:function(){Ajax.call({url:"network?auth="+this.props.authToken,cache:!1,type:"GET",success:function(e){if(e){var t=JSON.parse(e);Array.isArray(t)&&this.setState({_networks:t})}}.bind(this),error:function(){}.bind(this)})},updateAll:function(){Ajax.call({url:"status?auth="+this.props.authToken,cache:!1,type:"GET",success:function(e){if(this.alertedToFailure=!1,e){var t=JSON.parse(e);this.setState(t),document.title="ZeroTier One ["+t.address+"]"}this.updateNetworks(),this.updatePeers()}.bind(this),error:function(){this.setState(this.getInitialState()),this.alertedToFailure||(this.alertedToFailure=!0,alert("Authorization token invalid or ZeroTier One service not running."))}.bind(this)})},joinNetwork:function(e){e.preventDefault(),this.networkToJoin&&16===this.networkToJoin.length?Ajax.call({url:"network/"+this.networkToJoin+"?auth="+this.props.authToken,cache:!1,type:"POST",success:function(e){this.networkToJoin="",this.networkInputElement&&(this.networkInputElement.value=""),this.updateNetworks()}.bind(this),error:function(){}.bind(this)}):alert("To join a network, enter its 16-digit network ID.")},handleNetworkIdEntry:function(e){this.networkInputElement=e.target;var t=e.target.value;if(t){t=t.toLowerCase();for(var a="",s=0;s<t.length&&16>s;++s)"0123456789abcdef".indexOf(t.charAt(s))>=0&&(a+=t.charAt(s));this.networkToJoin=a,e.target.value=a}else this.networkToJoin="",e.target.value=""},handleNetworkDelete:function(e){for(var t=[],a=0;a<this.state._networks.length;++a)this.state._networks[a].nwid!==e&&t.push(this.state._networks[a]);this.setState({_networks:t})},componentDidMount:function(){this.tabIndex=0,this.updateAll(),this.updateIntervalId=setInterval(this.updateAll,2500)},componentWillUnmount:function(){clearInterval(this.updateIntervalId)},render:function(){return React.createElement("div",{className:"zeroTierNode"},React.createElement("div",{className:"top"},"  ",React.createElement("button",{disabled:0===this.tabIndex,onClick:function(){this.tabIndex=0,this.forceUpdate()}.bind(this)},"Networks"),React.createElement("button",{disabled:1===this.tabIndex,onClick:function(){this.tabIndex=1,this.forceUpdate()}.bind(this)},"Peers"),React.createElement("div",{className:"logo"},"⏁ ")),React.createElement("div",{className:"middle"},React.createElement("div",{className:"middleScroll"},1===this.tabIndex?React.createElement("div",{className:"peers",key:"_peers"},React.createElement("div",{className:"peerHeader",key:"_peersHeader"},React.createElement("div",{className:"f"},"Address"),React.createElement("div",{className:"f"},"Version"),React.createElement("div",{className:"f"},"Latency"),React.createElement("div",{className:"f"},"Data Paths"),React.createElement("div",{className:"f"},"Last Frame"),React.createElement("div",{className:"f"},"Role")),this.state._peers.map(function(e){return React.createElement("div",{className:"peer",key:e.address},React.createElement("div",{className:"f zeroTierAddress"},e.address),React.createElement("div",{className:"f"},"-1.-1.-1"===e.version?"-":e.version),React.createElement("div",{className:"f"},e.latency),React.createElement("div",{className:"f"},0===e.paths.length?React.createElement("div",{className:"peerPath"}):React.createElement("div",null,e.paths.map(function(e){var t=e.active||e.fixed?e.preferred?"peerPathPreferred":"peerPathActive":"peerPathInactive";return React.createElement("div",{className:t},e.address,"  ",this.ago(e.lastSend),"/",this.ago(e.lastReceive))}.bind(this)))),React.createElement("div",{className:"f"},this.ago(e.lastUnicastFrame)),React.createElement("div",{className:"f"},e.role))}.bind(this))):React.createElement("div",{className:"networks",key:"_networks"},this.state._networks.map(function(e){return e.authToken=this.props.authToken,e.onNetworkDeleted=this.handleNetworkDelete,React.createElement("div",{className:"network",key:e.nwid},React.createElement(ZeroTierNetwork,e))}.bind(this))))),React.createElement("div",{className:"bottom"},React.createElement("div",{className:"left"},React.createElement("span",{className:"statusLine"},React.createElement("span",{className:"zeroTierAddress"},this.state.address),"  ",this.state.online?"ONLINE":"OFFLINE","  ",this.state.version)),React.createElement("div",{className:"right"},React.createElement("form",{onSubmit:this.joinNetwork},React.createElement("input",{type:"text",placeholder:" [ Network ID ]",onChange:this.handleNetworkIdEntry,size:"16"}),React.createElement("button",{type:"submit"},"Join")))))}});
-var ZeroTierNetwork=React.createClass({displayName:"ZeroTierNetwork",getInitialState:function(){return{}},leaveNetwork:function(e){Ajax.call({url:"network/"+this.props.nwid+"?auth="+this.props.authToken,cache:!1,type:"DELETE",success:function(e){this.props.onNetworkDeleted&&this.props.onNetworkDeleted(this.props.nwid)}.bind(this),error:function(e){}.bind(this)}),e.preventDefault()},render:function(){return React.createElement("div",{className:"zeroTierNetwork"},React.createElement("div",{className:"networkInfo"},React.createElement("span",{className:"networkId"},this.props.nwid)," ",React.createElement("span",{className:"networkName"},this.props.name)),React.createElement("div",{className:"networkProps"},React.createElement("div",{className:"row"},React.createElement("div",{className:"name"},"Status"),React.createElement("div",{className:"value"},this.props.status)),React.createElement("div",{className:"row"},React.createElement("div",{className:"name"},"Type"),React.createElement("div",{className:"value"},this.props.type)),React.createElement("div",{className:"row"},React.createElement("div",{className:"name"},"MAC"),React.createElement("div",{className:"value zeroTierAddress"},this.props.mac)),React.createElement("div",{className:"row"},React.createElement("div",{className:"name"},"MTU"),React.createElement("div",{className:"value"},this.props.mtu)),React.createElement("div",{className:"row"},React.createElement("div",{className:"name"},"Broadcast"),React.createElement("div",{className:"value"},this.props.broadcastEnabled?"ENABLED":"DISABLED")),React.createElement("div",{className:"row"},React.createElement("div",{className:"name"},"Bridging"),React.createElement("div",{className:"value"},this.props.bridge?"ACTIVE":"DISABLED")),React.createElement("div",{className:"row"},React.createElement("div",{className:"name"},"Device"),React.createElement("div",{className:"value"},this.props.portDeviceName?this.props.portDeviceName:"(none)")),React.createElement("div",{className:"row"},React.createElement("div",{className:"name"},"Managed IPs"),React.createElement("div",{className:"value ipList"},this.props.assignedAddresses.map(function(e){return React.createElement("div",{key:e,className:"ipAddress"},e)})))),React.createElement("button",{className:"leaveNetworkButton",onClick:this.leaveNetwork},"Leave Network"))}}); var ZeroTierNode=React.createClass({displayName:"ZeroTierNode",getInitialState:function(){return{address:"----------",online:!1,version:"_._._",_networks:[],_peers:[]}},ago:function(e){if(e>0){var t=Math.round((Date.now()-e)/1e3);return t>0?t:0}return 0},updatePeers:function(){Ajax.call({url:"peer?auth="+this.props.authToken,cache:!1,type:"GET",success:function(e){if(e){var t=JSON.parse(e);Array.isArray(t)&&this.setState({_peers:t})}}.bind(this),error:function(){}.bind(this)})},updateNetworks:function(){Ajax.call({url:"network?auth="+this.props.authToken,cache:!1,type:"GET",success:function(e){if(e){var t=JSON.parse(e);Array.isArray(t)&&this.setState({_networks:t})}}.bind(this),error:function(){}.bind(this)})},updateAll:function(){Ajax.call({url:"status?auth="+this.props.authToken,cache:!1,type:"GET",success:function(e){if(this.alertedToFailure=!1,e){var t=JSON.parse(e);this.setState(t),document.title="ZeroTier One ["+t.address+"]"}this.updateNetworks(),this.updatePeers()}.bind(this),error:function(){this.setState(this.getInitialState()),this.alertedToFailure||(this.alertedToFailure=!0,alert("Authorization token invalid or ZeroTier One service not running."))}.bind(this)})},joinNetwork:function(e){e.preventDefault(),this.networkToJoin&&16===this.networkToJoin.length?Ajax.call({url:"network/"+this.networkToJoin+"?auth="+this.props.authToken,cache:!1,type:"POST",success:function(e){this.networkToJoin="",this.networkInputElement&&(this.networkInputElement.value=""),this.updateNetworks()}.bind(this),error:function(){}.bind(this)}):alert("To join a network, enter its 16-digit network ID.")},handleNetworkIdEntry:function(e){this.networkInputElement=e.target;var t=e.target.value;if(t){t=t.toLowerCase();for(var a="",s=0;s<t.length&&16>s;++s)"0123456789abcdef".indexOf(t.charAt(s))>=0&&(a+=t.charAt(s));this.networkToJoin=a,e.target.value=a}else this.networkToJoin="",e.target.value=""},handleNetworkDelete:function(e){for(var t=[],a=0;a<this.state._networks.length;++a)this.state._networks[a].nwid!==e&&t.push(this.state._networks[a]);this.setState({_networks:t})},componentDidMount:function(){this.tabIndex=0,this.updateAll(),this.updateIntervalId=setInterval(this.updateAll,2500)},componentWillUnmount:function(){clearInterval(this.updateIntervalId)},render:function(){return React.createElement("div",{className:"zeroTierNode"},React.createElement("div",{className:"top"},"  ",React.createElement("button",{disabled:0===this.tabIndex,onClick:function(){this.tabIndex=0,this.forceUpdate()}.bind(this)},"Networks"),React.createElement("button",{disabled:1===this.tabIndex,onClick:function(){this.tabIndex=1,this.forceUpdate()}.bind(this)},"Peers"),React.createElement("div",{className:"logo"},"⏁ ")),React.createElement("div",{className:"middle"},React.createElement("div",{className:"middleScroll"},1===this.tabIndex?React.createElement("div",{className:"peers",key:"_peers"},React.createElement("div",{className:"peerHeader",key:"_peersHeader"},React.createElement("div",{className:"f"},"Address"),React.createElement("div",{className:"f"},"Version"),React.createElement("div",{className:"f"},"Latency"),React.createElement("div",{className:"f"},"Data Paths"),React.createElement("div",{className:"f"},"Last Frame"),React.createElement("div",{className:"f"},"Role")),this.state._peers.map(function(e){return React.createElement("div",{className:"peer",key:e.address},React.createElement("div",{className:"f zeroTierAddress"},e.address),React.createElement("div",{className:"f"},"-1.-1.-1"===e.version?"-":e.version),React.createElement("div",{className:"f"},e.latency),React.createElement("div",{className:"f"},0===e.paths.length?React.createElement("div",{className:"peerPath"}):React.createElement("div",null,e.paths.map(function(e){var t=e.active||e.fixed?e.preferred?"peerPathPreferred":"peerPathActive":"peerPathInactive";return React.createElement("div",{className:t},e.address,"  ",this.ago(e.lastSend),"/",this.ago(e.lastReceive))}.bind(this)))),React.createElement("div",{className:"f"},this.ago(e.lastUnicastFrame)),React.createElement("div",{className:"f"},e.role))}.bind(this))):React.createElement("div",{className:"networks",key:"_networks"},this.state._networks.map(function(e){return e.authToken=this.props.authToken,e.onNetworkDeleted=this.handleNetworkDelete,React.createElement("div",{className:"network",key:e.nwid},React.createElement(ZeroTierNetwork,e))}.bind(this))))),React.createElement("div",{className:"bottom"},React.createElement("div",{className:"left"},React.createElement("span",{className:"statusLine"},React.createElement("span",{className:"zeroTierAddress"},this.state.address),"  ",this.state.online?"ONLINE":"OFFLINE","  ",this.state.version)),React.createElement("div",{className:"right"},React.createElement("form",{onSubmit:this.joinNetwork},React.createElement("input",{type:"text",placeholder:" [ Network ID ]",onChange:this.handleNetworkIdEntry,size:"16"}),React.createElement("button",{type:"submit"},"Join")))))}});
-var ZeroTierNetwork=React.createClass({displayName:"ZeroTierNetwork",getInitialState:function(){return{}},leaveNetwork:function(e){Ajax.call({url:"network/"+this.props.nwid+"?auth="+this.props.authToken,cache:!1,type:"DELETE",success:function(e){this.props.onNetworkDeleted&&this.props.onNetworkDeleted(this.props.nwid)}.bind(this),error:function(e){}.bind(this)}),e.preventDefault()},render:function(){return React.createElement("div",{className:"zeroTierNetwork"},React.createElement("div",{className:"networkInfo"},React.createElement("span",{className:"networkId"},this.props.nwid)," ",React.createElement("span",{className:"networkName"},this.props.name)),React.createElement("div",{className:"networkProps"},React.createElement("div",{className:"row"},React.createElement("div",{className:"name"},"Status"),React.createElement("div",{className:"value"},this.props.status)),React.createElement("div",{className:"row"},React.createElement("div",{className:"name"},"Type"),React.createElement("div",{className:"value"},this.props.type)),React.createElement("div",{className:"row"},React.createElement("div",{className:"name"},"MAC"),React.createElement("div",{className:"value zeroTierAddress"},this.props.mac)),React.createElement("div",{className:"row"},React.createElement("div",{className:"name"},"MTU"),React.createElement("div",{className:"value"},this.props.mtu)),React.createElement("div",{className:"row"},React.createElement("div",{className:"name"},"Broadcast"),React.createElement("div",{className:"value"},this.props.broadcastEnabled?"ENABLED":"DISABLED")),React.createElement("div",{className:"row"},React.createElement("div",{className:"name"},"Bridging"),React.createElement("div",{className:"value"},this.props.bridge?"ACTIVE":"DISABLED")),React.createElement("div",{className:"row"},React.createElement("div",{className:"name"},"Device"),React.createElement("div",{className:"value"},this.props.portDeviceName?this.props.portDeviceName:"(none)")),React.createElement("div",{className:"row"},React.createElement("div",{className:"name"},"Managed IPs"),React.createElement("div",{className:"value ipList"},this.props.assignedAddresses.map(function(e){return React.createElement("div",{key:e,className:"ipAddress"},e)})))),React.createElement("button",{className:"leaveNetworkButton",onClick:this.leaveNetwork},"Leave Network"))}}); var ZeroTierNode=React.createClass({displayName:"ZeroTierNode",getInitialState:function(){return{address:"----------",online:!1,version:"_._._",_networks:[],_peers:[]}},ago:function(e){if(e>0){var t=Math.round((Date.now()-e)/1e3);return t>0?t:0}return 0},updatePeers:function(){Ajax.call({url:"peer?auth="+this.props.authToken,cache:!1,type:"GET",success:function(e){if(e){var t=JSON.parse(e);Array.isArray(t)&&this.setState({_peers:t})}}.bind(this),error:function(){}.bind(this)})},updateNetworks:function(){Ajax.call({url:"network?auth="+this.props.authToken,cache:!1,type:"GET",success:function(e){if(e){var t=JSON.parse(e);Array.isArray(t)&&this.setState({_networks:t})}}.bind(this),error:function(){}.bind(this)})},updateAll:function(){Ajax.call({url:"status?auth="+this.props.authToken,cache:!1,type:"GET",success:function(e){if(this.alertedToFailure=!1,e){var t=JSON.parse(e);this.setState(t),document.title="ZeroTier One ["+t.address+"]"}this.updateNetworks(),this.updatePeers()}.bind(this),error:function(){this.setState(this.getInitialState()),this.alertedToFailure||(this.alertedToFailure=!0,alert("Authorization token invalid or ZeroTier One service not running."))}.bind(this)})},joinNetwork:function(e){e.preventDefault(),this.networkToJoin&&16===this.networkToJoin.length?Ajax.call({url:"network/"+this.networkToJoin+"?auth="+this.props.authToken,cache:!1,type:"POST",success:function(e){this.networkToJoin="",this.networkInputElement&&(this.networkInputElement.value=""),this.updateNetworks()}.bind(this),error:function(){}.bind(this)}):alert("To join a network, enter its 16-digit network ID.")},handleNetworkIdEntry:function(e){this.networkInputElement=e.target;var t=e.target.value;if(t){t=t.toLowerCase();for(var a="",s=0;s<t.length&&16>s;++s)"0123456789abcdef".indexOf(t.charAt(s))>=0&&(a+=t.charAt(s));this.networkToJoin=a,e.target.value=a}else this.networkToJoin="",e.target.value=""},handleNetworkDelete:function(e){for(var t=[],a=0;a<this.state._networks.length;++a)this.state._networks[a].nwid!==e&&t.push(this.state._networks[a]);this.setState({_networks:t})},componentDidMount:function(){this.tabIndex=0,this.updateAll(),this.updateIntervalId=setInterval(this.updateAll,2500)},componentWillUnmount:function(){clearInterval(this.updateIntervalId)},render:function(){return React.createElement("div",{className:"zeroTierNode"},React.createElement("div",{className:"top"},"  ",React.createElement("button",{disabled:0===this.tabIndex,onClick:function(){this.tabIndex=0,this.forceUpdate()}.bind(this)},"Networks"),React.createElement("button",{disabled:1===this.tabIndex,onClick:function(){this.tabIndex=1,this.forceUpdate()}.bind(this)},"Peers"),React.createElement("div",{className:"logo"},"⏁ ")),React.createElement("div",{className:"middle"},React.createElement("div",{className:"middleScroll"},1===this.tabIndex?React.createElement("div",{className:"peers",key:"_peers"},React.createElement("div",{className:"peerHeader",key:"_peersHeader"},React.createElement("div",{className:"f"},"Address"),React.createElement("div",{className:"f"},"Version"),React.createElement("div",{className:"f"},"Latency"),React.createElement("div",{className:"f"},"Data Paths"),React.createElement("div",{className:"f"},"Last Frame"),React.createElement("div",{className:"f"},"Role")),this.state._peers.map(function(e){return React.createElement("div",{className:"peer",key:e.address},React.createElement("div",{className:"f zeroTierAddress"},e.address),React.createElement("div",{className:"f"},"-1.-1.-1"===e.version?"-":e.version),React.createElement("div",{className:"f"},e.latency),React.createElement("div",{className:"f"},0===e.paths.length?React.createElement("div",{className:"peerPath"}):React.createElement("div",null,e.paths.map(function(e){var t=e.active||e.fixed?e.preferred?"peerPathPreferred":"peerPathActive":"peerPathInactive";return React.createElement("div",{className:t},e.address,"  ",this.ago(e.lastSend),"/",this.ago(e.lastReceive))}.bind(this)))),React.createElement("div",{className:"f"},this.ago(e.lastUnicastFrame)),React.createElement("div",{className:"f"},e.role))}.bind(this))):React.createElement("div",{className:"networks",key:"_networks"},this.state._networks.map(function(e){return e.authToken=this.props.authToken,e.onNetworkDeleted=this.handleNetworkDelete,React.createElement("div",{className:"network",key:e.nwid},React.createElement(ZeroTierNetwork,e))}.bind(this))))),React.createElement("div",{className:"bottom"},React.createElement("div",{className:"left"},React.createElement("span",{className:"statusLine"},React.createElement("span",{className:"zeroTierAddress"},this.state.address),"  ",this.state.online?"ONLINE":"OFFLINE","  ",this.state.version)),React.createElement("div",{className:"right"},React.createElement("form",{onSubmit:this.joinNetwork},React.createElement("input",{type:"text",placeholder:" [ Network ID ]",onChange:this.handleNetworkIdEntry,size:"16"}),React.createElement("button",{type:"submit"},"Join")))))}});
+var ZeroTierNetwork=React.createClass({displayName:"ZeroTierNetwork",getInitialState:function(){return{}},leaveNetwork:function(e){Ajax.call({url:"network/"+this.props.nwid+"?auth="+this.props.authToken,cache:!1,type:"DELETE",success:function(e){this.props.onNetworkDeleted&&this.props.onNetworkDeleted(this.props.nwid)}.bind(this),error:function(e){}.bind(this)}),e.preventDefault()},render:function(){return React.createElement("div",{className:"zeroTierNetwork"},React.createElement("div",{className:"networkInfo"},React.createElement("span",{className:"networkId"},this.props.nwid)," ",React.createElement("span",{className:"networkName"},this.props.name)),React.createElement("div",{className:"networkProps"},React.createElement("div",{className:"row"},React.createElement("div",{className:"name"},"Status"),React.createElement("div",{className:"value"},this.props.status)),React.createElement("div",{className:"row"},React.createElement("div",{className:"name"},"Type"),React.createElement("div",{className:"value"},this.props.type)),React.createElement("div",{className:"row"},React.createElement("div",{className:"name"},"MAC"),React.createElement("div",{className:"value zeroTierAddress"},this.props.mac)),React.createElement("div",{className:"row"},React.createElement("div",{className:"name"},"MTU"),React.createElement("div",{className:"value"},this.props.mtu)),React.createElement("div",{className:"row"},React.createElement("div",{className:"name"},"Broadcast"),React.createElement("div",{className:"value"},this.props.broadcastEnabled?"ENABLED":"DISABLED")),React.createElement("div",{className:"row"},React.createElement("div",{className:"name"},"Bridging"),React.createElement("div",{className:"value"},this.props.bridge?"ACTIVE":"DISABLED")),React.createElement("div",{className:"row"},React.createElement("div",{className:"name"},"Device"),React.createElement("div",{className:"value"},this.props.portDeviceName?this.props.portDeviceName:"(none)")),React.createElement("div",{className:"row"},React.createElement("div",{className:"name"},"Managed IPs"),React.createElement("div",{className:"value ipList"},this.props.assignedAddresses.map(function(e){return React.createElement("div",{key:e,className:"ipAddress"},e)})))),React.createElement("button",{type:"button",className:"leaveNetworkButton",onClick:this.leaveNetwork},"Leave Network"))}}); var ZeroTierNode=React.createClass({displayName:"ZeroTierNode",getInitialState:function(){return{address:"----------",online:!1,version:"_._._",_networks:[],_peers:[]}},ago:function(e){if(e>0){var t=Math.round((Date.now()-e)/1e3);return t>0?t:0}return 0},updatePeers:function(){Ajax.call({url:"peer?auth="+this.props.authToken,cache:!1,type:"GET",success:function(e){if(e){var t=JSON.parse(e);Array.isArray(t)&&this.setState({_peers:t})}}.bind(this),error:function(){}.bind(this)})},updateNetworks:function(){Ajax.call({url:"network?auth="+this.props.authToken,cache:!1,type:"GET",success:function(e){if(e){var t=JSON.parse(e);Array.isArray(t)&&this.setState({_networks:t})}}.bind(this),error:function(){}.bind(this)})},updateAll:function(){Ajax.call({url:"status?auth="+this.props.authToken,cache:!1,type:"GET",success:function(e){if(this.alertedToFailure=!1,e){var t=JSON.parse(e);this.setState(t),document.title="ZeroTier One ["+t.address+"]"}this.updateNetworks(),this.updatePeers()}.bind(this),error:function(){this.setState(this.getInitialState()),this.alertedToFailure||(this.alertedToFailure=!0,alert("Authorization token invalid or ZeroTier One service not running."))}.bind(this)})},joinNetwork:function(e){e.preventDefault(),this.networkToJoin&&16===this.networkToJoin.length?Ajax.call({url:"network/"+this.networkToJoin+"?auth="+this.props.authToken,cache:!1,type:"POST",success:function(e){this.networkToJoin="",this.networkInputElement&&(this.networkInputElement.value=""),this.updateNetworks()}.bind(this),error:function(){}.bind(this)}):alert("To join a network, enter its 16-digit network ID.")},handleNetworkIdEntry:function(e){this.networkInputElement=e.target;var t=this.networkInputElement.value;if(t){t=t.toLowerCase();for(var a="",n=0;n<t.length&&16>n;++n)"0123456789abcdef".indexOf(t.charAt(n))>=0&&(a+=t.charAt(n));this.networkToJoin=a,this.networkInputElement.value=a}else this.networkToJoin="",this.networkInputElement.value=""},handleNetworkDelete:function(e){for(var t=[],a=0;a<this.state._networks.length;++a)this.state._networks[a].nwid!==e&&t.push(this.state._networks[a]);this.setState({_networks:t})},componentDidMount:function(){this.tabIndex=0,this.updateAll(),this.updateIntervalId=setInterval(this.updateAll,2500)},componentWillUnmount:function(){clearInterval(this.updateIntervalId)},render:function(){return React.createElement("div",{className:"zeroTierNode"},React.createElement("div",{className:"top"},"  ",React.createElement("button",{disabled:0===this.tabIndex,onClick:function(){this.tabIndex=0,this.forceUpdate()}.bind(this)},"Networks"),React.createElement("button",{disabled:1===this.tabIndex,onClick:function(){this.tabIndex=1,this.forceUpdate()}.bind(this)},"Peers")),React.createElement("div",{className:"middle"},React.createElement("div",{className:"middleCell"},React.createElement("div",{className:"middleScroll"},1===this.tabIndex?React.createElement("div",{className:"peers",key:"_peers"},React.createElement("div",{className:"peerHeader",key:"_peersHeader"},React.createElement("div",{className:"f"},"Address"),React.createElement("div",{className:"f"},"Version"),React.createElement("div",{className:"f"},"Latency"),React.createElement("div",{className:"f"},"Data Paths"),React.createElement("div",{className:"f"},"Last Frame"),React.createElement("div",{className:"f"},"Role")),this.state._peers.map(function(e){return React.createElement("div",{className:"peer",key:e.address},React.createElement("div",{className:"f zeroTierAddress"},e.address),React.createElement("div",{className:"f"},"-1.-1.-1"===e.version?"-":e.version),React.createElement("div",{className:"f"},e.latency),React.createElement("div",{className:"f"},0===e.paths.length?React.createElement("div",{className:"peerPath"}):React.createElement("div",null,e.paths.map(function(e){var t=e.active||e.fixed?e.preferred?"peerPathPreferred":"peerPathActive":"peerPathInactive";return React.createElement("div",{className:t},e.address,"  ",this.ago(e.lastSend),"/",this.ago(e.lastReceive))}.bind(this)))),React.createElement("div",{className:"f"},this.ago(e.lastUnicastFrame)),React.createElement("div",{className:"f"},e.role))}.bind(this))):React.createElement("div",{className:"networks",key:"_networks"},this.state._networks.map(function(e){return e.authToken=this.props.authToken,e.onNetworkDeleted=this.handleNetworkDelete,React.createElement("div",{className:"network",key:e.nwid},React.createElement(ZeroTierNetwork,e))}.bind(this)))))),React.createElement("div",{className:"bottom"},React.createElement("div",{className:"left"},React.createElement("span",{className:"statusLine"},React.createElement("span",{className:"zeroTierAddress"},this.state.address),"  ",this.state.online?"ONLINE":"OFFLINE","  ",this.state.version)),React.createElement("div",{className:"right"},React.createElement("form",{onSubmit:this.joinNetwork},React.createElement("input",{type:"text",maxlength:"16",placeholder:"[ Network ID ]",onChange:this.handleNetworkIdEntry,size:"16"}),React.createElement("button",{type:"button",onClick:this.joinNetwork},"Join")))))}});
generated by cgit v1.2.3 (git 2.39.1) at 2025-04-13 06:13:29 +0000