diff --git a/src/app/debugger/debuggerUI.js b/src/app/debugger/debuggerUI.js index a2524910b2..2c9a39f430 100644 --- a/src/app/debugger/debuggerUI.js +++ b/src/app/debugger/debuggerUI.js @@ -4,6 +4,7 @@ var SourceHighlighter = require('../editor/sourceHighlighter') var TxBrowser = require('./debuggerUI/TxBrowser') var StepManagerUI = require('./debuggerUI/StepManager') var StepManager = require('./stepManager') +var VmDebugger = require('./debuggerUI/VmDebugger') var remixLib = require('remix-lib') var executionContext = remixLib.execution.executionContext var traceHelper = remixLib.helpers.trace @@ -113,7 +114,9 @@ class DebuggerUI { this.debugger_ui.stepManager = this.stepManager - this.debugger_ui.createAndAddVmDebugger() + this.debugger_ui.vmDebugger = new VmDebugger(this.debugger_ui, this.transactionDebugger.debugger.traceManager, this.transactionDebugger.debugger.codeManager, this.transactionDebugger.debugger.solidityProxy, this.transactionDebugger.debugger.callTree) + this.debugger_ui.andAddVmDebugger() + this.transactionDebugger.debugger.debug(tx) } diff --git a/src/app/debugger/debuggerUI/VmDebugger.js b/src/app/debugger/debuggerUI/VmDebugger.js new file mode 100644 index 0000000000..95050e48ef --- /dev/null +++ b/src/app/debugger/debuggerUI/VmDebugger.js @@ -0,0 +1,126 @@ +'use strict' +var csjs = require('csjs-inject') +var CodeListView = require('../remix-debugger/src/ui/CodeListView') +var CalldataPanel = require('../remix-debugger/src/ui/CalldataPanel') +var MemoryPanel = require('../remix-debugger/src/ui/MemoryPanel') +var CallstackPanel = require('../remix-debugger/src/ui/CallstackPanel') +var StackPanel = require('../remix-debugger/src/ui/StackPanel') +var StoragePanel = require('../remix-debugger/src/ui/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') +var SolidityState = require('../remix-debugger/src/ui/SolidityState') +var SolidityLocals = require('../remix-debugger/src/ui/SolidityLocals') +var remixDebug = require('remix-debug') +var StorageResolver = remixDebug.storage.StorageResolver +var yo = require('yo-yo') + +var css = csjs` + .asmCode { + float: left; + width: 50%; + } + .stepDetail { + } + .vmheadView { + margin-top:10px; + } +` + +function VmDebugger (_parentUI, _traceManager, _codeManager, _solidityProxy, _callTree) { + let _parent = _parentUI.debugger + var self = this + this.view + this.asmCode = new CodeListView(_parent, _codeManager) + this.stackPanel = new StackPanel(_parentUI, _traceManager) + this.storagePanel = new StoragePanel(_parentUI, _traceManager) + this.memoryPanel = new MemoryPanel(_parentUI, _traceManager) + this.calldataPanel = new CalldataPanel(_parentUI, _traceManager) + this.callstackPanel = new CallstackPanel(_parentUI, _traceManager) + this.stepDetail = new StepDetail(_parentUI, _traceManager) + this.solidityState = new SolidityState(_parentUI, _traceManager, _codeManager, _solidityProxy) + this.solidityLocals = new SolidityLocals(_parentUI, _traceManager, _callTree) + + /* Return values - */ + this.returnValuesPanel = new DropdownPanel('Return Value', {json: true}) + this.returnValuesPanel.data = {} + _parentUI.event.register('indexChanged', this.returnValuesPanel, function (index) { + if (!self.view) return + var innerself = this + _traceManager.getReturnValue(index, function (error, returnValue) { + if (error) { + innerself.update([error]) + } else if (_parentUI.currentStepIndex === index) { + innerself.update([returnValue]) + } + }) + }) + /* Return values - */ + + this.fullStoragesChangesPanel = new FullStoragesChangesPanel(_parentUI, _traceManager) + + _parent.event.register('newTraceLoaded', this, function () { + if (!self.view) return + var storageResolver = new StorageResolver({web3: _parent.web3}) + self.storagePanel.storageResolver = storageResolver + self.solidityState.storageResolver = storageResolver + self.solidityLocals.storageResolver = storageResolver + self.fullStoragesChangesPanel.storageResolver = storageResolver + self.asmCode.basicPanel.show() + self.stackPanel.basicPanel.show() + self.storagePanel.basicPanel.show() + self.memoryPanel.basicPanel.show() + self.calldataPanel.basicPanel.show() + self.callstackPanel.basicPanel.show() + }) + _parent.event.register('traceUnloaded', this, function () { + if (!self.view) return + }) + _parent.callTree.event.register('callTreeReady', () => { + if (!self.view) return + if (_parent.callTree.reducedTrace.length) { + self.solidityLocals.basicPanel.show() + self.solidityState.basicPanel.show() + } + }) +} + +VmDebugger.prototype.renderHead = function () { + var headView = yo`
+
+
${this.asmCode.render()}
+
${this.stepDetail.render()}
+
+
` + if (!this.headView) { + this.headView = headView + } + return headView +} + +VmDebugger.prototype.remove = function () { + // used to stop listenning on event. bad and should be "refactored" + this.view = null +} + +VmDebugger.prototype.render = function () { + var view = yo`
+
+ ${this.solidityLocals.render()} + ${this.solidityState.render()} + ${this.stackPanel.render()} + ${this.memoryPanel.render()} + ${this.storagePanel.render()} + ${this.callstackPanel.render()} + ${this.calldataPanel.render()} + ${this.returnValuesPanel.render()} + ${this.fullStoragesChangesPanel.render()} +
+
` + if (!this.view) { + this.view = view + } + return view +} + +module.exports = VmDebugger diff --git a/src/app/debugger/remix-debugger/src/ui/EthdebuggerUI.js b/src/app/debugger/remix-debugger/src/ui/EthdebuggerUI.js index af50bcb465..5d4b7b5ad6 100644 --- a/src/app/debugger/remix-debugger/src/ui/EthdebuggerUI.js +++ b/src/app/debugger/remix-debugger/src/ui/EthdebuggerUI.js @@ -1,7 +1,7 @@ 'use strict' // var TxBrowser = require('./TxBrowser') // var StepManager = require('./StepManager') -var VmDebugger = require('./VmDebugger') +// var VmDebugger = require('./VmDebugger') var yo = require('yo-yo') var csjs = require('csjs-inject') @@ -103,8 +103,7 @@ EthdebuggerUI.prototype.startDebugging = function (blockNumber, txIndex, tx) { return true } -EthdebuggerUI.prototype.createAndAddVmDebugger = function () { - this.vmDebugger = new VmDebugger(this, this.debugger.traceManager, this.debugger.codeManager, this.debugger.solidityProxy, this.debugger.callTree) +EthdebuggerUI.prototype.andAddVmDebugger = function () { yo.update(this.debuggerHeadPanelsView, this.vmDebugger.renderHead()) yo.update(this.debuggerPanelsView, this.vmDebugger.render()) yo.update(this.stepManagerView, this.stepManager.render())