35 lines
1.1 KiB
JavaScript
35 lines
1.1 KiB
JavaScript
|
class AsciiScanner {
|
||
|
static ASCII_REGEX = /([\u{00e1}-\u{FFFF}]+)/gu;
|
||
|
constructor(inputElement, matchesOutput, textOutput) {
|
||
|
this.inputElement = inputElement;
|
||
|
this.matchesOutput = matchesOutput;
|
||
|
this.textOutput = textOutput;
|
||
|
}
|
||
|
|
||
|
start() {
|
||
|
this.inputElement.addEventListener('input', (event) => {
|
||
|
const text = event.target.value;
|
||
|
this.onTextChange(text);
|
||
|
})
|
||
|
}
|
||
|
|
||
|
onTextChange(newText) {
|
||
|
const output = newText.replace(AsciiScanner.ASCII_REGEX, (match) => {
|
||
|
return `<span class='invalid'>${match}</span>`;
|
||
|
});
|
||
|
this.textOutput.innerHTML = output;
|
||
|
|
||
|
const errors = ((newText || '').match(AsciiScanner.ASCII_REGEX) || []).length;
|
||
|
this.matchesOutput.innerHTML = `Found: ${errors} non-ASCII blocks`
|
||
|
}
|
||
|
}
|
||
|
|
||
|
window.onload = function() {
|
||
|
const scanner = new AsciiScanner(
|
||
|
document.getElementById('text-input'),
|
||
|
document.getElementById('matches-output'),
|
||
|
document.getElementById('text-output'));
|
||
|
|
||
|
scanner.start();
|
||
|
}
|