add new storage panel

src/app/debugger/debuggerUI/VmDebugger.js

@@ -5,7 +5,7 @@ var CalldataPanel = require('./vmDebugger/CalldataPanel')
 var MemoryPanel = require('./vmDebugger/MemoryPanel')
 var CallstackPanel = require('./vmDebugger/CallstackPanel')
 var StackPanel = require('./vmDebugger/StackPanel')
-var StoragePanel = require('../remix-debugger/src/ui/StoragePanel')
+var StoragePanel = require('./vmDebugger/StoragePanel')
 var FullStoragesChangesPanel = require('../remix-debugger/src/ui/FullStoragesChanges')
 var StepDetail = require('../remix-debugger/src/ui/StepDetail')
 var DropdownPanel = require('../remix-debugger/src/ui/DropdownPanel')
@@ -85,7 +85,7 @@ function VmDebugger (_parentUI, _traceManager, _codeManager, _solidityProxy, _ca
     })
   })
 
-  this.stackPanel = new StackPanel(_parentUI, _traceManager)
+  this.stackPanel = new StackPanel()
   _parentUI.event.register('indexChanged', this, function (index) {
     if (index < 0) return
     if (_parentUI.currentStepIndex !== index) return
@@ -101,6 +101,8 @@ function VmDebugger (_parentUI, _traceManager, _codeManager, _solidityProxy, _ca
   })
 
   this.storagePanel = new StoragePanel(_parentUI, _traceManager)
+
+
   this.stepDetail = new StepDetail(_parentUI, _traceManager)
   this.solidityState = new SolidityState(_parentUI, _traceManager, _codeManager, _solidityProxy)
   this.solidityLocals = new SolidityLocals(_parentUI, _traceManager, _callTree)

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

+'use strict'
+var DropdownPanel = require('./DropdownPanel')
+var remixDebug = require('remix-debug')
+var StorageViewer = remixDebug.storage.StorageViewer
+var yo = require('yo-yo')
+
+function StoragePanel (_parent, _traceManager) {
+  this.parent = _parent
+  this.storageResolver = null
+  this.traceManager = _traceManager
+  this.basicPanel = new DropdownPanel('Storage', {json: true})
+  this.init()
+  this.disabled = false
+}
+
+StoragePanel.prototype.render = function () {
+  return yo`<div id='storagepanel' >${this.basicPanel.render()}</div>`
+}
+
+StoragePanel.prototype.init = function () {
+  var self = this
+  this.parent.event.register('indexChanged', this, function (index) {
+    if (self.disabled) return
+    if (index < 0) return
+    if (self.parent.currentStepIndex !== index) return
+    if (!self.storageResolver) return
+
+    this.traceManager.getCurrentCalledAddressAt(index, (error, address) => {
+      if (!error) {
+        var storageViewer = new StorageViewer({
+          stepIndex: self.parent.currentStepIndex,
+          tx: self.parent.tx,
+          address: address
+        }, self.storageResolver, self.traceManager)
+
+        storageViewer.storageRange((error, storage) => {
+          if (error) {
+            console.log(error)
+            self.basicPanel.update({})
+          } else if (self.parent.currentStepIndex === index) {
+            var header = storageViewer.isComplete(address) ? 'completely loaded' : 'partially loaded...'
+            self.basicPanel.update(storage, header)
+          }
+        })
+      }
+    })
+  })
+}
+
+module.exports = StoragePanel