diff options
Diffstat (limited to 'ethereal/assets/qml')
| -rw-r--r-- | ethereal/assets/qml/first_run.qml | 155 | ||||
| -rw-r--r-- | ethereal/assets/qml/muted.qml | 74 | ||||
| -rw-r--r-- | ethereal/assets/qml/newTransaction/_new_contract.qml | 196 | ||||
| -rw-r--r-- | ethereal/assets/qml/newTransaction/_simple_send.qml | 111 | ||||
| -rw-r--r-- | ethereal/assets/qml/wallet.qml | 211 | ||||
| -rw-r--r-- | ethereal/assets/qml/webapp.qml | 184 |
6 files changed, 877 insertions, 54 deletions
diff --git a/ethereal/assets/qml/first_run.qml b/ethereal/assets/qml/first_run.qml new file mode 100644 index 000000000..0bd3b4ce1 --- /dev/null +++ b/ethereal/assets/qml/first_run.qml @@ -0,0 +1,155 @@ +import QtQuick 2.0 +import Ethereum 1.0 + +// Which ones do we actually need? +import QtQuick.Controls 1.0; +import QtQuick.Layouts 1.0; +import QtQuick.Dialogs 1.0; +import QtQuick.Window 2.1; +import QtQuick.Controls.Styles 1.1 +import QtQuick.Dialogs 1.1 + +ApplicationWindow { + id: wizardRoot + width: 500 + height: 400 + title: "Ethereal first run setup" + + Column { + spacing: 5 + anchors.leftMargin: 10 + anchors.left: parent.left + + Text { + visible: true + text: "<h2>Ethereal setup</h2>" + } + + Column { + id: restoreColumn + spacing: 5 + Text { + visible: true + font.pointSize: 14 + text: "Restore your Ethereum account" + id: restoreLabel + } + + TextField { + id: txPrivKey + width: 480 + placeholderText: "Private key or mnemonic words" + focus: true + onTextChanged: { + if(this.text.length == 64){ + detailLabel.text = "Private (hex) key detected." + actionButton.enabled = true + } + else if(this.text.split(" ").length == 24){ + detailLabel.text = "Mnemonic key detected." + actionButton.enabled = true + }else{ + detailLabel.text = "" + actionButton.enabled = false + } + } + } + Row { + spacing: 10 + Button { + id: actionButton + text: "Restore" + enabled: false + onClicked: { + var success = eth.importAndSetPrivKey(txPrivKey.text) + if(success){ + importedDetails.visible = true + restoreColumn.visible = false + newKey.visible = false + wizardRoot.height = 120 + } + } + } + Text { + id: detailLabel + font.pointSize: 12 + anchors.topMargin: 10 + } + } + } + Column { + id: importedDetails + visible: false + Text { + text: "<b>Your account has been imported. Please close the application and restart it again to let the changes take effect.</b>" + wrapMode: Text.WordWrap + width: 460 + } + } + Column { + spacing: 5 + id: newDetailsColumn + visible: false + Text { + font.pointSize: 14 + text: "Your account details" + } + Label { + text: "Address" + } + TextField { + id: addressInput + readOnly:true + width: 480 + } + Label { + text: "Private key" + } + TextField { + id: privkeyInput + readOnly:true + width: 480 + } + Label { + text: "Mnemonic words" + } + TextField { + id: mnemonicInput + readOnly:true + width: 480 + } + Label { + text: "<b>A new account has been created. Please take the time to write down the <i>24 words</i>. You can use those to restore your account at a later date.</b>" + wrapMode: Text.WordWrap + width: 480 + } + Label { + text: "Please restart the application once you have completed the steps above." + wrapMode: Text.WordWrap + width: 480 + } + } + + } + Button { + anchors.right: parent.right + anchors.bottom: parent.bottom + anchors.rightMargin: 10 + anchors.bottomMargin: 10 + id: newKey + text: "I don't have an account yet" + onClicked: { + var res = eth.createAndSetPrivKey() + mnemonicInput.text = res[0] + addressInput.text = res[1] + privkeyInput.text = res[2] + + // Hide restore + restoreColumn.visible = false + + // Show new details + newDetailsColumn.visible = true + newKey.visible = false + } + } +} diff --git a/ethereal/assets/qml/muted.qml b/ethereal/assets/qml/muted.qml new file mode 100644 index 000000000..fac8267c4 --- /dev/null +++ b/ethereal/assets/qml/muted.qml @@ -0,0 +1,74 @@ +import QtQuick 2.0 +import QtWebKit 3.0 +import QtWebKit.experimental 1.0 +import QtQuick.Controls 1.0; +import QtQuick.Layouts 1.0; +import QtQuick.Window 2.1; +import Ethereum 1.0 + +ApplicationWindow { + id: window + title: "muted" + width: 900 + height: 600 + minimumHeight: 300 + + property alias url: webView.url + property alias webView: webView + + + Item { + id: root + anchors.fill: parent + WebView { + objectName: "webView" + id: webView + anchors { + top: root.top + right: root.right + left: root.left + bottom: root.bottom + //bottom: sizeGrip.top + } + + experimental.preferences.javascriptEnabled: true + experimental.preferences.navigatorQtObjectEnabled: true + experimental.onMessageReceived: { + var data = JSON.parse(message.data) + + switch(data.call) { + case "log": + console.log.apply(this, data.args) + break; + } + } + function postData(seed, data) { + webview.experimental.postMessage(JSON.stringify({data: data, _seed: seed})) + } + function postEvent(event, data) { + webview.experimental.postMessage(JSON.stringify({data: data, _event: event})) + } + } + + /* + Rectangle { + id: sizeGrip + color: "gray" + height: 5 + anchors { + left: root.left + right: root.right + } + y: Math.round(root.height * 2 / 3) + + MouseArea { + anchors.fill: parent + drag.target: sizeGrip + drag.minimumY: 0 + drag.maximumY: root.height - sizeGrip.height + drag.axis: Drag.YAxis + } + } + */ + } +} diff --git a/ethereal/assets/qml/newTransaction/_new_contract.qml b/ethereal/assets/qml/newTransaction/_new_contract.qml new file mode 100644 index 000000000..0794d3dcd --- /dev/null +++ b/ethereal/assets/qml/newTransaction/_new_contract.qml @@ -0,0 +1,196 @@ +import QtQuick 2.0 +import QtQuick.Controls 1.0; +import QtQuick.Layouts 1.0; +import QtQuick.Dialogs 1.0; +import QtQuick.Window 2.1; +import QtQuick.Controls.Styles 1.1 +import Ethereum 1.0 + +Component { + id: newContract + Column { + id: mainContractColumn + function contractFormReady(){ + if(codeView.text.length > 0 && txValue.text.length > 0 && txGas.text.length > 0 && txGasPrice.length > 0) { + txButton.state = "READY" + }else{ + txButton.state = "NOTREADY" + } + } + states: [ + State{ + name: "ERROR" + PropertyChanges { target: txResult; visible:true} + PropertyChanges { target: codeView; visible:true} + }, + State { + name: "DONE" + PropertyChanges { target: txValue; visible:false} + PropertyChanges { target: txGas; visible:false} + PropertyChanges { target: txGasPrice; visible:false} + PropertyChanges { target: codeView; visible:false} + PropertyChanges { target: txButton; visible:false} + PropertyChanges { target: txDataLabel; visible:false} + + PropertyChanges { target: txResult; visible:true} + PropertyChanges { target: txOutput; visible:true} + PropertyChanges { target: newTxButton; visible:true} + }, + State { + name: "SETUP" + PropertyChanges { target: txValue; visible:true; text: ""} + PropertyChanges { target: txGas; visible:true; text: ""} + PropertyChanges { target: txGasPrice; visible:true; text: ""} + PropertyChanges { target: codeView; visible:true; text: ""} + PropertyChanges { target: txButton; visible:true} + PropertyChanges { target: txDataLabel; visible:true} + + PropertyChanges { target: txResult; visible:false} + PropertyChanges { target: txOutput; visible:false} + PropertyChanges { target: newTxButton; visible:false} + } + ] + width: 400 + spacing: 5 + anchors.left: parent.left + anchors.top: parent.top + anchors.leftMargin: 5 + anchors.topMargin: 5 + + TextField { + id: txValue + width: 200 + placeholderText: "Amount" + validator: IntValidator { } + onTextChanged: { + contractFormReady() + } + } + TextField { + id: txGas + width: 200 + validator: IntValidator { } + placeholderText: "Gas" + onTextChanged: { + contractFormReady() + } + } + TextField { + id: txGasPrice + width: 200 + placeholderText: "Gas price" + validator: IntValidator { } + onTextChanged: { + contractFormReady() + } + } + + Row { + id: rowContract + ExclusiveGroup { id: contractTypeGroup } + RadioButton { + id: createContractRadio + text: "Create contract" + checked: true + exclusiveGroup: contractTypeGroup + onClicked: { + txFuelRecipient.visible = false + txDataLabel.text = "Contract code" + } + } + RadioButton { + id: runContractRadio + text: "Run contract" + exclusiveGroup: contractTypeGroup + onClicked: { + txFuelRecipient.visible = true + txDataLabel.text = "Contract arguments" + } + } + } + + + Label { + id: txDataLabel + text: "Contract code" + } + + TextArea { + id: codeView + height: 300 + anchors.topMargin: 5 + Layout.fillWidth: true + width: parent.width /2 + onTextChanged: { + contractFormReady() + } + } + + TextField { + id: txFuelRecipient + placeholderText: "Contract address" + validator: RegExpValidator { regExp: /[a-f0-9]{40}/ } + visible: false + width: 530 + } + + Button { + id: txButton + /* enabled: false */ + states: [ + State { + name: "READY" + PropertyChanges { target: txButton; /*enabled: true*/} + }, + State { + name: "NOTREADY" + PropertyChanges { target: txButton; /*enabled:false*/} + } + ] + text: "Send" + onClicked: { + //this.enabled = false + var res = eth.createTx(txFuelRecipient.text, txValue.text, txGas.text, txGasPrice.text, codeView.text) + if(res[1]) { + txResult.text = "Your contract <b>could not</b> be send over the network:\n<b>" + txResult.text += res[1].error() + txResult.text += "</b>" + mainContractColumn.state = "ERROR" + } else { + txResult.text = "Your transaction has been submitted:\n" + txOutput.text = res[0] + mainContractColumn.state = "DONE" + } + } + } + Text { + id: txResult + visible: false + } + TextField { + id: txOutput + visible: false + width: 530 + } + Button { + id: newTxButton + visible: false + text: "Create an other contract" + onClicked: { + this.visible = false + txResult.text = "" + txOutput.text = "" + mainContractColumn.state = "SETUP" + } + } + + Button { + id: debugButton + text: "Debug" + onClicked: { + var res = ui.debugTx("", txValue.text, txGas.text, txGasPrice.text, codeView.text) + debugWindow.visible = true + } + } + } +} diff --git a/ethereal/assets/qml/newTransaction/_simple_send.qml b/ethereal/assets/qml/newTransaction/_simple_send.qml new file mode 100644 index 000000000..d460797ea --- /dev/null +++ b/ethereal/assets/qml/newTransaction/_simple_send.qml @@ -0,0 +1,111 @@ +import QtQuick 2.0 +import QtQuick.Controls 1.0; +import QtQuick.Layouts 1.0; +import QtQuick.Dialogs 1.0; +import QtQuick.Window 2.1; +import QtQuick.Controls.Styles 1.1 +import Ethereum 1.0 + +Component { + id: newTransaction + Column { + id: simpleSendColumn + states: [ + State{ + name: "ERROR" + }, + State { + name: "DONE" + PropertyChanges { target: txSimpleValue; visible:false} + PropertyChanges { target: txSimpleRecipient; visible:false} + PropertyChanges { target:newSimpleTxButton; visible:false} + + PropertyChanges { target: txSimpleResult; visible:true} + PropertyChanges { target: txSimpleOutput; visible:true} + PropertyChanges { target:newSimpleTxButton; visible:true} + }, + State { + name: "SETUP" + PropertyChanges { target: txSimpleValue; visible:true; text: ""} + PropertyChanges { target: txSimpleRecipient; visible:true; text: ""} + PropertyChanges { target: txSimpleButton; visible:true} + PropertyChanges { target:newSimpleTxButton; visible:false} + } + ] + spacing: 5 + anchors.leftMargin: 5 + anchors.topMargin: 5 + anchors.top: parent.top + anchors.left: parent.left + + function checkFormState(){ + if(txSimpleRecipient.text.length == 40 && txSimpleValue.text.length > 0) { + txSimpleButton.state = "READY" + }else{ + txSimpleButton.state = "NOTREADY" + } + } + + TextField { + id: txSimpleRecipient + placeholderText: "Recipient address" + Layout.fillWidth: true + validator: RegExpValidator { regExp: /[a-f0-9]{40}/ } + width: 530 + onTextChanged: { checkFormState() } + } + TextField { + id: txSimpleValue + placeholderText: "Amount" + anchors.rightMargin: 5 + validator: IntValidator { } + onTextChanged: { checkFormState() } + } + Button { + id: txSimpleButton + /*enabled: false*/ + states: [ + State { + name: "READY" + PropertyChanges { target: txSimpleButton; /*enabled: true*/} + }, + State { + name: "NOTREADY" + PropertyChanges { target: txSimpleButton; /*enabled: false*/} + } + ] + text: "Send" + onClicked: { + //this.enabled = false + var res = eth.createTx(txSimpleRecipient.text, txSimpleValue.text,"","","") + if(res[1]) { + txSimpleResult.text = "There has been an error broadcasting your transaction:" + res[1].error() + } else { + txSimpleResult.text = "Your transaction has been broadcasted over the network.\nYour transaction id is:" + txSimpleOutput.text = res[0] + this.visible = false + simpleSendColumn.state = "DONE" + } + } + } + Text { + id: txSimpleResult + visible: false + + } + TextField { + id: txSimpleOutput + visible: false + width: 530 + } + Button { + id: newSimpleTxButton + visible: false + text: "Create an other transaction" + onClicked: { + this.visible = false + simpleSendColumn.state = "SETUP" + } + } + } +} diff --git a/ethereal/assets/qml/wallet.qml b/ethereal/assets/qml/wallet.qml index 7fc7f5447..4813aaede 100644 --- a/ethereal/assets/qml/wallet.qml +++ b/ethereal/assets/qml/wallet.qml @@ -23,6 +23,11 @@ ApplicationWindow { shortcut: "Ctrl+o" onTriggered: openAppDialog.open() } + MenuItem { + text: "Muted" + shortcut: "Ctrl+e" + onTriggered: ui.muted("") + } } Menu { @@ -79,6 +84,7 @@ ApplicationWindow { //color: "#D9DDE7" color: "#252525" + ColumnLayout { y: 50 anchors.left: parent.left @@ -139,6 +145,7 @@ ApplicationWindow { anchors.fill: parent TableViewColumn{ role: "value" ; title: "Value" ; width: 100 } TableViewColumn{ role: "address" ; title: "Address" ; width: 430 } + TableViewColumn{ role: "contract" ; title: "Contract" ; width: 100 } model: txModel } @@ -150,45 +157,26 @@ ApplicationWindow { visible: false anchors.fill: parent color: "#00000000" - - ColumnLayout { - width: 400 - anchors.left: parent.left - anchors.top: parent.top + TabView{ + anchors.fill: parent + anchors.rightMargin: 5 anchors.leftMargin: 5 anchors.topMargin: 5 - TextField { - id: txAmount - width: 200 - placeholderText: "Amount" - } + anchors.bottomMargin: 5 + id: newTransactionTab + Component.onCompleted:{ + var component = Qt.createComponent("newTransaction/_simple_send.qml") + var newTransaction = component.createObject("newTransaction") - TextField { - id: txReceiver - placeholderText: "Receiver Address (or empty for contract)" - Layout.fillWidth: true - } + component = Qt.createComponent("newTransaction/_new_contract.qml") + var newContract = component.createObject("newContract") - Label { - text: "Transaction data" - } - TextArea { - id: codeView - anchors.topMargin: 5 - Layout.fillWidth: true - width: parent.width /2 - } - - Button { - text: "Send" - onClicked: { - console.log(eth.createTx(txReceiver.text, txAmount.text, codeView.text)) - } + addTab("Simple send", newTransaction) + addTab("Contracts", newContract) } } } - Rectangle { id: networkView property var title: "Network" @@ -230,26 +218,26 @@ ApplicationWindow { } /* - signal addPlugin(string name) - Component { - id: pluginWindow - Rectangle { - anchors.fill: parent - Label { - id: pluginTitle - anchors.centerIn: parent - text: "Hello world" - } - Component.onCompleted: setView(this) - } - } - - onAddPlugin: { - var pluginWin = pluginWindow.createObject(mainView) - console.log(pluginWin) - pluginWin.pluginTitle.text = "Test" - } - */ + signal addPlugin(string name) + Component { + id: pluginWindow + Rectangle { + anchors.fill: parent + Label { + id: pluginTitle + anchors.centerIn: parent + text: "Hello world" + } + Component.onCompleted: setView(this) + } + } + + onAddPlugin: { + var pluginWin = pluginWindow.createObject(mainView) + console.log(pluginWin) + pluginWin.pluginTitle.text = "Test" + } + */ } } @@ -257,7 +245,10 @@ ApplicationWindow { id: openAppDialog title: "Open QML Application" onAccepted: { - ui.open(openAppDialog.fileUrl.toString()) + //ui.open(openAppDialog.fileUrl.toString()) + //ui.openHtml(Qt.resolvedUrl(ui.assetPath("test.html"))) + ui.openHtml(openAppDialog.fileUrl.toString()) + } } @@ -374,9 +365,115 @@ ApplicationWindow { anchors.left: aboutIcon.right anchors.leftMargin: 10 font.pointSize: 12 - text: "<h2>Ethereum(Go)</h2><br><h3>Development</h3>Jeffrey Wilcke<br><h3>Binary Distribution</h3>Jarrad Hope<br>" + text: "<h2>Ethereal</h2><br><h3>Development</h3>Jeffrey Wilcke<br>Maran Hidskes<br><h3>Binary Distribution</h3>Jarrad Hope<br>" + } + + } + + Window { + id: debugWindow + visible: false + title: "Debugger" + minimumWidth: 600 + minimumHeight: 600 + width: 800 + height: 600 + + + Item { + id: keyHandler + focus: true + Keys.onPressed: { + if (event.key == Qt.Key_Space) { + ui.next() + } + } + } + SplitView { + + anchors.fill: parent + property var asmModel: ListModel { + id: asmModel + } + TableView { + id: asmTableView + width: 200 + TableViewColumn{ role: "value" ; title: "" ; width: 100 } + model: asmModel + } + + Rectangle { + anchors.left: asmTableView.right + anchors.right: parent.right + SplitView { + orientation: Qt.Vertical + anchors.fill: parent + + TableView { + property var memModel: ListModel { + id: memModel + } + height: parent.height/2 + width: parent.width + TableViewColumn{ id:mnumColmn ; role: "num" ; title: "#" ; width: 50} + TableViewColumn{ role: "value" ; title: "Memory" ; width: 750} + model: memModel + } + + SplitView { + orientation: Qt.Horizontal + TableView { + property var debuggerLog: ListModel { + id: debuggerLog + } + TableViewColumn{ role: "value"; title: "Debug messages" } + model: debuggerLog + } + TableView { + property var stackModel: ListModel { + id: stackModel + } + height: parent.height/2 + width: parent.width + TableViewColumn{ role: "value" ; title: "Stack" ; width: parent.width } + model: stackModel + } + } + } + } } + } + + function setAsm(asm) { + asmModel.append({asm: asm}) + } + + function setInstruction(num) { + asmTableView.selection.clear() + asmTableView.selection.select(num-1) + } + + function clearAsm() { + asmModel.clear() + } + function setMem(mem) { + memModel.append({num: mem.num, value: mem.value}) + } + function clearMem(){ + memModel.clear() + } + + function setStack(stack) { + stackModel.append({value: stack}) + } + function addDebugMessage(message){ + console.log("WOOP:") + debuggerLog.append({value: message}) + } + + function clearStack() { + stackModel.clear() } function loadPlugin(name) { @@ -389,7 +486,13 @@ ApplicationWindow { } function addTx(tx) { - txModel.insert(0, {hash: tx.hash, address: tx.address, value: tx.value}) + var isContract + if (tx.contract == true){ + isContract = "Yes" + }else{ + isContract = "No" + } + txModel.insert(0, {hash: tx.hash, address: tx.address, value: tx.value, contract: isContract}) } function addBlock(block) { diff --git a/ethereal/assets/qml/webapp.qml b/ethereal/assets/qml/webapp.qml new file mode 100644 index 000000000..d02c9a82e --- /dev/null +++ b/ethereal/assets/qml/webapp.qml @@ -0,0 +1,184 @@ +import QtQuick 2.0 +import QtWebKit 3.0 +import QtWebKit.experimental 1.0 +import QtQuick.Controls 1.0; +import QtQuick.Layouts 1.0; +import QtQuick.Window 2.1; +import Ethereum 1.0 + +ApplicationWindow { + id: window + title: "Ethereum" + width: 900 + height: 600 + minimumHeight: 300 + + property alias url: webview.url + property alias webView: webview + + Item { + objectName: "root" + id: root + anchors.fill: parent + state: "inspectorShown" + + WebView { + objectName: "webView" + id: webview + anchors.fill: parent + /* + anchors { + left: parent.left + right: parent.right + bottom: sizeGrip.top + top: parent.top + } + */ + + onTitleChanged: { window.title = title } + experimental.preferences.javascriptEnabled: true + experimental.preferences.navigatorQtObjectEnabled: true + experimental.preferences.developerExtrasEnabled: true + experimental.userScripts: [ui.assetPath("ethereum.js")] + experimental.onMessageReceived: { + console.log("[onMessageReceived]: ", message.data) + // TODO move to messaging.js + var data = JSON.parse(message.data) + + try { + switch(data.call) { + case "getBlockByNumber": + var block = eth.getBlock("b9b56cf6f907fbee21db0cd7cbc0e6fea2fe29503a3943e275c5e467d649cb06") + postData(data._seed, block) + break + case "getBlockByHash": + var block = eth.getBlock("b9b56cf6f907fbee21db0cd7cbc0e6fea2fe29503a3943e275c5e467d649cb06") + postData(data._seed, block) + break + case "transact": + require(5) + + var tx = eth.transact(data.args[0], data.args[1], data.args[2],data.args[3],data.args[4],data.args[5]) + postData(data._seed, tx) + + break + case "create": + postData(data._seed, null) + + break + case "getStorage": + require(2); + + var stateObject = eth.getStateObject(data.args[0]) + var storage = stateObject.getStorage(data.args[1]) + postData(data._seed, storage) + + break + case "getBalance": + require(1); + + postData(data._seed, eth.getStateObject(data.args[0]).value()); + + break + case "getKey": + var key = eth.getKey().privateKey; + + postData(data._seed, key) + break + case "watch": + require(1) + eth.watch(data.args[0], data.args[1]); + break + case "disconnect": + require(1) + postData(data._seed, null) + break; + case "set": + for(var key in data.args) { + if(webview.hasOwnProperty(key)) { + window[key] = data.args[key]; + } + } + break; + case "getSecretToAddress": + require(1) + postData(data._seed, eth.secretToAddress(data.args[0])) + break; + case "debug": + console.log(data.args[0]); + break; + } + } catch(e) { + console.log(data.call + ": " + e) + + postData(data._seed, null); + } + } + + function require(args, num) { + if(args.length < num) { + throw("required argument count of "+num+" got "+args.length); + } + } + function postData(seed, data) { + webview.experimental.postMessage(JSON.stringify({data: data, _seed: seed})) + } + function postEvent(event, data) { + webview.experimental.postMessage(JSON.stringify({data: data, _event: event})) + } + + function onNewBlockCb(block) { + postEvent("block:new", block) + } + function onObjectChangeCb(stateObject) { + postEvent("object:"+stateObject.address(), stateObject) + } + function onStorageChangeCb(storageObject) { + var ev = ["storage", storageObject.stateAddress, storageObject.address].join(":"); + postEvent(ev, [storageObject.address, storageObject.value]) + } + } + + Rectangle { + id: sizeGrip + color: "gray" + visible: false + height: 10 + anchors { + left: root.left + right: root.right + } + y: Math.round(root.height * 2 / 3) + + MouseArea { + anchors.fill: parent + drag.target: sizeGrip + drag.minimumY: 0 + drag.maximumY: root.height + drag.axis: Drag.YAxis + } + } + + WebView { + id: inspector + visible: false + url: webview.experimental.remoteInspectorUrl + anchors { + left: root.left + right: root.right + top: sizeGrip.bottom + bottom: root.bottom + } + } + + states: [ + State { + name: "inspectorShown" + PropertyChanges { + target: inspector + url: webview.experimental.remoteInspectorUrl + } + } + ] + } +} |