DWS/hadrian
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: styling bug in code / textarea

Browse Source
This commit is contained in:
joncrangle
2023-12-10 00:23:24 -05:00
parent 1e41e6f2b0
commit 6effb51da6
1 changed files with 9 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
handlers/playground-script.js
View File

@@ -1,5 +1,3 @@
// TODO: Fix pre/code block styling fix when existing values are present
const modifierContainer = document.getElementById("modifierContainer"); const modifierContainer = document.getElementById("modifierContainer");
const modalContainer = document.getElementById("modalContainer"); const modalContainer = document.getElementById("modalContainer");
const modalBody = document.getElementById("modal-body"); const modalBody = document.getElementById("modal-body");
@@ -119,9 +117,9 @@ document.getElementById("inputForm").addEventListener("submit", function (e) {
}); });
if (navigator.userAgent.includes("Mac")) { if (navigator.userAgent.includes("Mac")) {
document.getElementById("ninjaKey").innerHTML = "⌘"; document.getElementById("ninjaKey").textContent = "⌘";
} else { } else {
document.getElementById("ninjaKey").innerHTML = "Ctrl"; document.getElementById("ninjaKey").textContent = "Ctrl";
} }
function downloadYaml() { function downloadYaml() {
@@ -175,7 +173,6 @@ function getValues(type, id, description, params) {
modalContent.classList.remove("relative", "h-[220px]"); modalContent.classList.remove("relative", "h-[220px]");
inputEventListeners.length = 0; inputEventListeners.length = 0;
inputs.length = 0; inputs.length = 0;
// values = [];
modalContainer.classList.add("hidden"); modalContainer.classList.add("hidden");
modalContent.innerHTML = ""; modalContent.innerHTML = "";
} }
@@ -199,8 +196,8 @@ function getValues(type, id, description, params) {
} }
} }
document.getElementById("modal-title").innerHTML = id; document.getElementById("modal-title").textContent = id;
document.getElementById("modal-description").innerHTML = description; document.getElementById("modal-description").textContent = description;
existingValues = existingValues =
payload[type].find( payload[type].find(
@@ -252,7 +249,7 @@ function getValues(type, id, description, params) {
} }
const label = document.createElement("label"); const label = document.createElement("label");
label.innerHTML = param.name; label.textContent = param.name;
label.setAttribute("for", `input-${i}`); label.setAttribute("for", `input-${i}`);
let input; let input;
if (param.name === "js") { if (param.name === "js") {
@@ -358,9 +355,12 @@ function getValues(type, id, description, params) {
"overflow-auto", "overflow-auto",
"hyphens-none" "hyphens-none"
); );
codeElement.textContent = input.value;
preElement.appendChild(codeElement); preElement.appendChild(codeElement);
modalContent.appendChild(preElement); modalContent.appendChild(preElement);
codeElement.innerHTML = input.value
.replace(new RegExp("&", "g"), "&")
.replace(new RegExp("<", "g"), "&lt;");
Prism.highlightElement(codeElement);
input.addEventListener("input", textareaEventListener); input.addEventListener("input", textareaEventListener);
input.addEventListener("keydown", textareaKeyEventListener); input.addEventListener("keydown", textareaKeyEventListener);
input.addEventListener("scroll", () => syncScroll(input)); input.addEventListener("scroll", () => syncScroll(input));