From bcc2e9dcc3e56493c71b849ec243726695bf8f51 Mon Sep 17 00:00:00 2001 From: TEldridge Date: Mon, 20 Jul 2020 17:46:29 -0500 Subject: [PATCH 1/2] made elements with js --- gui.js | 41 +++++++++++++++++++++++++++++++++++++++++ index.html | 11 +++++------ main.js | 33 ++++++++++++++++++++++++++++++--- 3 files changed, 76 insertions(+), 9 deletions(-) create mode 100644 gui.js diff --git a/gui.js b/gui.js new file mode 100644 index 00000000..16fbaa75 --- /dev/null +++ b/gui.js @@ -0,0 +1,41 @@ +// create onload input +let word = "" +window.onload = () => { +let textInput = document.createElement("INPUT") +let translateButton = document.createElement("BUTTON") +let translationText = document.createElement("DIV") +// console.log(, button, div) + + +textInput.addEventListener("keyup", storeInput) +translateButton.innerText = "Translate" +translateButton.addEventListener('click', pigLatin) + +document.body.appendChild(textInput); +document.body.appendChild(translateButton); +document.body.appendChild(translationText) +} + + + +const storeInput = (textInput) => { + word = textInput +} + +console.log(word) + +const pigLatin = () => { + let vowels = ['a', 'e', 'i', 'o', 'u']; + let finalWord = ""; + let cleanWord = word.toLowerCase().trim(); + + if (vowels.indexOf(cleanWord[0]) > -1) { + finalWord = cleanWord + "yay"; + return finalWord; + } else { + let firstMatch = cleanWord.match(/[aeiou]/g) || 0; + let vowelIndex = cleanWord.indexOf(firstMatch[0]); + finalWord = cleanWord.slice(vowelIndex) + cleanWord.slice(0, vowelIndex) + "ay"; + return finalWord; + } + } \ No newline at end of file diff --git a/index.html b/index.html index 8f536de8..4d17f148 100644 --- a/index.html +++ b/index.html @@ -3,13 +3,12 @@ - + -

Hello World!

-
-
- -
+

Pig Latin!

+ + + diff --git a/main.js b/main.js index 1c92f304..92395921 100644 --- a/main.js +++ b/main.js @@ -10,12 +10,39 @@ const rl = readline.createInterface({ output: process.stdout }); +let word = "" const pigLatin = (word) => { + let vowels = ['a', 'e', 'i', 'o', 'u']; + let finalWord = ""; + let cleanWord = word.toLowerCase().trim() + if (vowels.indexOf(cleanWord[0]) > -1) { + finalWord = cleanWord + "yay"; + return finalWord; + } else { + let firstMatch = cleanWord.match(/[aeiou]/g) || 0; + let vowelIndex = cleanWord.indexOf(firstMatch[0]); + finalWord = cleanWord.slice(vowelIndex) + cleanWord.slice(0, vowelIndex) + "ay"; + return finalWord; + } +} - // Your code here -} + +// for (let i = 0; i < word.length; i++){ +// for(let i=1; i Date: Fri, 24 Jul 2020 18:45:04 -0500 Subject: [PATCH 2/2] did gui stuff --- gui.js | 66 +++++++++++++++++++++++++++++++++++----------------------- 1 file changed, 40 insertions(+), 26 deletions(-) diff --git a/gui.js b/gui.js index 16fbaa75..7bf89fde 100644 --- a/gui.js +++ b/gui.js @@ -1,41 +1,55 @@ // create onload input -let word = "" -window.onload = () => { + + + + +//created elements let textInput = document.createElement("INPUT") let translateButton = document.createElement("BUTTON") let translationText = document.createElement("DIV") // console.log(, button, div) - - -textInput.addEventListener("keyup", storeInput) -translateButton.innerText = "Translate" -translateButton.addEventListener('click', pigLatin) - + document.body.appendChild(textInput); document.body.appendChild(translateButton); document.body.appendChild(translationText) + +translateButton.innerText = "Translate" + +//storing a value +const storeInput = (word) => { + textInput = word } +let word = "" +// console.log(word) +textInput.addEventListener("input", storeInput) -const storeInput = (textInput) => { - word = textInput +//run pigLatin +const pigLatin = () => { + let vowels = ['a', 'e', 'i', 'o', 'u']; + let finalWord = ""; + let cleanWord = word.toLowerCase().trim(); + + if (vowels.indexOf(cleanWord[0]) > -1) { + finalWord = cleanWord + "yay"; + return finalWord; + } else { + let firstMatch = cleanWord.match(/[aeiou]/g) || 0; + let vowelIndex = cleanWord.indexOf(firstMatch[0]); + finalWord = cleanWord.slice(vowelIndex) + cleanWord.slice(0, vowelIndex) + "ay"; + return finalWord; + } } -console.log(word) +// console.log(textInput) +//invoke with click +translateButton.addEventListener('click', pigLatin) -const pigLatin = () => { - let vowels = ['a', 'e', 'i', 'o', 'u']; - let finalWord = ""; - let cleanWord = word.toLowerCase().trim(); - - if (vowels.indexOf(cleanWord[0]) > -1) { - finalWord = cleanWord + "yay"; - return finalWord; - } else { - let firstMatch = cleanWord.match(/[aeiou]/g) || 0; - let vowelIndex = cleanWord.indexOf(firstMatch[0]); - finalWord = cleanWord.slice(vowelIndex) + cleanWord.slice(0, vowelIndex) + "ay"; - return finalWord; - } - } \ No newline at end of file +//display translations + const displayPigLatin = (finalWord) => { + let newDiv = document.createElement("P"); + newDiv.innerText = (finalWord); + document.appendChild(newDiv); + } + \ No newline at end of file