Solidity state dropdownpanel (#145)

* decode struct + fix uint decoding

* decode array

* add solidity state dropdownpanel

* fix misc

* fix misc

src/code/codeManager.js

@@ -18,6 +18,14 @@ function CodeManager (_traceManager) {
   this.codeResolver = codeResolver
 }
 
+/**
+ * clear the cache
+ *
+ */
+CodeManager.prototype.clear = function () {
+  this.codeResolver.clear()
+}
+
 /**
  * resolve the code of the given @arg stepIndex and trigger appropriate event
  *

src/code/codeResolver.js

@@ -7,6 +7,12 @@ module.exports = {
   instructionsByAddress: {}, // assembly items instructions list by contract addesses
   instructionsIndexByBytesOffset: {}, // mapping between bytes offset and instructions index.
 
+  clear: function () {
+    this.bytecodeByAddress = {}
+    this.instructionsByAddress = {}
+    this.instructionsIndexByBytesOffset = {}
+  },
+
   resolveCode: function (address, callBack) {
     var cache = this.getExecutingCodeFromCache(address)
     if (cache) {

src/ui/Ethdebugger.js

@@ -18,6 +18,8 @@ function Ethdebugger () {
 
   this.currentStepIndex = -1
   this.tx
+  this.sources
+  this.contractsDetail
   this.statusMessage = ''
 
   this.view
@@ -71,6 +73,16 @@ Ethdebugger.prototype.switchProvider = function (type) {
   })
 }
 
+Ethdebugger.prototype.setCompilationResult = function (compilationResult) {
+  if (compilationResult && compilationResult.sources && compilationResult.contracts) {
+    this.sources = compilationResult.sources
+    this.contractsDetail = compilationResult.contracts
+  } else {
+    this.sources = null
+    this.contractsDetail = null
+  }
+}
+
 Ethdebugger.prototype.debug = function (tx) {
   if (tx instanceof Object) {
     this.txBrowser.load(tx.hash)
@@ -96,6 +108,7 @@ Ethdebugger.prototype.render = function () {
 
 Ethdebugger.prototype.unLoad = function () {
   this.traceManager.init()
+  this.codeManager.clear()
   this.stepManager.reset()
   this.event.trigger('traceUnloaded')
 }

src/ui/SolidityState.js

@@ -0,0 +1,71 @@
+'use strict'
+var DropdownPanel = require('./DropdownPanel')
+var traceHelper = require('../helpers/traceHelper')
+var stateDecoder = require('../solidity/stateDecoder')
+var yo = require('yo-yo')
+
+function SolidityState (_parent, _traceManager, _codeManager) {
+  this.parent = _parent
+  this.traceManager = _traceManager
+  this.codeManager = _codeManager
+  this.basicPanel = new DropdownPanel('Solidity State')
+  this.init()
+}
+
+SolidityState.prototype.render = function () {
+  return yo`<div id='soliditystate' >${this.basicPanel.render()}</div>`
+}
+
+SolidityState.prototype.init = function () {
+  var self = this
+  this.parent.event.register('indexChanged', this, function (index) {
+    if (index < 0) {
+      self.basicPanel.update({info: 'invalid step index'})
+      return
+    }
+    if (self.parent.currentStepIndex !== index) return
+    if (!this.parent.contractsDetail || !this.parent.sources) {
+      self.basicPanel.update({info: 'no source has been specified'})
+      return
+    }
+
+    self.traceManager.getStorageAt(index, null, function (error, storage) {
+      if (error) {
+        self.basicPanel.update({ info: error })
+      } else {
+        self.traceManager.getCurrentCalledAddressAt(index, function (error, address) {
+          if (error) {
+            self.basicPanel.update({ info: error })
+          } else {
+            self.codeManager.getCode(address, function (error, code) {
+              if (error) {
+                self.basicPanel.update({ info: error })
+              } else {
+                var contractName = contractNameFromCode(self.parent.contractsDetail, code.bytecode, address)
+                if (contractName === null) {
+                  self.basicPanel.update({ info: 'could not find compiled contract with address ' + address })
+                } else {
+                  var state = stateDecoder.solidityState(storage, self.parent.sources, contractName)
+                  self.basicPanel.update(state)
+                }
+              }
+            })
+          }
+        })
+      }
+    })
+  })
+}
+
+function contractNameFromCode (contracts, code, address) {
+  var isCreation = traceHelper.isContractCreation(address)
+  var byteProp = isCreation ? 'bytecode' : 'runtimeBytecode'
+  for (var k in contracts) {
+    if ('0x' + contracts[k][byteProp] === code) {
+      return k
+    }
+  }
+  return null
+}
+
+module.exports = SolidityState

src/ui/VmDebugger.js

@@ -8,6 +8,7 @@ var StoragePanel = require('./StoragePanel')
 var FullStoragesChangesPanel = require('./FullStoragesChanges')
 var StepDetail = require('./StepDetail')
 var DropdownPanel = require('./DropdownPanel')
+var SolidityState = require('./SolidityState')
 var yo = require('yo-yo')
 
 function VmDebugger (_parent, _traceManager, _codeManager) {
@@ -18,6 +19,7 @@ function VmDebugger (_parent, _traceManager, _codeManager) {
   this.calldataPanel = new CalldataPanel(_parent, _traceManager)
   this.callstackPanel = new CallstackPanel(_parent, _traceManager)
   this.stepDetail = new StepDetail(_parent, _traceManager)
+  this.solidityState = new SolidityState(_parent, _traceManager, _codeManager)
 
   /* Return values - */
   this.returnValuesPanel = new DropdownPanel('Return Value')
@@ -51,6 +53,7 @@ VmDebugger.prototype.render = function () {
   var view = yo`<div id='vmdebugger' style='display:none'>
         <div>
             ${this.asmCode.render()}
+            ${this.solidityState.render()}
             ${this.stepDetail.render()}
             ${this.stackPanel.render()}
             ${this.storagePanel.render()}