He estado siguiendo esta pregunta para ayudarme a cambiar el color de la salida en JQuery Terminal, aunque el enfoque no parece funcionar con barras invertidas.
Idealmente, me gustaría poder resaltar cierto texto en un color (es decir, rojo) mientras que el resto del texto es de un color que no sea blanco (es decir, verde azulado). El texto usa regularmente una barra invertida, lo que da como resultado un par de errores que de otro modo no existirían.
Aquí hay un ejemplo reproducible a continuación:
function highlight_all_occurences_of_x_in_text(text) { text_list = text.split(""); output_list = []; while (text_list.length > 0) { current_character = text_list.shift(); if (current_character === 'x') { output_list.push('[[gb;red;black]'); output_list.push('x'); output_list.push(']'); } else { output_list.push(current_character); } } return '[[gb;yellow;black]' + output_list.join('') + ']'; }Si tuviera que llamar a highlight_all_occurences_of_x_in_text('\text') o incluso a resaltar_all_occurences_of_x_in_text('\\text'), obtendría el resultado esperado.
Pero si llamara a highlight_all_occurences_of_x_in_text('\\x'), obtendría algo como '][[gb;red;blackx]'.
¿Cómo trato con esto?
La solución es usar
$.terminal.escape_bracketso
$.terminal.escape_formatting ambas funciones reemplazan [ ] \ con entidades HTML.
La razón por la que sucede esto es que \] es un corchete escapado y si tiene [[;yellow;]\] la terminal no cerrará el formateo y seguirá procesando el resto como parte del texto, incluso si después hay otro formateo.
function highlight_all_occurences_of_x_in_text(text) { var text_list = text.split(""); var output_list = []; while (text_list.length > 0) { current_character = text_list.shift(); if (current_character === 'x') { output_list.push('[[gb;red;black]'); output_list.push('x'); output_list.push(']'); } else { var str = $.terminal.escape_formatting(current_character); output_list.push(str); } } return '[[gb;yellow;black]' + output_list.join('') + ']'; } var term = $('body').terminal(highlight_all_occurences_of_x_in_text, { onInit() { this.echo('type any text to highlight x'); } }); :root { --size: 1.4; } <script src="https://cdn.jsdelivr.net/npm/jquery"></script> <script src="https://cdn.jsdelivr.net/npm/jquery.terminal/js/jquery.terminal.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/js-polyfills/keyboard.js"></script> <link href="https://cdn.jsdelivr.net/npm/jquery.terminal/css/jquery.terminal.css" rel="stylesheet"/>