Merge ui-helper and renderer

pull/1/head
Alex Beregszaszi 8 years ago
parent eff373851e
commit 55246bcb85
  1. 176
      src/app/renderer.js
  2. 172
      src/app/ui-helper.js

@ -3,7 +3,6 @@
var $ = require('jquery') var $ = require('jquery')
var utils = require('./utils') var utils = require('./utils')
var uiHelper = require('./ui-helper')
function Renderer (editor, updateFiles, udapp, executionContext, formalVerificationEvent, compilerEvent) { function Renderer (editor, updateFiles, udapp, executionContext, formalVerificationEvent, compilerEvent) {
this.editor = editor this.editor = editor
@ -98,26 +97,191 @@ Renderer.prototype.contracts = function (data, source) {
} }
} }
var tableRowItems = function (first, second, cls) {
return $('<div class="crow"/>')
.addClass(cls)
.append($('<div class="col1">').append(first))
.append($('<div class="col2">').append(second))
}
var tableRow = function (description, data) {
return tableRowItems(
$('<span/>').text(description),
$('<input readonly="readonly"/>').val(data))
}
var preRow = function (description, data) {
return tableRowItems(
$('<span/>').text(description),
$('<pre/>').text(data)
)
}
var formatAssemblyText = function (asm, prefix, source) {
if (typeof asm === typeof '' || asm === null || asm === undefined) {
return prefix + asm + '\n'
}
var text = prefix + '.code\n'
$.each(asm['.code'], function (i, item) {
var v = item.value === undefined ? '' : item.value
var src = ''
if (item.begin !== undefined && item.end !== undefined) {
src = source.slice(item.begin, item.end).replace('\n', '\\n', 'g')
}
if (src.length > 30) {
src = src.slice(0, 30) + '...'
}
if (item.name !== 'tag') {
text += ' '
}
text += prefix + item.name + ' ' + v + '\t\t\t' + src + '\n'
})
text += prefix + '.data\n'
if (asm['.data']) {
$.each(asm['.data'], function (i, item) {
text += ' ' + prefix + '' + i + ':\n'
text += formatAssemblyText(item, prefix + ' ', source)
})
}
return text
}
var getConstructorInterface = function (abi) {
var funABI = { 'name': '', 'inputs': [], 'type': 'constructor', 'outputs': [] }
for (var i = 0; i < abi.length; i++) {
if (abi[i].type === 'constructor') {
funABI.inputs = abi[i].inputs || []
break
}
}
return funABI
}
var gethDeploy = function (contractName, jsonInterface, bytecode) {
var code = ''
var funABI = getConstructorInterface(JSON.parse(jsonInterface))
funABI.inputs.forEach(function (inp) {
code += 'var ' + inp.name + ' = /* var of type ' + inp.type + ' here */ ;\n'
})
code += 'var ' + contractName + 'Contract = web3.eth.contract(' + jsonInterface.replace('\n', '') + ');' +
'\nvar ' + contractName + ' = ' + contractName + 'Contract.new('
funABI.inputs.forEach(function (inp) {
code += '\n ' + inp.name + ','
})
code += '\n {' +
'\n from: web3.eth.accounts[0], ' +
"\n data: '0x" + bytecode + "', " +
"\n gas: '4700000'" +
'\n }, function (e, contract){' +
'\n console.log(e, contract);' +
"\n if (typeof contract.address !== 'undefined') {" +
"\n console.log('Contract mined! address: ' + contract.address + ' transactionHash: ' + contract.transactionHash);" +
'\n }' +
'\n })'
return code
}
var formatGasEstimates = function (data) {
// FIXME: the whole gasEstimates object should be nil instead
if (data.creation === undefined && data.external === undefined && data.internal === undefined) {
return
}
var gasToText = function (g) {
return g === null ? 'unknown' : g
}
var text = ''
var fun
if ('creation' in data) {
text += 'Creation: ' + gasToText(data.creation[0]) + ' + ' + gasToText(data.creation[1]) + '\n'
}
if ('external' in data) {
text += 'External:\n'
for (fun in data.external) {
text += ' ' + fun + ': ' + gasToText(data.external[fun]) + '\n'
}
}
if ('internal' in data) {
text += 'Internal:\n'
for (fun in data.internal) {
text += ' ' + fun + ': ' + gasToText(data.internal[fun]) + '\n'
}
}
return text
}
var detailsOpen = {}
var getDetails = function (contract, source, contractName) {
var button = $('<button>Toggle Details</button>')
var details = $('<div style="display: none;"/>')
if (contract.metadata) {
details.append(preRow('Metadata', contract.metadata))
}
var funHashes = ''
for (var fun in contract.functionHashes) {
funHashes += contract.functionHashes[fun] + ' ' + fun + '\n'
}
if (funHashes.length > 0) {
details.append(preRow('Functions', funHashes))
}
var gasEstimates = formatGasEstimates(contract.gasEstimates)
if (gasEstimates) {
details.append(preRow('Gas Estimates', gasEstimates))
}
if (contract.runtimeBytecode && contract.runtimeBytecode.length > 0) {
details.append(tableRow('Runtime Bytecode', contract.runtimeBytecode))
}
if (contract.opcodes !== undefined && contract.opcodes !== '') {
details.append(tableRow('Opcodes', contract.opcodes))
}
if (contract.assembly !== null) {
details.append(preRow('Assembly', formatAssemblyText(contract.assembly, '', source)))
}
button.click(function () {
detailsOpen[contractName] = !detailsOpen[contractName]
details.toggle()
})
if (detailsOpen[contractName]) {
details.show()
}
return $('<div class="contractDetails"/>').append(button).append(details)
}
var renderOutputModifier = function (contractName, $contractOutput) { var renderOutputModifier = function (contractName, $contractOutput) {
var contract = data.contracts[contractName] var contract = data.contracts[contractName]
if (contract.bytecode) { if (contract.bytecode) {
$contractOutput.append(uiHelper.tableRow('Bytecode', contract.bytecode)) $contractOutput.append(tableRow('Bytecode', contract.bytecode))
} }
$contractOutput.append(uiHelper.tableRow('Interface', contract['interface'])) $contractOutput.append(tableRow('Interface', contract['interface']))
if (contract.bytecode) { if (contract.bytecode) {
$contractOutput.append(uiHelper.preRow('Web3 deploy', uiHelper.gethDeploy(contractName.toLowerCase(), contract['interface'], contract.bytecode), 'deploy')) $contractOutput.append(preRow('Web3 deploy', gethDeploy(contractName.toLowerCase(), contract['interface'], contract.bytecode), 'deploy'))
// check if there's a metadata hash appended // check if there's a metadata hash appended
var metadataHash = retrieveMetadataHash(contract.bytecode) var metadataHash = retrieveMetadataHash(contract.bytecode)
if (metadataHash) { if (metadataHash) {
$contractOutput.append(uiHelper.tableRow('Metadata location', 'bzzr://' + metadataHash)) $contractOutput.append(tableRow('Metadata location', 'bzzr://' + metadataHash))
} }
} }
var ctrSource = getSource(contractName, source, data) var ctrSource = getSource(contractName, source, data)
return $contractOutput.append(uiHelper.getDetails(contract, ctrSource, contractName)) return $contractOutput.append(getDetails(contract, ctrSource, contractName))
} }
var self = this var self = this

@ -1,172 +0,0 @@
'use strict'
var $ = require('jquery')
module.exports = {
tableRowItems: function (first, second, cls) {
return $('<div class="crow"/>')
.addClass(cls)
.append($('<div class="col1">').append(first))
.append($('<div class="col2">').append(second))
},
tableRow: function (description, data) {
return this.tableRowItems(
$('<span/>').text(description),
$('<input readonly="readonly"/>').val(data))
},
preRow: function (description, data) {
return this.tableRowItems(
$('<span/>').text(description),
$('<pre/>').text(data)
)
},
formatAssemblyText: function (asm, prefix, source) {
var self = this
if (typeof asm === typeof '' || asm === null || asm === undefined) {
return prefix + asm + '\n'
}
var text = prefix + '.code\n'
$.each(asm['.code'], function (i, item) {
var v = item.value === undefined ? '' : item.value
var src = ''
if (item.begin !== undefined && item.end !== undefined) {
src = source.slice(item.begin, item.end).replace('\n', '\\n', 'g')
}
if (src.length > 30) {
src = src.slice(0, 30) + '...'
}
if (item.name !== 'tag') {
text += ' '
}
text += prefix + item.name + ' ' + v + '\t\t\t' + src + '\n'
})
text += prefix + '.data\n'
if (asm['.data']) {
$.each(asm['.data'], function (i, item) {
text += ' ' + prefix + '' + i + ':\n'
text += self.formatAssemblyText(item, prefix + ' ', source)
})
}
return text
},
gethDeploy: function (contractName, jsonInterface, bytecode) {
var code = ''
var funABI = this.getConstructorInterface(JSON.parse(jsonInterface))
funABI.inputs.forEach(function (inp) {
code += 'var ' + inp.name + ' = /* var of type ' + inp.type + ' here */ ;\n'
})
code += 'var ' + contractName + 'Contract = web3.eth.contract(' + jsonInterface.replace('\n', '') + ');' +
'\nvar ' + contractName + ' = ' + contractName + 'Contract.new('
funABI.inputs.forEach(function (inp) {
code += '\n ' + inp.name + ','
})
code += '\n {' +
'\n from: web3.eth.accounts[0], ' +
"\n data: '0x" + bytecode + "', " +
"\n gas: '4700000'" +
'\n }, function (e, contract){' +
'\n console.log(e, contract);' +
"\n if (typeof contract.address !== 'undefined') {" +
"\n console.log('Contract mined! address: ' + contract.address + ' transactionHash: ' + contract.transactionHash);" +
'\n }' +
'\n })'
return code
},
getConstructorInterface: function (abi) {
var funABI = { 'name': '', 'inputs': [], 'type': 'constructor', 'outputs': [] }
for (var i = 0; i < abi.length; i++) {
if (abi[i].type === 'constructor') {
funABI.inputs = abi[i].inputs || []
break
}
}
return funABI
},
formatGasEstimates: function (data) {
// FIXME: the whole gasEstimates object should be nil instead
if (data.creation === undefined && data.external === undefined && data.internal === undefined) {
return
}
var gasToText = function (g) {
return g === null ? 'unknown' : g
}
var text = ''
var fun
if ('creation' in data) {
text += 'Creation: ' + gasToText(data.creation[0]) + ' + ' + gasToText(data.creation[1]) + '\n'
}
if ('external' in data) {
text += 'External:\n'
for (fun in data.external) {
text += ' ' + fun + ': ' + gasToText(data.external[fun]) + '\n'
}
}
if ('internal' in data) {
text += 'Internal:\n'
for (fun in data.internal) {
text += ' ' + fun + ': ' + gasToText(data.internal[fun]) + '\n'
}
}
return text
},
detailsOpen: {},
getDetails: function (contract, source, contractName) {
var button = $('<button>Toggle Details</button>')
var details = $('<div style="display: none;"/>')
if (contract.metadata) {
details.append(this.preRow('Metadata', contract.metadata))
}
var funHashes = ''
for (var fun in contract.functionHashes) {
funHashes += contract.functionHashes[fun] + ' ' + fun + '\n'
}
if (funHashes.length > 0) {
details.append(this.preRow('Functions', funHashes))
}
var gasEstimates = this.formatGasEstimates(contract.gasEstimates)
if (gasEstimates) {
details.append(this.preRow('Gas Estimates', gasEstimates))
}
if (contract.runtimeBytecode && contract.runtimeBytecode.length > 0) {
details.append(this.tableRow('Runtime Bytecode', contract.runtimeBytecode))
}
if (contract.opcodes !== undefined && contract.opcodes !== '') {
details.append(this.tableRow('Opcodes', contract.opcodes))
}
if (contract.assembly !== null) {
details.append(this.preRow('Assembly', this.formatAssemblyText(contract.assembly, '', source)))
}
var self = this
button.click(function () {
self.detailsOpen[contractName] = !self.detailsOpen[contractName]
details.toggle()
})
if (this.detailsOpen[contractName]) {
details.show()
}
return $('<div class="contractDetails"/>').append(button).append(details)
}
}
Loading…
Cancel
Save