diff options
author | Miodec <[email protected]> | 2024-10-15 18:24:38 +0200 |
---|---|---|
committer | Miodec <[email protected]> | 2024-10-15 18:25:06 +0200 |
commit | 2ffa2ba33ecd49659832b8209245ed0b5151e7f0 (patch) | |
tree | 3e20ba6c6e0316294a20e97177c6faf813fd022c | |
parent | 31d1d51d6eafabe5329cab7d44185e8281d3a2cb (diff) | |
download | monkeytype-2ffa2ba33ecd49659832b8209245ed0b5151e7f0.tar.gz monkeytype-2ffa2ba33ecd49659832b8209245ed0b5151e7f0.zip |
impr(custom text): add option to not remove zero width characters
closes #5919
-rw-r--r-- | frontend/src/html/popups.html | 14 | ||||
-rw-r--r-- | frontend/src/styles/popups.scss | 2 | ||||
-rw-r--r-- | frontend/src/ts/modals/custom-text.ts | 25 |
3 files changed, 38 insertions, 3 deletions
diff --git a/frontend/src/html/popups.html b/frontend/src/html/popups.html index ef9f5bedf..4d2eb6e5b 100644 --- a/frontend/src/html/popups.html +++ b/frontend/src/html/popups.html @@ -569,6 +569,20 @@ </div> </div> + <div class="group" data-id="zeroWidth"> + <div class="title"> + <i class="fas fa-fw fa-text-width"></i> + Remove zero-width characters + </div> + <div class="sub">Fully remove zero-width characters.</div> + <div class="groupInputs"> + <div class="buttonGroup"> + <button value="false">no</button> + <button value="true">yes</button> + </div> + </div> + </div> + <div class="group" data-id="fancy"> <div class="title"> <i class="fas fa-fw fa-pen-fancy"></i> diff --git a/frontend/src/styles/popups.scss b/frontend/src/styles/popups.scss index 2bfbe2251..ef0403dba 100644 --- a/frontend/src/styles/popups.scss +++ b/frontend/src/styles/popups.scss @@ -193,7 +193,7 @@ body.darkMode { width: 100%; border-radius: var(--roundness); resize: vertical; - min-height: 477px; + min-height: 589px; color: var(--text-color); overflow-x: hidden; overflow-y: scroll; diff --git a/frontend/src/ts/modals/custom-text.ts b/frontend/src/ts/modals/custom-text.ts index 3b3475399..2c84b4541 100644 --- a/frontend/src/ts/modals/custom-text.ts +++ b/frontend/src/ts/modals/custom-text.ts @@ -29,6 +29,7 @@ type State = { replaceControlCharactersEnabled: boolean; customTextPipeDelimiter: boolean; replaceNewlines: "off" | "space" | "periodSpace"; + removeZeroWidthCharactersEnabled: boolean; }; const state: State = { @@ -47,6 +48,7 @@ const state: State = { replaceControlCharactersEnabled: true, customTextPipeDelimiter: false, replaceNewlines: "off", + removeZeroWidthCharactersEnabled: true, }; function updateUI(): void { @@ -115,6 +117,13 @@ function updateUI(): void { `${popup} .inputs .group[data-id="control"] button[value="${state.replaceControlCharactersEnabled}"]` ).addClass("active"); + $(`${popup} .inputs .group[data-id="zeroWidth"] button`).removeClass( + "active" + ); + $( + `${popup} .inputs .group[data-id="zeroWidth"] button[value="${state.removeZeroWidthCharactersEnabled}"]` + ).addClass("active"); + $(`${popup} .inputs .group[data-id="delimiter"] button`).removeClass( "active" ); @@ -264,8 +273,10 @@ function cleanUpText(): string[] { //replace any characters that look like a space with an actual space text = text.replace(/[\u2000-\u200A\u202F\u205F\u00A0]/g, " "); - //replace zero width characters - text = text.replace(/[\u200B-\u200D\u2060\uFEFF]/g, ""); + if (state.removeZeroWidthCharactersEnabled) { + //replace zero width characters + text = text.replace(/[\u200B-\u200D\u2060\uFEFF]/g, ""); + } if (state.replaceControlCharactersEnabled) { text = text.replace(/([^\\]|^)\\t/gm, "$1\t"); @@ -427,6 +438,16 @@ async function setup(modalEl: HTMLElement): Promise<void> { } for (const button of modalEl.querySelectorAll( + ".group[data-id='zeroWidth'] button" + )) { + button.addEventListener("click", (e) => { + state.removeZeroWidthCharactersEnabled = + (e.target as HTMLButtonElement).value === "true" ? true : false; + updateUI(); + }); + } + + for (const button of modalEl.querySelectorAll( ".group[data-id='delimiter'] button" )) { button.addEventListener("click", (e) => { |