From 3881b160d64938d840c9a3cdcbba31aee9f15985 Mon Sep 17 00:00:00 2001 From: yann300 Date: Fri, 15 May 2015 11:26:19 +0200 Subject: [PATCH] Display gas estimation as annotation --- mix/CodeModel.cpp | 8 ++-- mix/CodeModel.h | 6 ++- mix/qml/Application.qml | 15 ++++++ mix/qml/CodeEditorView.qml | 9 +++- mix/qml/WebCodeEditor.qml | 10 ++-- mix/qml/html/cm/solarized.css | 6 ++- mix/qml/html/codeeditor.js | 87 +++++++++++++++++++++++++++++++---- 7 files changed, 117 insertions(+), 24 deletions(-) diff --git a/mix/CodeModel.cpp b/mix/CodeModel.cpp index ecdb46be3..d9262586b 100644 --- a/mix/CodeModel.cpp +++ b/mix/CodeModel.cpp @@ -189,7 +189,6 @@ CodeModel::CodeModel(): qRegisterMetaType("QContractDefinition*"); qRegisterMetaType("QFunctionDefinition*"); qRegisterMetaType("QVariableDeclaration*"); - //qRegisterMetaType("GasMap"); qmlRegisterType("org.ethereum.qml", 1, 0, "QFunctionDefinition"); qmlRegisterType("org.ethereum.qml", 1, 0, "QVariableDeclaration"); } @@ -325,7 +324,6 @@ void CodeModel::gasEstimation(solidity::CompilerStack const& _cs) m_gasCostsMaps.clear(); for (std::string n: _cs.getContractNames()) { - ContractDefinition const& contractDefinition = _cs.getContractDefinition(n); QString sourceName = QString::fromStdString(*contractDefinition.getLocation().sourceName); @@ -344,7 +342,9 @@ void CodeModel::gasEstimation(solidity::CompilerStack const& _cs) { SourceLocation location = gasIte->first->getLocation(); GasMeter::GasConsumption cost = gasIte->second; - GasMap* gas = new GasMap(location.start, location.end, (new QBigInt(cost.value))->value()); + std::stringstream v; + v << cost.value; + GasMap* gas = new GasMap(location.start, location.end, QString::fromStdString(v.str()), gasIte->second.isInfinite); m_gasCostsMaps.find(sourceName).value().push_back(QVariant::fromValue(gas)); } } @@ -355,8 +355,6 @@ QVariantList CodeModel::gasCostByDocumentId(QString const& _documentId) const if (m_gasCostsMaps.contains(_documentId)) { auto sourceMapIter = m_gasCostsMaps.find(_documentId); - int gg = sourceMapIter.value().size(); - Q_UNUSED(gg); return sourceMapIter.value(); } else diff --git a/mix/CodeModel.h b/mix/CodeModel.h index a1a2c29ec..b28c5f6c6 100644 --- a/mix/CodeModel.h +++ b/mix/CodeModel.h @@ -134,17 +134,19 @@ class GasMap: public QObject Q_PROPERTY(int start MEMBER m_start CONSTANT) Q_PROPERTY(int end MEMBER m_end CONSTANT) Q_PROPERTY(QString gas MEMBER m_gas CONSTANT) + Q_PROPERTY(bool isInfinite MEMBER m_isInfinite CONSTANT) public: - GasMap(int _start, int _end, QString _gas): m_start(_start), m_end(_end), m_gas(_gas) {} + GasMap(int _start, int _end, QString _gas, bool _isInfinite): m_start(_start), m_end(_end), m_gas(_gas), m_isInfinite(_isInfinite) {} int m_start; int m_end; QString m_gas; + bool m_isInfinite; }; using SourceMaps = QMap; //by source id -using GasCostsMaps = QMap*/>; //gas cost by contract name +using GasCostsMaps = QMap; //gas cost by contract name /// Code compilation model. Compiles contracts in background an provides compiled contract data class CodeModel: public QObject diff --git a/mix/qml/Application.qml b/mix/qml/Application.qml index fe62efe12..161f7141a 100644 --- a/mix/qml/Application.qml +++ b/mix/qml/Application.qml @@ -116,6 +116,10 @@ ApplicationWindow { MenuSeparator {} MenuItem { action: toggleAssemblyDebuggingAction } } + Menu { + title: qsTr("Tools") + MenuItem { action: gasEstimationAction } + } Menu { title: qsTr("Windows") MenuItem { action: openNextDocumentAction } @@ -409,4 +413,15 @@ ApplicationWindow { mainContent.codeEditor.goToCompilationError(); } } + + Action { + id: gasEstimationAction + text: qsTr("Display gas estimation") + shortcut: "Ctrl+G" + checkable: true + onTriggered: + { + mainContent.codeEditor.displayGasEstimation(checked); + } + } } diff --git a/mix/qml/CodeEditorView.qml b/mix/qml/CodeEditorView.qml index 08bb072f5..08610a8e1 100644 --- a/mix/qml/CodeEditorView.qml +++ b/mix/qml/CodeEditorView.qml @@ -168,6 +168,13 @@ Item { editors.itemAt(i).item.setFontSize(size); } + function displayGasEstimation(checked) + { + var editor = getEditor(currentDocumentId); + if (editor) + editor.displayGasEstimation(checked); + } + Component.onCompleted: projectModel.codeEditor = codeEditorView; Connections { @@ -180,7 +187,7 @@ Item { var gasCosts = codeModel.gasCostByDocumentId(currentDocumentId); var editor = getEditor(currentDocumentId); if (editor) - editor.displayGasCosts(gasCosts); + editor.setGasCosts(gasCosts); } } diff --git a/mix/qml/WebCodeEditor.qml b/mix/qml/WebCodeEditor.qml index a2602304a..0d681d79c 100644 --- a/mix/qml/WebCodeEditor.qml +++ b/mix/qml/WebCodeEditor.qml @@ -83,12 +83,14 @@ Item { editorBrowser.runJavaScript("setFontSize(" + size + ")", function(result) {}); } - function displayGasCosts(gasCosts) { + function setGasCosts(gasCosts) { + if (initialized && editorBrowser) + editorBrowser.runJavaScript("setGasCosts('" + JSON.stringify(gasCosts) + "')", function(result) {}); + } - //console.log(gasCosts); - //console.log(JSON.stringify(gasCosts)); + function displayGasEstimation(show) { if (initialized && editorBrowser) - editorBrowser.runJavaScript("displayGasCosts('" + JSON.stringify(gasCosts) + "')", function(result) {}); + editorBrowser.runJavaScript("displayGasEstimation('" + show + "')", function(result) {}); } Clipboard diff --git a/mix/qml/html/cm/solarized.css b/mix/qml/html/cm/solarized.css index 046042450..1d298b990 100644 --- a/mix/qml/html/cm/solarized.css +++ b/mix/qml/html/cm/solarized.css @@ -190,6 +190,8 @@ view-port span.CodeMirror-selectedtext { color: #586e75 !important; } -.gasCost { - background: #b58900 !important; +/* Gas Costs */ +.CodeMirror-gasCosts { + border-bottom: double 1px #2aa198; } + diff --git a/mix/qml/html/codeeditor.js b/mix/qml/html/codeeditor.js index cc5e9a28c..3e1a54958 100644 --- a/mix/qml/html/codeeditor.js +++ b/mix/qml/html/codeeditor.js @@ -3,7 +3,7 @@ var editor = CodeMirror(document.body, { //styleActiveLine: true, matchBrackets: true, autofocus: true, - gutters: ["CodeMirror-linenumbers", "breakpoints", "gasCost"], + gutters: ["CodeMirror-linenumbers", "breakpoints"], autoCloseBrackets: true, styleSelectedText: true }); @@ -207,22 +207,89 @@ makeGasCostMarker = function(value) { var marker = document.createElement("div"); marker.style.color = "#822"; marker.innerHTML = value; + marker.className = "CodeMirror-errorannotation-context"; return marker; }; -displayGasCosts = function(gasCosts) +var gasCosts = null; +setGasCosts = function(_gasCosts) { - gasCosts = JSON.parse(gasCosts); - for (var i in gasCosts) + gasCosts = JSON.parse(_gasCosts); + + if (showGasEstimation) + { + displayGasEstimation(false); + displayGasEstimation(true); + } +} + +var showGasEstimation = false; +var gasMarkText = []; +var gasMarkRef = {}; +displayGasEstimation = function(show) +{ + show = JSON.parse(show); + showGasEstimation = show; + if (show) + { + var maxGas = 20000; + var step = colorGradient.length / maxGas; // 20000 max gas + gasMarkRef = []; + gasMarkRef = {}; + for (var i in gasCosts) + { + if (gasCosts[i].gas !== "0") + { + var color; + var colorIndex = Math.round(step * gasCosts[i].gas); + if (gasCosts[i].isInfinite || colorIndex > colorGradient.length) + color = colorGradient[colorGradient.length - 1]; + else + color = colorGradient[colorIndex]; + var className = "CodeMirror-gasCosts" + i; + var line = editor.posFromIndex(gasCosts[i].start) + gasMarkText.push(editor.markText(line, editor.posFromIndex(gasCosts[i].end), { inclusiveLeft: true, inclusiveRight: true, handleMouseEvents: true, className: className, css: "background-color:" + color })); + gasMarkRef[className] = { line: line.line, value: gasCosts[i] }; + } + } + CodeMirror.on(editor.getWrapperElement(), "mouseover", listenMouseOver); + } + else { - var line = editor.posFromIndex(gasCosts[i].start); - console.log("___________") - console.log(line.line); - console.log(gasCosts[i].start); - //editor.setGutterMarker(line.line, "gasCost", makeGasCostMarker(gasCosts[i].gas)); - editor.markText(editor.posFromIndex(gasCosts[i].start), editor.posFromIndex(gasCosts[i].end), { className: "gasCost" }); + CodeMirror.off(editor.getWrapperElement(), "mouseover", listenMouseOver); + for (var k in gasMarkText) + gasMarkText[k].clear(); + if (gasAnnotation) + { + gasAnnotation.clear(); + gasAnnotation = null; + } + } +} + +var gasAnnotation; +function listenMouseOver(e) +{ + var node = e.target || e.srcElement; + if (node) { + if (!gasAnnotation && node.className && node.className.indexOf("CodeMirror-gasCosts") !== -1) + { + if (gasAnnotation) + gasAnnotation.clear(); + var cl = node.className.split(" ")[1]; + var gasTitle = gasMarkRef[cl].value.isInfinite ? "infinite" : gasMarkRef[cl].value.gas; + gasTitle = gasTitle + " gas"; + gasAnnotation = editor.addLineWidget(gasMarkRef[cl].line + 1, makeGasCostMarker(gasTitle), { coverGutter: false, above: true }); + } + else if (gasAnnotation) + { + gasAnnotation.clear(); + gasAnnotation = null; + } } } +// blue => red ["#1515ED", "#1714EA", "#1914E8", "#1B14E6", "#1D14E4", "#1F14E2", "#2214E0", "#2414DE", "#2614DC", "#2813DA", "#2A13D8", "#2D13D6", "#2F13D4", "#3113D2", "#3313D0", "#3513CE", "#3713CC", "#3A12CA", "#3C12C8", "#3E12C6", "#4012C4", "#4212C2", "#4512C0", "#4712BE", "#4912BC", "#4B11BA", "#4D11B8", "#4F11B6", "#5211B4", "#5411B2", "#5611B0", "#5811AE", "#5A11AC", "#5D11AA", "#5F10A7", "#6110A5", "#6310A3", "#6510A1", "#67109F", "#6A109D", "#6C109B", "#6E1099", "#700F97", "#720F95", "#750F93", "#770F91", "#790F8F", "#7B0F8D", "#7D0F8B", "#7F0F89", "#820E87", "#840E85", "#860E83", "#880E81", "#8A0E7F", "#8D0E7D", "#8F0E7B", "#910E79", "#930D77", "#950D75", "#970D73", "#9A0D71", "#9C0D6F", "#9E0D6D", "#A00D6B", "#A20D69", "#A50D67", "#A70C64", "#A90C62", "#AB0C60", "#AD0C5E", "#AF0C5C", "#B20C5A", "#B40C58", "#B60C56", "#B80B54", "#BA0B52", "#BD0B50", "#BF0B4E", "#C10B4C", "#C30B4A", "#C50B48", "#C70B46", "#CA0A44", "#CC0A42", "#CE0A40", "#D00A3E", "#D20A3C", "#D50A3A", "#D70A38", "#D90A36", "#DB0934", "#DD0932", "#DF0930", "#E2092E", "#E4092C", "#E6092A", "#E80928", "#EA0926", "#ED0924"] +/* green => red */ var colorGradient = ["#429C27", "#439A26", "#449926", "#469726", "#479626", "#489525", "#4A9325", "#4B9225", "#4D9025", "#4E8F25", "#4F8E24", "#518C24", "#528B24", "#548924", "#558824", "#568723", "#588523", "#598423", "#5B8223", "#5C8122", "#5D8022", "#5F7E22", "#607D22", "#627B22", "#637A21", "#647921", "#667721", "#677621", "#697421", "#6A7320", "#6B7220", "#6D7020", "#6E6F20", "#706E20", "#716C1F", "#726B1F", "#74691F", "#75681F", "#76671E", "#78651E", "#79641E", "#7B621E", "#7C611E", "#7D601D", "#7F5E1D", "#805D1D", "#825B1D", "#835A1D", "#84591C", "#86571C", "#87561C", "#89541C", "#8A531B", "#8B521B", "#8D501B", "#8E4F1B", "#904D1B", "#914C1A", "#924B1A", "#94491A", "#95481A", "#97461A", "#984519", "#994419", "#9B4219", "#9C4119", "#9E4019", "#9F3E18", "#A03D18", "#A23B18", "#A33A18", "#A43917", "#A63717", "#A73617", "#A93417", "#AA3317", "#AB3216", "#AD3016", "#AE2F16", "#B02D16", "#B12C16", "#B22B15", "#B42915", "#B52815", "#B72615", "#B82514", "#B92414", "#BB2214", "#BC2114", "#BE1F14", "#BF1E13", "#C01D13", "#C21B13", "#C31A13", "#C51813", "#C61712", "#C71612", "#C91412", "#CA1312", "#CC1212"] editor.setOption("extraKeys", extraKeys);