Merge pull request #776 from ethereum/toggleListener

src/app.js

@@ -168,13 +168,89 @@ module.exports = App
 
 function run () {
   var self = this
+  // ----------------- UniversalDApp -----------------
+  var transactionContextAPI = {
+    getAddress: (cb) => {
+      cb(null, $('#txorigin').val())
+    },
+    getValue: (cb) => {
+      try {
+        var comp = $('#value').val().split(' ')
+        cb(null, executionContext.web3().toWei(comp[0], comp.slice(1).join(' ')))
+      } catch (e) {
+        cb(e)
+      }
+    },
+    getGasLimit: (cb) => {
+      cb(null, $('#gasLimit').val())
+    }
+  }
+
+  var udapp = new UniversalDApp({
+    api: {
+      logMessage: (msg) => {
+        self._components.editorpanel.log({ type: 'log', value: msg })
+      }
+    },
+    opt: { removable: false, removable_instances: true }
+  })
+  udapp.reset({}, transactionContextAPI)
+  udapp.event.register('debugRequested', this, function (txResult) {
+    startdebugging(txResult.transactionHash)
+  })
+
+  // ----------------- Tx listener -----------------
+  var transactionReceiptResolver = {
+    _transactionReceipts: {},
+    resolve: function (tx, cb) {
+      if (this._transactionReceipts[tx.hash]) {
+        return cb(null, this._transactionReceipts[tx.hash])
+      }
+      executionContext.web3().eth.getTransactionReceipt(tx.hash, (error, receipt) => {
+        if (!error) {
+          this._transactionReceipts[tx.hash] = receipt
+          cb(null, receipt)
+        } else {
+          cb(error)
+        }
+      })
+    }
+  }
+
+  var compiledContracts = function () {
+    if (compiler.lastCompilationResult && compiler.lastCompilationResult.data) {
+      return compiler.lastCompilationResult.data.contracts
+    }
+    return null
+  }
+  var txlistener = new Txlistener({
+    api: {
+      contracts: compiledContracts,
+      resolveReceipt: function (tx, cb) {
+        transactionReceiptResolver.resolve(tx, cb)
+      }
+    },
+    event: {
+      udapp: udapp.event
+    }})
+
+  var eventsDecoder = new EventsDecoder({
+    api: {
+      resolveReceipt: function (tx, cb) {
+        transactionReceiptResolver.resolve(tx, cb)
+      }
+    }
+  })
+
+  txlistener.startListening()
   // ----------------- editor ----------------------------
   this._components.editor = new Editor({}) // @TODO: put into editorpanel
   // ----------------- editor panel ----------------------
   this._components.editorpanel = new EditorPanel({
     api: {
       editor: self._components.editor,
-      config: self._api.config
+      config: self._api.config,
+      txListener: txlistener
     }
   })
   this._components.editorpanel.event.register('resize', direction => self._adjustLayout(direction))
@@ -336,37 +412,6 @@ function run () {
   }
   var staticanalysis = new StaticAnalysis(staticAnalysisAPI, compiler.event)
 
-  // ----------------- UniversalDApp -----------------
-  var transactionContextAPI = {
-    getAddress: (cb) => {
-      cb(null, $('#txorigin').val())
-    },
-    getValue: (cb) => {
-      try {
-        var comp = $('#value').val().split(' ')
-        cb(null, executionContext.web3().toWei(comp[0], comp.slice(1).join(' ')))
-      } catch (e) {
-        cb(e)
-      }
-    },
-    getGasLimit: (cb) => {
-      cb(null, $('#gasLimit').val())
-    }
-  }
-
-  var udapp = new UniversalDApp({
-    api: {
-      logMessage: (msg) => {
-        self._components.editorpanel.log({ type: 'log', value: msg })
-      }
-    },
-    opt: { removable: false, removable_instances: true }
-  })
-  udapp.reset({}, transactionContextAPI)
-  udapp.event.register('debugRequested', this, function (txResult) {
-    startdebugging(txResult.transactionHash)
-  })
-
   // ---------------- Righthand-panel --------------------
   var rhpAPI = {
     config: config,
@@ -494,53 +539,6 @@ function run () {
   transactionDebugger.addProvider('web3', executionContext.web3())
   transactionDebugger.switchProvider(executionContext.getProvider())
 
-  // ----------------- Tx listener -----------------
-
-  var transactionReceiptResolver = {
-    _transactionReceipts: {},
-    resolve: function (tx, cb) {
-      if (this._transactionReceipts[tx.hash]) {
-        return cb(null, this._transactionReceipts[tx.hash])
-      }
-      executionContext.web3().eth.getTransactionReceipt(tx.hash, (error, receipt) => {
-        if (!error) {
-          this._transactionReceipts[tx.hash] = receipt
-          cb(null, receipt)
-        } else {
-          cb(error)
-        }
-      })
-    }
-  }
-
-  var compiledContracts = function () {
-    if (compiler.lastCompilationResult && compiler.lastCompilationResult.data) {
-      return compiler.lastCompilationResult.data.contracts
-    }
-    return null
-  }
-
-  var txlistener = new Txlistener({
-    api: {
-      contracts: compiledContracts,
-      resolveReceipt: function (tx, cb) {
-        transactionReceiptResolver.resolve(tx, cb)
-      }
-    },
-    event: {
-      udapp: udapp.event
-    }})
-
-  var eventsDecoder = new EventsDecoder({
-    api: {
-      resolveReceipt: function (tx, cb) {
-        transactionReceiptResolver.resolve(tx, cb)
-      }
-    }
-  })
-
-  txlistener.startListening()
-
   var txLogger = new TxLogger({
     api: {
       editorpanel: self._components.editorpanel,

src/app/execution/txListener.js

@@ -20,28 +20,47 @@ class TxListener {
     this._api = opt.api
     this._resolvedTransactions = {}
     this._resolvedContracts = {}
+    this._isListening = false
+    this._listenOnNetwork = false
+    this._loopId = null
     this.init()
     executionContext.event.register('contextChanged', (context) => {
-      if (this.loopId) {
-        this.startListening(context)
+      if (this._isListening) {
+        this.stopListening()
+        this.startListening()
       }
     })
     opt.event.udapp.register('transactionExecuted', (error, to, data, lookupOnly, txResult) => {
       if (error) return
-      if (this.loopId && executionContext.isVM()) {
-        executionContext.web3().eth.getTransaction(txResult.transactionHash, (error, tx) => {
-          if (error) return console.log(error)
-          this._newBlock({
-            type: 'VM',
-            number: -1,
-            transactions: [tx]
-          })
+      // we go for that case if
+      // in VM mode
+      // in web3 mode && listen remix txs only
+      if (!this._isListening) return // we don't listen
+      if (this._loopId) return // we seems to already listen on the network
+      executionContext.web3().eth.getTransaction(txResult.transactionHash, (error, tx) => {
+        if (error) return console.log(error)
+        this._resolve([tx], () => {
         })
-      }
+      })
     })
   }
 
   /**
+    * define if txlistener should listen on the network or if only tx created from remix are managed
+    *
+    * @param {Bool} type - true if listen on the network
+    */
+  setListenOnNetwork (listenOnNetwork) {
+    this._listenOnNetwork = listenOnNetwork
+    if (this._loopId) {
+      clearInterval(this._loopId)
+    }
+    if (this._listenOnNetwork) {
+      this._startListenOnNetwork()
+    }
+  }
+
+  /**
     * reset recorded transactions
     */
   init () {
@@ -56,53 +75,56 @@ class TxListener {
     * @param {Object} obj  - provider
     */
   startListening () {
-    this.stopListening()
     this.init()
-    if (executionContext.getProvider() === 'vm') {
-      this.loopId = 'vm-listener'
-    } else {
-      this.loopId = setInterval(() => {
-        var currentLoopId = this.loopId
-        executionContext.web3().eth.getBlockNumber((error, blockNumber) => {
-          if (this.loopId === null || this.loopId === 'vm-listener') return
-          if (error) return console.log(error)
-          if (currentLoopId === this.loopId && (!this.lastBlock || blockNumber > this.lastBlock)) {
-            if (!this.lastBlock) this.lastBlock = blockNumber - 1
-            var current = this.lastBlock + 1
-            this.lastBlock = blockNumber
-            while (blockNumber >= current) {
-              try {
-                this._manageBlock(current)
-              } catch (e) {
-                console.log(e)
-              }
-              current++
-            }
-          }
-        })
-      }, 2000)
+    this._isListening = true
+    if (this._listenOnNetwork) {
+      this._startListenOnNetwork()
     }
   }
 
-  _manageBlock (blockNumber) {
-    executionContext.web3().eth.getBlock(blockNumber, true, (error, result) => {
-      if (!error) {
-        this._newBlock(Object.assign({type: 'web3'}, result))
-      }
-    })
-  }
-
-  /**
+   /**
     * stop listening for incoming transactions. do not reset the recorded pool.
     *
     * @param {String} type - type/name of the provider to add
     * @param {Object} obj  - provider
     */
   stopListening () {
-    if (this.loopId) {
-      clearInterval(this.loopId)
+    if (this._loopId) {
+      clearInterval(this._loopId)
     }
-    this.loopId = null
+    this._loopId = null
+    this._isListening = false
+  }
+
+  _startListenOnNetwork () {
+    this._loopId = setInterval(() => {
+      var currentLoopId = this._loopId
+      executionContext.web3().eth.getBlockNumber((error, blockNumber) => {
+        if (this._loopId === null) return
+        if (error) return console.log(error)
+        if (currentLoopId === this._loopId && (!this.lastBlock || blockNumber > this.lastBlock)) {
+          if (!this.lastBlock) this.lastBlock = blockNumber - 1
+          var current = this.lastBlock + 1
+          this.lastBlock = blockNumber
+          while (blockNumber >= current) {
+            try {
+              this._manageBlock(current)
+            } catch (e) {
+              console.log(e)
+            }
+            current++
+          }
+        }
+      })
+    }, 2000)
+  }
+
+  _manageBlock (blockNumber) {
+    executionContext.web3().eth.getBlock(blockNumber, true, (error, result) => {
+      if (!error) {
+        this._newBlock(Object.assign({type: 'web3'}, result))
+      }
+    })
   }
 
   /**
@@ -127,13 +149,13 @@ class TxListener {
 
   _newBlock (block) {
     this.blocks.push(block)
-    this._resolve(block, () => {
+    this._resolve(block.transactions, () => {
       this.event.trigger('newBlock', [block])
     })
   }
 
-  _resolve (block, callback) {
-    async.each(block.transactions, (tx, cb) => {
+  _resolve (transactions, callback) {
+    async.each(transactions, (tx, cb) => {
       this._resolveTx(tx, (error, resolvedData) => {
         if (error) cb(error)
         if (resolvedData) this.event.trigger('txResolved', [tx, resolvedData])

src/app/panels/editor-panel.js

@@ -168,6 +168,11 @@ class EditorPanel {
       })
     }
     self._components.terminal.event.register('resize', delta => self._adjustLayout('top', delta))
+    if (self._api.txListener) {
+      self._components.terminal.event.register('listenOnNetWork', (listenOnNetWork) => {
+        self._api.txListener.setListenOnNetwork(listenOnNetWork)
+      })
+    }
   }
   _adjustLayout (direction, delta) {
     var limitUp = 36

src/app/panels/terminal.js

@@ -17,7 +17,6 @@ var css = csjs`
     display           : flex;
     flex-direction    : column;
     font-size         : 12px;
-    font-family       : monospace;
     color             : #777;
     background-color  : #ededed;
     height            : 100%;
@@ -215,10 +214,15 @@ class Terminal {
           </div>
           ${self._view.dropdown}
           <input type="text" class=${css.filter} onkeyup=${filter}></div>
+          <input onchange=${listenOnNetwork} type="checkbox" /><label title="If checked Remix will listen on all transactions mined in the current environment and not only transactions created from the GUI">Listen on network</label>
           ${self._view.icon}
         </div>
       </div>
     `
+    function listenOnNetwork (ev) {
+      self.event.trigger('listenOnNetWork', [ev.currentTarget.checked])
+    }
+
     self._view.term = yo`
       <div class=${css.terminal} onscroll=${throttle(reattach, 10)} onclick=${focusinput}>
         ${self._view.journal}