From c70657ca071226195add9f4402ee22e96f92771b Mon Sep 17 00:00:00 2001 From: jhn27 Date: Fri, 26 Jan 2024 12:12:50 +1300 Subject: [PATCH] fix: Regular Expression Search interactive doesn't show syntax highlighting --- .../js/regular-expression-search.js | 88 +++++++++---------- 1 file changed, 44 insertions(+), 44 deletions(-) diff --git a/csfieldguide/static/interactives/regular-expression-search/js/regular-expression-search.js b/csfieldguide/static/interactives/regular-expression-search/js/regular-expression-search.js index cfe905d9a1..d79f4ea082 100644 --- a/csfieldguide/static/interactives/regular-expression-search/js/regular-expression-search.js +++ b/csfieldguide/static/interactives/regular-expression-search/js/regular-expression-search.js @@ -1,63 +1,63 @@ // Regular expression search using CodeMirrors // Author: Jack Morgan -var urlParameters = require('../../../js/third-party/url-parameters.js'); +const urlParameters = require('../../../js/third-party/url-parameters.js'); const CodeMirror = require('codemirror'); -RegularExpressionSearch = {}; - -$(document).ready(function () { +// Add RegEx syntax highlighting mode to Codemirror +const _ = require('../../../js/codemirror-mode-regex.js'); - // Save URL parameters (undefined if not available) - var starting_regex = urlParameters.getUrlParameter('regex'); - var starting_text = urlParameters.getUrlParameter('text'); - var reference = urlParameters.getUrlParameter('reference'); +RegularExpressionSearch = {}; - // Create regex CodeMirror - RegularExpressionSearch.regex = CodeMirror(document.getElementById('interactive-regular-expression-search-regex'),{ - value: "", - mode: "regex", - scrollbarStyle: "null" - }); +// Save URL parameters (undefined if not available) +var starting_regex = urlParameters.getUrlParameter('regex'); +var starting_text = urlParameters.getUrlParameter('text'); +var reference = urlParameters.getUrlParameter('reference'); - // Create search text CodeMirror - RegularExpressionSearch.search_text = CodeMirror.fromTextArea(document.getElementById('interactive-regular-expression-search-text'),{ - mode: "text" - }); +// Create regex CodeMirror +RegularExpressionSearch.regex = CodeMirror(document.getElementById('interactive-regular-expression-search-regex'),{ + value: "", + mode: "regex", + scrollbarStyle: "null" +}); - // If regex box is changed - RegularExpressionSearch.regex.on("change", function(){ - processRegularExpression(); +// Create search text CodeMirror +RegularExpressionSearch.search_text = CodeMirror.fromTextArea(document.getElementById('interactive-regular-expression-search-text'),{ + mode: "text" }); - // If text box is changed - RegularExpressionSearch.search_text.on("change", function() { - processRegularExpression(); - }); +// If regex box is changed +RegularExpressionSearch.regex.on("change", function(){ + processRegularExpression(); +}); - // Prevent new lines occuring in regex - RegularExpressionSearch.regex.on("beforeChange", function(cm, change) { - var newtext = change.text.join("").replace(/\n/g, ""); - if (change.update) { - change.update(change.from, change.to, [newtext]); - } - }); +// If text box is changed +RegularExpressionSearch.search_text.on("change", function() { + processRegularExpression(); +}); - // Process any given URL parameters - if (starting_regex) { - RegularExpressionSearch.regex.setValue(decodeURI(starting_regex)); - } - if (starting_text) { - RegularExpressionSearch.search_text.setValue(decodeURI(starting_text)); - } - if (reference == 'true') { - $('#quick-reference').collapse('show'); +// Prevent new lines occuring in regex +RegularExpressionSearch.regex.on("beforeChange", function(cm, change) { + var newtext = change.text.join("").replace(/\n/g, ""); + if (change.update) { + change.update(change.from, change.to, [newtext]); } - - // Highlight inital regular expression - processRegularExpression(); }); +// Process any given URL parameters +if (starting_regex) { + RegularExpressionSearch.regex.setValue(decodeURI(starting_regex)); +} +if (starting_text) { + RegularExpressionSearch.search_text.setValue(decodeURI(starting_text)); +} +if (reference == 'true') { + $('#quick-reference').collapse('show'); +} + +// Highlight inital regular expression +processRegularExpression(); + // Find and highlight regex matches function processRegularExpression() {