|
|
|
@ -20,16 +20,51 @@ class MultiParamManager { |
|
|
|
|
this.clickCallBack = clickCallBack |
|
|
|
|
this.inputs = inputs |
|
|
|
|
this.title = title |
|
|
|
|
this.basicInputField |
|
|
|
|
this.multiFields |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
switchMethodViewOn () { |
|
|
|
|
this.contractActionsContainerSingle.style.display = 'none' |
|
|
|
|
this.contractActionsContainerMulti.style.display = 'flex' |
|
|
|
|
// fill in the inputs
|
|
|
|
|
this.makeMultiVal() |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
switchMethodViewOff () { |
|
|
|
|
this.contractActionsContainerSingle.style.display = 'flex' |
|
|
|
|
this.contractActionsContainerMulti.style.display = 'none' |
|
|
|
|
this.basicInputField.value = this.getMultiValsString() |
|
|
|
|
} |
|
|
|
|
getMultiValsString () { |
|
|
|
|
var valArray = this.multiFields.querySelectorAll('input') |
|
|
|
|
var ret = '' |
|
|
|
|
for (var k = 0; k < valArray.length; k++) { |
|
|
|
|
var el = valArray[k] |
|
|
|
|
if (ret !== '') ret += ',' |
|
|
|
|
ret += el.value |
|
|
|
|
} |
|
|
|
|
return ret |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
emptyInputs () { |
|
|
|
|
var valArray = this.multiFields.querySelectorAll('input') |
|
|
|
|
for (var k = 0; k < valArray.length; k++) { |
|
|
|
|
valArray[k].value = '' |
|
|
|
|
} |
|
|
|
|
this.basicInputField.value = '' |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
makeMultiVal () { |
|
|
|
|
var inputString = this.basicInputField.value |
|
|
|
|
console.log(inputString) |
|
|
|
|
var inputStringArray = inputString.split(',') |
|
|
|
|
// !! the split here will mess up a value with a comma in it !!
|
|
|
|
|
// do we not make a split if its a , inside a []?
|
|
|
|
|
var multiInputs = this.multiFields.querySelectorAll('input') |
|
|
|
|
for (var k = 0; k < multiInputs.length; k++) { |
|
|
|
|
multiInputs[k].value = inputStringArray[k] |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
createMultiFields () { |
|
|
|
@ -52,28 +87,31 @@ class MultiParamManager { |
|
|
|
|
title = '(fallback)' |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
var basicInputField = yo`<input></input>` |
|
|
|
|
basicInputField.setAttribute('placeholder', this.inputs) |
|
|
|
|
basicInputField.setAttribute('title', this.inputs) |
|
|
|
|
this.basicInputField = yo`<input></input>` |
|
|
|
|
this.basicInputField.setAttribute('placeholder', this.inputs) |
|
|
|
|
this.basicInputField.setAttribute('title', this.inputs) |
|
|
|
|
|
|
|
|
|
var onClick = (domEl) => { |
|
|
|
|
this.clickCallBack(this.funABI.inputs, basicInputField.value) |
|
|
|
|
this.clickCallBack(this.funABI.inputs, this.basicInputField.value) |
|
|
|
|
this.emptyInputs() |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
this.contractActionsContainerSingle = yo`<div class="${css.contractActionsContainerSingle}" >
|
|
|
|
|
<button onclick=${() => { onClick() }} class="${css.instanceButton}">${title}</button>${basicInputField}<i class="fa fa-angle-down ${css.methCaret}" onclick=${() => { this.switchMethodViewOn() }} title=${title} ></i> |
|
|
|
|
<button onclick=${() => { onClick() }} class="${css.instanceButton}">${title}</button>${this.basicInputField}<i class="fa fa-angle-down ${css.methCaret}" onclick=${() => { this.switchMethodViewOn() }} title=${title} ></i> |
|
|
|
|
</div>` |
|
|
|
|
|
|
|
|
|
var multiFields = this.createMultiFields() |
|
|
|
|
this.multiFields = this.createMultiFields() |
|
|
|
|
var multiOnClick = () => { |
|
|
|
|
var valArray = multiFields.querySelectorAll('input') |
|
|
|
|
var valArray = this.multiFields.querySelectorAll('input') |
|
|
|
|
var ret = '' |
|
|
|
|
for (var k = 0; k < valArray.length; k++) { |
|
|
|
|
var el = valArray[k] |
|
|
|
|
if (ret !== '') ret += ',' |
|
|
|
|
el.value = el.value.replace(/(^|,\s+|,)([a-zA-Z]+)(\s+,|,|$)/g, '$1"$2"$3') // replace non quoted string - that starts with a letter
|
|
|
|
|
ret += el.value |
|
|
|
|
} |
|
|
|
|
this.clickCallBack(this.funABI.inputs, ret) |
|
|
|
|
this.emptyInputs() |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
var button = yo`<button onclick=${() => { multiOnClick() }} class="${css.instanceButton}"></button>` |
|
|
|
@ -84,7 +122,7 @@ class MultiParamManager { |
|
|
|
|
<div class="${css.multiTitle}">${title}</div> |
|
|
|
|
<i class='fa fa-angle-up ${css.methCaret}'></i> |
|
|
|
|
</div> |
|
|
|
|
${multiFields} |
|
|
|
|
${this.multiFields} |
|
|
|
|
<div class="${css.group} ${css.multiArg}" > |
|
|
|
|
${button} |
|
|
|
|
</div> |
|
|
|
@ -106,7 +144,7 @@ class MultiParamManager { |
|
|
|
|
contractProperty.classList.add(css.hasArgs) |
|
|
|
|
} else { |
|
|
|
|
this.contractActionsContainerSingle.querySelector('i').style.visibility = 'hidden' |
|
|
|
|
basicInputField.style.display = 'none' |
|
|
|
|
this.basicInputField.style.display = 'none' |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
if (this.funABI.payable === true) { |
|
|
|
|