Commit e6c835809ff3378173c42cc91fccedf5521f6366
working scrolling for network tab
mix irving committed on 1/11/2017, 3:14:40 AMParent: a985a4d720c6d68c96dba230b7c58072d5663d71
Files changed
| modules_extra/network.js | changed |
| modules_extra/network.js | ||
|---|---|---|
| @@ -25,9 +25,8 @@ | ||
| 25 | 25 … | function legacyToMultiServer(addr) { |
| 26 | 26 … | return 'net:'+addr.host + ':'+addr.port + '~shs:'+addr.key.substring(1).replace('.ed25519','') |
| 27 | 27 … | } |
| 28 | 28 … | |
| 29 | -//types of peers | |
| 30 | 29 … | |
| 31 | 30 … | |
| 32 | 31 … | //on the same wifi network |
| 33 | 32 … | function isLocal (e) { |
| @@ -72,21 +71,9 @@ | ||
| 72 | 71 … | function origin (e) { |
| 73 | 72 … | return e.source === 'local' ? 0 : 1 |
| 74 | 73 … | } |
| 75 | 74 … | |
| 76 | -var states = { | |
| 77 | - connected: 3, | |
| 78 | - connecting: 2 | |
| 79 | -} | |
| 80 | 75 … | |
| 81 | -var types = { | |
| 82 | - modern: 4, | |
| 83 | - legacy: 3, | |
| 84 | - inactive: 2, | |
| 85 | - unattempted: 1, | |
| 86 | - other: 0 | |
| 87 | -} | |
| 88 | - | |
| 89 | 76 … | function round(n) { |
| 90 | 77 … | return Math.round(n*100)/100 |
| 91 | 78 … | } |
| 92 | 79 … | |
| @@ -99,75 +86,89 @@ | ||
| 99 | 86 … | else |
| 100 | 87 … | return round(s)+'ms' |
| 101 | 88 … | } |
| 102 | 89 … | |
| 90 … | +function peerListSort (a, b) { | |
| 91 … | + var states = { | |
| 92 … | + connected: 3, | |
| 93 … | + connecting: 2 | |
| 94 … | + } | |
| 103 | 95 … | |
| 96 … | + //types of peers | |
| 97 … | + var types = { | |
| 98 … | + modern: 4, | |
| 99 … | + legacy: 3, | |
| 100 … | + inactive: 2, | |
| 101 … | + unattempted: 1, | |
| 102 … | + other: 0 | |
| 103 … | + } | |
| 104 | 104 … | |
| 105 … | + return ( | |
| 106 … | + (states[b.state] || 0) - (states[a.state] || 0) | |
| 107 … | + || origin(b) - origin(a) | |
| 108 … | + || types[getType(b)] - types[getType(a)] | |
| 109 … | + || b.stateChange - a.stateChange | |
| 110 … | + ) | |
| 111 … | +} | |
| 112 … | + | |
| 113 … | + | |
| 105 | 114 … | exports.create = function (api) { |
| 106 | 115 … | |
| 107 | 116 … | return { |
| 108 | 117 … | menu_items: () => h('a', {href: '#/network'}, '/network'), |
| 109 | 118 … | builtin_tabs: () => ['/network'], |
| 119 … | + screen_view | |
| 120 … | + } | |
| 121 … | + | |
| 122 … | + function screen_view (path) { | |
| 123 … | + if (path !== '/network') return | |
| 110 | 124 … | |
| 111 | - screen_view: function (path) { | |
| 125 … | + var ol = h('ul', { className: 'network' }) | |
| 112 | 126 … | |
| 113 | - if(path !== '/network') return | |
| 127 … | + ;(function poll () { | |
| 114 | 128 … | |
| 115 | - var ol = h('ul.network') | |
| 129 … | + //if this tab isn't open, don't update. | |
| 130 … | + //todo: make a better way to do this... | |
| 131 … | + if (!isVisible(ol)) return setTimeout(poll, 1000) | |
| 116 | 132 … | |
| 117 | - ;(function poll () { | |
| 118 | - | |
| 119 | - //if this tab isn't open, don't update. | |
| 120 | - //todo: make a better way to do this... | |
| 121 | - if(!isVisible(ol)) | |
| 122 | - return setTimeout(poll, 1000) | |
| 123 | - | |
| 124 | - api.sbot_gossip_peers(function (err, list) { | |
| 125 | - ol.innerHTML = '' | |
| 126 | - list.sort(function (a, b) { | |
| 127 | - return ( | |
| 128 | - (states[b.state] || 0) - (states[a.state] || 0) | |
| 129 | - || origin(b) - origin(a) | |
| 130 | - || types[getType(b)] - types[getType(a)] | |
| 131 | - || b.stateChange - a.stateChange | |
| 133 … | + api.sbot_gossip_peers((err, list) => { | |
| 134 … | + ol.innerHTML = '' | |
| 135 … | + list.sort(peerListSort).forEach(peer => { | |
| 136 … | + ol.appendChild(h('div', [ | |
| 137 … | + api.avatar(peer.key, 'thumbnail'), | |
| 138 … | + h('div', [ | |
| 139 … | + peer.state || 'not connected', | |
| 140 … | + ' ', | |
| 141 … | + getType(peer), | |
| 142 … | + ' ', | |
| 143 … | + //TODO: show nicer details, with labels. etc. | |
| 144 … | + (peer.ping && peer.ping.rtt) ? duration(peer.ping.rtt.mean) : '', | |
| 145 … | + ' ', | |
| 146 … | + (peer.ping && peer.ping.skew) ? duration(peer.ping.skew.mean) : '', | |
| 147 … | + h('label', | |
| 148 … | + { title: new Date(peer.stateChange).toString() }, | |
| 149 … | + peer.stateChange && ('(' + human(new Date(peer.stateChange))) + ')' | |
| 150 … | + ) | |
| 151 … | + ]), | |
| 152 … | + 'source:'+peer.source, | |
| 153 … | + h('pre', legacyToMultiServer(peer)), | |
| 154 … | + h('button', { | |
| 155 … | + 'ev-click': () => { | |
| 156 … | + api.sbot_gossip_connect(peer, (err) => { | |
| 157 … | + if(err) console.error(err) | |
| 158 … | + else console.log('connected to', peer) | |
| 159 … | + }) | |
| 160 … | + }}, | |
| 161 … | + 'connect' | |
| 132 | 162 … | ) |
| 133 | - }).forEach(function (peer) { | |
| 134 | - ol.appendChild(h('div', [ | |
| 135 | - api.avatar(peer.key, 'thumbnail'), | |
| 136 | - h('div', [ | |
| 137 | - peer.state || 'not connected', | |
| 138 | - ' ', | |
| 139 | - getType(peer), | |
| 140 | - ' ', | |
| 141 | - //TODO: show nicer details, with labels. etc. | |
| 142 | - (peer.ping && peer.ping.rtt) ? duration(peer.ping.rtt.mean) : '', | |
| 143 | - ' ', | |
| 144 | - (peer.ping && peer.ping.skew) ? duration(peer.ping.skew.mean) : '', | |
| 145 | - h('label', | |
| 146 | - {title: new Date(peer.stateChange).toString()}, | |
| 147 | - peer.stateChange && ('(' + human(new Date(peer.stateChange))) + ')') | |
| 148 | - ]), | |
| 149 | - 'source:'+peer.source, | |
| 150 | - h('pre', legacyToMultiServer(peer)), | |
| 151 | - h('button', { | |
| 152 | - 'ev-click': () => { | |
| 153 | - api.sbot_gossip_connect(peer, (err) => { | |
| 154 | - if(err) console.error(err) | |
| 155 | - else console.log('connected to', peer) | |
| 156 | - }) | |
| 157 | - }}, | |
| 158 | - 'connect' | |
| 159 | - )]) | |
| 160 | - ) | |
| 161 | - }) | |
| 162 | - | |
| 163 | - setTimeout(poll, 5000) | |
| 163 … | + ])) | |
| 164 | 164 … | }) |
| 165 | 165 … | |
| 166 | - })() | |
| 166 … | + setTimeout(poll, 5000) | |
| 167 … | + }) | |
| 167 | 168 … | |
| 168 | - return h('div.column.scroll-y', ol) | |
| 169 | - } | |
| 169 … | + })() | |
| 170 … | + | |
| 171 … | + return h('div', { className: 'column scroll-y' }, ol) | |
| 170 | 172 … | } |
| 171 | 173 … | } |
| 172 | 174 … | |
| 173 | - | |
Built with git-ssb-web