From 985dd6f4b981ea077e3dd23954a5aaac578eb724 Mon Sep 17 00:00:00 2001 From: OpSimple Date: Sat, 10 Aug 2019 04:56:35 +0530 Subject: Modified the way to apply syntax highlighting Modified the way to detect and apply syntax highlighting so that it can used along with normal text and katex at the same time, in the same message. It also contains some previous changes made by the admin(you) of the server. --- client/client.js | 80 +++++++++++++++++++++++++++++++++++++------------------- 1 file changed, 53 insertions(+), 27 deletions(-) (limited to 'client') diff --git a/client/client.js b/client/client.js index 84ad60c..7c87ec0 100644 --- a/client/client.js +++ b/client/client.js @@ -33,7 +33,7 @@ var frontpage = [ "Formatting:", "Whitespace is preserved, so source code can be pasted verbatim.", "Surround LaTeX with a dollar sign for inline style $\\zeta(2) = \\pi^2/6$, and two dollars for display. $$\\int_0^1 \\int_0^1 \\frac{1}{1-xy} dx dy = \\frac{\\pi^2}{6}$$", - "For syntax highlight, the first line of the code block must begin with # where can be html, js or any known format.", + "For syntax highlight, wrap the code like: ``` ``` where is any known programming language.", "", "Current Github: https://github.com/hack-chat", "Legacy GitHub: https://github.com/AndrewBelt/hack.chat", @@ -368,33 +368,38 @@ function pushMessage(args) { var textEl = document.createElement('pre'); textEl.classList.add('text'); - textEl.textContent = args.text || ''; - textEl.innerHTML = textEl.innerHTML.replace(/(\?|https?:\/\/)\S+?(?=[,.!?:)]?\s|$)/g, parseLinks); - - if ($('#syntax-highlight').checked && textEl.textContent.indexOf('#') == 0) { - var lang = textEl.textContent.split(/\s+/g)[0].replace('#', ''); - var codeEl = document.createElement('code'); - codeEl.classList.add(lang); - var content = textEl.textContent.replace('#' + lang, ''); - codeEl.textContent = content.trim(); - hljs.highlightBlock(codeEl); - textEl.innerHTML = ''; - textEl.appendChild(codeEl); - } else if ($('#parse-latex').checked) { - // Temporary hotfix for \rule spamming, see https://github.com/Khan/KaTeX/issues/109 - textEl.innerHTML = textEl.innerHTML.replace(/\\rule|\\\\\s*\[.*?\]/g, ''); - try { - renderMathInElement(textEl, { - delimiters: [ - { left: "$$", right: "$$", display: true }, - { left: "$", right: "$", display: false }, - ] - }) - } catch (e) { - console.warn(e); - } + textEl.textContent = args.text || ''; + + if($('#syntax-highlight').checked && textEl.textContent.includes('```')) { + var textParts = textEl.textContent.split('```'); + var ignore = 0; + textEl.innerHTML = ''; + for(var i=0; i< textParts.length; i++) { + if(i==ignore) { + textEl.innerHTML += parseLatex(textParts[i]); + continue; + } + var lang = textParts[i].split(/\s+/g)[0]; + if(lang == '') { + textEl.innerHTML += parseLatex('```' + textParts[i]); + continue; + } + + var codeEl = document.createElement('code'); + codeEl.classList.add(lang); + codeEl.textContent = textParts[i].replace(lang, '').trim(); + hljs.highlightBlock(codeEl); + + textEl.innerHTML += codeEl.outerHTML.toString(); + ignore = i+1; + } + } else { + var parsed = parseLatex(textEl.textContent); + if(parsed != null) + textEl.innerHTML = parsed; } - + textEl.innerHTML = textEl.innerHTML.replace(/(\?|https?:\/\/)\S+?(?=[,.!?:)]?\s|$)/g, parseLinks); + messageEl.appendChild(textEl); // Scroll to bottom @@ -408,6 +413,27 @@ function pushMessage(args) { updateTitle(); } +function parseLatex(str) { + if ($('#parse-latex').checked) { + // Temporary hotfix for \rule spamming, see https://github.com/Khan/KaTeX/issues/109 + str = str.replace(/\\rule|\\\\\s*\[.*?\]/g, ''); + var holEl = document.createElement('p'); + holEl.innerHTML = str; + try { + renderMathInElement(holEl, { + delimiters: [ + { left: "$$", right: "$$", display: true }, + { left: "$", right: "$", display: false }, + ] + }); + return holEl.innerHTML.toString(); + } catch (e) { + console.warn(e); + } + } + return null; +} + function insertAtCursor(text) { var input = $('#chatinput'); var start = input.selectionStart || 0; -- cgit v1.2.1