diff --git a/public/index.html b/public/index.html index 9995f53..b475435 100644 --- a/public/index.html +++ b/public/index.html @@ -4,7 +4,7 @@ - Bitmap + Bitfeed diff --git a/src/components/TxRender.svelte b/src/components/TxRender.svelte index 8518e1b..d23e72b 100644 --- a/src/components/TxRender.svelte +++ b/src/components/TxRender.svelte @@ -22,8 +22,6 @@ const baseTime = Date.now() const nullPointArray = new Float32Array() - // const staticPointArray = new Float32Array(JSON.parse("[19.500000000000114,19.500000000000114,1664,0.0006666666666666666,591.8000000000001,28.000000000000018,1664,0.0006666666666666666,0,0,1664,0.000033333333333333335,0,1,1664,0.000033333333333333335,1,1,1664,0.0006666666666666666,27.100000000000115,27.100000000000115,1664,0.0006666666666666666,599.4,35.600000000000016,1664,0.0006666666666666666,0,0,1664,0.000033333333333333335,0,1,1664,0.000033333333333333335,1,1,1664,0.0006666666666666666,27.100000000000115,27.100000000000115,1664,0.0006666666666666666,591.8000000000001,28.000000000000018,1664,0.0006666666666666666,0,0,1664,0.000033333333333333335,0,1,1664,0.000033333333333333335,1,1,1664,0.0006666666666666666,19.500000000000114,19.500000000000114,1664,0.0006666666666666666,591.8000000000001,28.000000000000018,1664,0.0006666666666666666,0,0,1664,0.000033333333333333335,0,1,1664,0.000033333333333333335,1,1,1664,0.0006666666666666666,27.100000000000115,27.100000000000115,1664,0.0006666666666666666,599.4,35.600000000000016,1664,0.0006666666666666666,0,0,1664,0.000033333333333333335,0,1,1664,0.000033333333333333335,1,1,1664,0.0006666666666666666,19.500000000000114,19.500000000000114,1664,0.0006666666666666666,599.4,35.600000000000016,1664,0.0006666666666666666,0,0,1664,0.000033333333333333335,0,1,1664,0.000033333333333333335,1,1,1664,0.0006666666666666666]" - // )) // Props export let controller @@ -120,8 +118,6 @@ // /* RESET DRAWING AREA */ /* LOAD VERTEX DATA */ - // pointArray = nullPointArray //getTxPointArray() - // pointArray = staticPointArray //getTxPointArray() pointArray = getTxPointArray() if (config.layoutHints) { debugPointArray = getDebugTxPointArray() diff --git a/src/components/TxViz.svelte b/src/components/TxViz.svelte index fccf1b3..b2bda28 100644 --- a/src/components/TxViz.svelte +++ b/src/components/TxViz.svelte @@ -19,10 +19,6 @@ let currentBlock = null - $: { - console.log('block: ', currentBlock) - } - let txStream if (!config.nofeed) txStream = getTxStream() @@ -88,8 +84,8 @@ $darkMode = !$darkMode } - $: connectionColor = $serverConnected ? ($serverDelay < 500 ? 'green' : 'amber') : 'red' - $: connectionTitle = $serverConnected ? ($serverDelay < 500 ? 'Receiving live transactions' : 'Unstable connection') : 'No connection' + $: connectionColor = ($serverConnected && $serverDelay < 5000) ? ($serverDelay < 500 ? 'green' : 'amber') : 'red' + $: connectionTitle = ($serverConnected && $serverDelay < 5000) ? ($serverDelay < 500 ? 'Streaming live transactions' : 'Unstable connection') : 'Disconnected' $: { if (lastFrameUpdate + 250 < Date.now()) { frameRateLabel = Number($frameRate).toFixed(1) + ' FPS' @@ -241,6 +237,7 @@
{#if config.debug} + { $serverDelay } ms { $txQueueLength } { $txCount } {/if} diff --git a/src/controllers/TxStream.js b/src/controllers/TxStream.js index 3bc25c4..ba6fc27 100644 --- a/src/controllers/TxStream.js +++ b/src/controllers/TxStream.js @@ -7,12 +7,18 @@ class TxStream { this.reconnectBackoff = 128 this.websocket = null this.setConnected(false) - this.setDelay(1000) + this.setDelay(0) this.lastBeat = Date.now() this.reconnectTimeout = null this.heartbeatTimeout = null + this.delayInterval = setInterval(() => { + if (this.lastBeat && this.connected) { + this.setDelay(Date.now() - this.lastBeat) + } + }, 789) + this.init() } @@ -27,15 +33,17 @@ class TxStream { } init () { - try { - this.websocket = new WebSocket(this.websocketUri) - this.websocket.onopen = (evt) => { this.onopen(evt) } - this.websocket.onclose = (evt) => { this.onclose(evt) } - this.websocket.onmessage = (evt) => { this.onmessage(evt) } - this.websocket.onerror = (evt) => { this.onerror(evt) } - } catch (error) { - // console.log('failed to open websocket: ', error) - } + if (!this.connected && (!this.websocket || this.websocket.readyState === WebSocket.CLOSED)) { + try { + if (!this.websocket) this.websocket = new WebSocket(this.websocketUri) + this.websocket.onopen = (evt) => { this.onopen(evt) } + this.websocket.onclose = (evt) => { this.onclose(evt) } + this.websocket.onmessage = (evt) => { this.onmessage(evt) } + this.websocket.onerror = (evt) => { this.onerror(evt) } + } catch (error) { + this.reconnect() + } + } else this.reconnect() } reconnect () { @@ -50,22 +58,43 @@ class TxStream { if (this.heartbeatTimeout) clearTimeout(this.heartbeatTimeout) if (this.reconnectTimeout) clearTimeout(this.reconnectTimeout) this.setDelay(Date.now() - this.lastBeat) + this.lastBeat = null this.setConnected(true) - this.heartbeatTimeout = setTimeout(() => { this.sendHeartbeat() }, 5000) - } - - sendHeartbeat () { - this.lastBeat = Date.now() - this.websocket.send('hb') this.heartbeatTimeout = setTimeout(() => { - this.onclose() + this.sendHeartbeat() }, 2000) } - onopen (event) { + sendHeartbeat () { if (this.heartbeatTimeout) clearTimeout(this.heartbeatTimeout) + this.lastBeat = Date.now() + if (this.websocket && this.websocket.readyState === WebSocket.OPEN) { + this.lastBeat = Date.now() + this.websocket.send('hb') + this.heartbeatTimeout = setTimeout(() => { + this.setDelay(Date.now() - this.lastBeat) + this.disconnect() + }, 5000) + } + } + + disconnect () { + if (this.websocket) { + this.websocket.onopen = null + this.websocket.onclose = null + this.websocket.onmessage = null + this.websocket.onerror = null + this.websocket.close() + this.websocket = null + } + this.setConnected(false) + this.setDelay(0) + this.reconnect() + } + + onopen (event) { this.setConnected(true) - this.setDelay(500) + this.setDelay(0) this.reconnectBackoff = 128 this.sendHeartbeat() } diff --git a/src/models/BitcoinBlock.js b/src/models/BitcoinBlock.js index d473c74..caf078a 100644 --- a/src/models/BitcoinBlock.js +++ b/src/models/BitcoinBlock.js @@ -11,7 +11,5 @@ export default class BitcoinBlock { this.bytes = bytes // OTW size of this block in bytes this.txnCount = txn_count this.txns = txns - - console.log('new block: ', this) } } diff --git a/src/models/TxPoolScene.js b/src/models/TxPoolScene.js index 6b34dbc..59254f8 100644 --- a/src/models/TxPoolScene.js +++ b/src/models/TxPoolScene.js @@ -29,7 +29,7 @@ export default class TxPoolScene { this.txs = {} this.hiddenTxs = {} - this.heightLimit = Math.max(150, height / 4) + this.heightLimit = height / 4 this.scrollRateLimitTimer = null this.initialised = true