move solidity state logic into its own class

src/app/debugger/debuggerUI/VmDebugger.js

@@ -161,6 +161,9 @@ function VmDebugger (_parentUI, _traceManager, _codeManager, _solidityProxy, _ca
     })
   })
 
+  console.dir('solidity proxy is')
+  console.dir(_solidityProxy)
+
   this.solidityState = new SolidityState(_parentUI, _traceManager, _codeManager, _solidityProxy)
   this.solidityLocals = new SolidityLocals(_parentUI, _traceManager, _callTree)
 
@@ -185,7 +188,8 @@ function VmDebugger (_parentUI, _traceManager, _codeManager, _solidityProxy, _ca
   _parent.event.register('newTraceLoaded', this, function () {
     if (!self.view) return
     self.storageResolver = new StorageResolver({web3: _parent.web3})
-    self.solidityState.storageResolver = self.storageResolver
+    // self.solidityState.storageResolver = self.storageResolver
+    self.solidityState.debuggerSolidityState.storageResolver = self.storageResolver
     self.solidityLocals.storageResolver = self.storageResolver
     self.fullStoragesChangesPanel.storageResolver = self.storageResolver
     self.asmCode.basicPanel.show()

src/app/debugger/debuggerUI/vmDebugger/SolidityState.js

@@ -4,47 +4,36 @@ var stateDecoder = remixDebug.SolidityDecoder.stateDecoder
 var solidityTypeFormatter = require('./utils/SolidityTypeFormatter')
 var StorageViewer = remixDebug.storage.StorageViewer
 var yo = require('yo-yo')
+var remixLib = require('remix-lib')
+var EventManager = remixLib.EventManager
 
-function SolidityState (_parent, _traceManager, _codeManager, _solidityProxy) {
+class DebuggerSolidityState {
+
+  constructor (_parent, _traceManager, _codeManager, _solidityProxy) {
+    this.event = new EventManager()
     this.storageResolver = null
     this.parent = _parent
     this.traceManager = _traceManager
     this.codeManager = _codeManager
     this.solidityProxy = _solidityProxy
-  this.basicPanel = new DropdownPanel('Solidity State', {
-    json: true,
-    // TODO: used by TreeView ui
-    formatSelf: solidityTypeFormatter.formatSelf,
-    extractData: solidityTypeFormatter.extractData
-  })
-  this.init()
-  this.view
     this.stateVariablesByAddresses = {}
     _parent.event.register('traceUnloaded', () => { this.stateVariablesByAddresses = {} })
     _parent.event.register('newTraceLoaded', () => { this.stateVariablesByAddresses = {} })
-}
+  }
-
-SolidityState.prototype.render = function () {
-  if (this.view) return
-  this.view = yo`<div id='soliditystate' >
-      ${this.basicPanel.render()}
-    </div>`
-  return this.view
-}
 
-SolidityState.prototype.init = function () {
+  init () {
     var self = this
     var decodeTimeout = null
     this.parent.event.register('indexChanged', this, function (index) {
       if (index < 0) {
-      self.basicPanel.setMessage('invalid step index')
+        self.setMessage('invalid step index')
         return
       }
 
       if (self.parent.currentStepIndex !== index) return
       if (!self.solidityProxy.loaded()) {
-      self.basicPanel.setMessage('no source has been specified')
+        // return self.setMessage('no source has been specified')
-      return
+        return self.event.trigger('solidityStateMessage', ['invalid step index'])
       }
 
       if (!self.storageResolver) {
@@ -53,40 +42,100 @@ SolidityState.prototype.init = function () {
       if (decodeTimeout) {
         window.clearTimeout(decodeTimeout)
       }
-    self.basicPanel.setUpdating()
+      // self.setUpdating()
-    decodeTimeout = setTimeout(() => {
+      self.event.trigger('solidityStateUpdating')
-      decode(self, index)
+      decodeTimeout = setTimeout(function () {
+        //self.decode.apply(self, index)
+        self.decode(index)
       }, 500)
     })
-}
+  }
 
-function decode (self, index) {
+  decode (index) {
-  self.traceManager.getCurrentCalledAddressAt(self.parent.currentStepIndex, (error, address) => {
+    const self = this
+    self.traceManager.getCurrentCalledAddressAt(self.parent.currentStepIndex, function (error, address) {
       if (error) {
-      return self.basicPanel.update({})
+        // return self.update({})
+        return self.event.trigger('solidityState', [{}])
       }
       if (self.stateVariablesByAddresses[address]) {
-      return extractStateVariables(self, self.stateVariablesByAddresses[address], address)
+        return self.extractStateVariables(self.stateVariablesByAddresses[address], address)
       }
       self.solidityProxy.extractStateVariablesAt(index, function (error, stateVars) {
         if (error) {
-        return self.basicPanel.update({})
+          // return self.update({})
+          return self.event.trigger('solidityState', [{}])
         }
         self.stateVariablesByAddresses[address] = stateVars
-      extractStateVariables(self, stateVars, address)
+        self.extractStateVariables(stateVars, address)
       })
     })
-}
+  }
 
-function extractStateVariables (self, stateVars, address) {
+  extractStateVariables (stateVars, address) {
+    const self = this
     var storageViewer = new StorageViewer({ stepIndex: self.parent.currentStepIndex, tx: self.parent.tx, address: address }, self.storageResolver, self.traceManager)
     stateDecoder.decodeState(stateVars, storageViewer).then((result) => {
-    self.basicPanel.setMessage('')
+      // self.setMessage('')
+      self.event.trigger('solidityStateMessage', [''])
       if (result.error) {
-      return self.basicPanel.setMessage(result.error)
+        // return self.setMessage(result.error)
+        return self.event.trigger('solidityStateMessage', [result.error])
       }
-    self.basicPanel.update(result)
+      // self.update(result)
+      self.event.trigger('solidityState', [result])
     })
+  }
+
+}
+
+function SolidityState (_parent, _traceManager, _codeManager, _solidityProxy) {
+  const self = this
+  this.basicPanel = new DropdownPanel('Solidity State', {
+    json: true,
+    // TODO: used by TreeView ui
+    formatSelf: solidityTypeFormatter.formatSelf,
+    extractData: solidityTypeFormatter.extractData
+  })
+
+  this.debuggerSolidityState = new DebuggerSolidityState(_parent, _traceManager, _codeManager, _solidityProxy)
+  this.debuggerSolidityState.init()
+  this.debuggerSolidityState.event.register('solidityState', this, function (state) {
+    self.update(state)
+  })
+  this.debuggerSolidityState.event.register('solidityStateMessage', this, function (message) {
+    self.setMessage(message)
+  })
+  this.debuggerSolidityState.event.register('solidityStateUpdating', this, function () {
+    self.setUpdating()
+  })
+  this.storageResolver = this.debuggerSolidityState.storageResolver
+  this.parent = this.debuggerSolidityState.parent
+  this.traceManager = this.debuggerSolidityState.traceManager
+  this.codeManager = this.debuggerSolidityState.codeManager
+  this.solidityProxy = this.debuggerSolidityState.solidityProxy
+
+  this.view
+}
+
+SolidityState.prototype.update = function (data) {
+  this.basicPanel.update(data)
+}
+
+SolidityState.prototype.setMessage = function (message) {
+  this.basicPanel.setMessage(message)
+}
+
+SolidityState.prototype.setUpdating = function () {
+  this.basicPanel.setUpdating()
+}
+
+SolidityState.prototype.render = function () {
+  if (this.view) return
+  this.view = yo`<div id='soliditystate' >
+      ${this.basicPanel.render()}
+    </div>`
+  return this.view
 }
 
 module.exports = SolidityState