0
244
Views¿Es posible obtener sugerencias de línea de tiempo de depuración al estilo de JetBrains en Ace Editor?
Actualmente tengo un editor Ace incrustado en mi navegador. Me gustaría usar sugerencias de línea cuando ejecuto código en la aplicación del navegador. ¿Ace ofrece alguna funcionalidad de este tipo, o sería aconsejable agregar y eliminar comentarios al final de la línea? tenga en cuenta que solo quiero un solo carácter en estas sugerencias. También consideré usar el canalón en mi aplicación, pero los números de línea también son importantes para mí.
aquí hay una imagen de mi aplicación
Me gustaría que ~F apareciera en la línea verde y ~D en la línea azul. Esta es una ejecución de RISC ISA, pero no creo que eso deba importar.
·
Juan Pablo Isaza
1 answers
Answer question0
Hay dos maneras
- enganche en el tokenizador para agregar un token adicional
// update lines editor.session.bgTokenizer.lines[0].push({type: "comment", value: " // ~D "}) // hook into $tokenizeRow to add tokens after text is changed too if (!editor.session.bgTokenizer.$tokenizeRow_orig) editor.session.bgTokenizer.$tokenizeRow_orig = editor.session.bgTokenizer.$tokenizeRow editor.session.bgTokenizer.$tokenizeRow = function(row) { var tokens = editor.session.bgTokenizer.$tokenizeRow_orig(row) tokens.push({type: "comment", value: " // ~D " + row}) return tokens } // redraw editor editor.renderer.updateFull()- agregue un oyente de procesamiento y agregue elementos dom al editor
var dom = require("ace/lib/dom") var annotations = {5: {text: "foo"}, 25: {text: "bar"}} editor.renderer.on("afterRender", function() { editor.renderer.$textLayer.$lines.cells.forEach(function(cell) { if (annotations[cell.row]) { if (!annotations[cell.row].element) annotations[cell.row].element = dom.buildDom(["span", {style: "color:red"}, annotations[cell.row].text]) cell.element.append(annotations[cell.row].element) } }) }) editor.renderer.updateText() var value = Array(100).fill(0).map((x,i)=>i+3).join(" ~ \n") function isPrime(num) { var max = Math.sqrt(num) + 1 for (var i = 2; i < max; i++) if (num%i == 0) return false return true } var editor = ace.edit("editor", { value }) var annotations = {} editor.on("change", updateAnnotations) function updateAnnotations() { clearAnnotations() editor.session.doc.getAllLines().forEach(function(line, lineNumber) { var num = parseInt(line) if (isPrime(num)) { if (isPrime(num - 2) || isPrime(num + 2)) text = " is a twin prime" else text = " is a prime" annotations[lineNumber] = {text} } }) } function clearAnnotations() { for (var i in annotations) { if (annotations[i]?.element) annotations[i].element.remove() } annotations = {} } var dom = ace.require("ace/lib/dom") function renderAnnotations() { editor.renderer.$textLayer.$lines.cells.forEach(function(cell) { if (annotations[cell.row]) { if (!annotations[cell.row].element) annotations[cell.row].element = dom.buildDom(["span", {style: "color:red"}, annotations[cell.row].text]) cell.element.append(annotations[cell.row].element) } }) } editor.renderer.on("afterRender", renderAnnotations) updateAnnotations() editor.renderer.updateText() <script src=https://ajaxorg.github.io/ace-builds/src/ace.js></script> <div id="editor" style="height: 200px"></div>
·
Juan Pablo Isaza
Report
Answer question