unload trace

src/CalldataPanel.js

@@ -23,11 +23,12 @@ CalldataPanel.prototype.init = function () {
 
     self.traceManager.getCallDataAt(index, function (error, calldata) {
       if (error) {
+        self.basicPanel.data = ''
         console.log(error)
       } else if (self.parent.currentStepIndex === index) {
         self.basicPanel.data = self.format(calldata)
-        self.basicPanel.update()
       }
+      self.basicPanel.update()
     })
   })
 }

src/CallstackPanel.js

@@ -24,10 +24,11 @@ CallstackPanel.prototype.init = function () {
     self.traceManager.getCallStackAt(index, function (error, callstack) {
       if (error) {
         console.log(error)
+        self.basicPanel.data = ''
       } else if (self.parent.currentStepIndex === index) {
         self.basicPanel.data = self.format(callstack)
-        self.basicPanel.update()
       }
+      self.basicPanel.update()
     })
   })
 }

src/Ethdebugger.js

@@ -24,6 +24,9 @@ function Ethdebugger (_context) {
   this.txBrowser.register('newTxRequested', this, function (blockNumber, txIndex, tx) {
     self.startDebugging(blockNumber, txIndex, tx)
   })
+  this.txBrowser.register('unloadRequested', this, function (blockNumber, txIndex, tx) {
+    self.unLoad()
+  })
   this.stepManager = new StepManager(this, this.traceManager)
   this.stepManager.register('stepChanged', this, function (stepIndex) {
     self.stepChanged(stepIndex)
@@ -36,7 +39,6 @@ Ethdebugger.prototype.render = function () {
   return (
   yo`<div style=${ui.formatCss(style.font)}>
         <h1 style=${ui.formatCss(style.container)}>Eth Debugger</h1>
-        <div onclick=${function () { self.unLoad() }}>X</div>
         ${this.txBrowser.render()}
         ${this.stepManager.render()}
         ${this.vmDebugger.render()}

src/MemoryPanel.js

@@ -25,10 +25,11 @@ MemoryPanel.prototype.init = function () {
     self.traceManager.getMemoryAt(index, function (error, memory) {
       if (error) {
         console.log(error)
+        self.basicPanel.data = ''
       } else if (self.parent.currentStepIndex === index) {
         self.basicPanel.data = util.formatMemory(memory, 16)
-        self.basicPanel.update()
       }
+      self.basicPanel.update()
     })
   })
 }

src/Slider.js

@@ -23,6 +23,7 @@ Slider.prototype.render = function () {
           type='range'
           min=0
           max=${this.max}
+          value=0
           onmouseup=${function () { self.onMouseUp() }}
           disabled=${this.disabled} />
       </div>`

src/StackPanel.js

@@ -23,11 +23,12 @@ StackPanel.prototype.init = function () {
 
     self.traceManager.getStackAt(index, function (error, stack) {
       if (error) {
+        self.basicPanel.data = ''
         console.log(error)
       } else if (self.parent.currentStepIndex === index) {
         self.basicPanel.data = self.format(stack)
-        self.basicPanel.update()
       }
+      self.basicPanel.update()
     })
   })
 }

src/Sticker.js

@@ -78,37 +78,41 @@ Sticker.prototype.init = function () {
     self.traceManager.getCurrentStep(index, function (error, step) {
       if (error) {
         console.log(error)
+        self.step = ''
       } else {
         self.step = step
-        yo.update(self.view, self.render())
       }
+      yo.update(self.view, self.render())
     })
 
     self.traceManager.getMemExpand(index, function (error, addmem) {
       if (error) {
         console.log(error)
+        self.addmemory = ''
       } else {
         self.addmemory = addmem
-        yo.update(self.view, self.render())
       }
+      yo.update(self.view, self.render())
     })
 
     self.traceManager.getStepCost(index, function (error, gas) {
       if (error) {
         console.log(error)
+        self.gas = gas
       } else {
         self.gas = gas
-        yo.update(self.view, self.render())
       }
+      yo.update(self.view, self.render())
     })
 
     self.traceManager.getRemainingGas(index, function (error, remaingas) {
       if (error) {
         console.log(error)
+        self.remainingGas = ''
       } else {
         self.remainingGas = remaingas
-        yo.update(self.view, self.render())
       }
+      yo.update(self.view, self.render())
     })
   })
 }

src/StoragePanel.js

@@ -24,10 +24,11 @@ StoragePanel.prototype.init = function () {
     self.traceManager.getStorageAt(index, self.parent.tx, function (error, storage) {
       if (error) {
         console.log(error)
+        self.basicPanel.data = self.formatStorage(storage)  
       } else if (self.parent.currentStepIndex === index) {
         self.basicPanel.data = self.formatStorage(storage)
-        self.basicPanel.update()
       }
+      self.basicPanel.update()
     })
   })
 }

src/TxBrowser.js

@@ -78,6 +78,7 @@ TxBrowser.prototype.render = function () {
         <button onclick=${function () { self.submit() }}>
           Get
         </button>
+        <button onclick=${function () { self.trigger('unloadRequested') }}>Unload</button>
         <div style=${ui.formatCss(style.transactionInfo)}>
           <table>
             <tbody>