From d63d1f415df392934f9e5191c9ae24f5a38adf9e Mon Sep 17 00:00:00 2001 From: Dolsy Smith Date: Mon, 9 Sep 2024 12:50:16 -0400 Subject: [PATCH] Toggle text --- docs/text-as-data.html | 10 +++++++--- docs/text_swap.css | 4 ++-- docs/text_swap.js | 27 ++++++++++++++++++--------- 3 files changed, 27 insertions(+), 14 deletions(-) diff --git a/docs/text-as-data.html b/docs/text-as-data.html index 6ecf39e..4c97cd0 100644 --- a/docs/text-as-data.html +++ b/docs/text-as-data.html @@ -5,7 +5,11 @@

Text vs. Tokens

-

What would you say that the following text is about?

-
+

The following text has been tokenized, and the tokens are presented in alphabetical order (exclusing punctuation). What would you say that the text is about?

+
+

Now review the original text. How close was your original guess?

+
+

Click here to show the text.

+
- + \ No newline at end of file diff --git a/docs/text_swap.css b/docs/text_swap.css index 865f862..1cd2407 100644 --- a/docs/text_swap.css +++ b/docs/text_swap.css @@ -6,10 +6,10 @@ h2 { font-weight: lighter; } -#text { +#text, #tokens { padding-left: 25px; padding-right: 25px; font-size: 1.25em; text-align: justify; font-family: sans-serif; -} \ No newline at end of file +} diff --git a/docs/text_swap.js b/docs/text_swap.js index fd7f739..06ba009 100644 --- a/docs/text_swap.js +++ b/docs/text_swap.js @@ -7,15 +7,24 @@ TOKENIZED_TEXT = ` African African African An Business CCDL Center Cissé Cissé Cyber Diplomacy GW GWSB GWSB GWSB Leadership Pape School a about academic adjunct advances against aiming aims also ambassadors an and and and and and and and and and announced as between cofounder community conferences connects cyber cyberattacks cybersecurity cybersecurity cybersecurity defend diplomacy during education enhance for government heads help help include information last leaders leaders leaders members ministers month of of of of of officials opportunity organization partnership partnership partnership policy policymaking practices prepare problems professor providing rapidly real said said seminars shape solve state students technology technology that the the the the the the the to to to to understanding while will with with world year ` -function randomDisplay() { - let randIndex = Math.floor(Math.random() * (2 - 0) + 0); - let displayText = [TEXT, TOKENIZED_TEXT][randIndex]; +function createP(text, div) { + let p = document.createElement('p'); + p.innerHTML = text; + div.appendChild(p); +} + +function addText(e) { + let textDiv = document.getElementById('text'); + textDiv.innerHTML = ""; + TEXT.split('\n\n').forEach(paragraph => createP(paragraph, textDiv)); + textDiv.removeEventListener("click", addText); +} + +function textDisplay() { + let tokensDiv = document.getElementById('tokens'); + createP(TOKENIZED_TEXT, tokensDiv) let textDiv = document.getElementById('text'); - displayText.split('\n\n').forEach(paragraph => { - let p = document.createElement('p'); - p.innerHTML = paragraph; - textDiv.appendChild(p); - }); + textDiv.addEventListener("click", addText); } -window.onload = randomDisplay; \ No newline at end of file +window.onload = textDisplay; \ No newline at end of file