From 984e612290dc00787c28e7839bed61010663b2f9 Mon Sep 17 00:00:00 2001 From: max-jeronimo Date: Mon, 8 Sep 2025 17:04:34 -0400 Subject: [PATCH 1/2] finished 1 and 2, started 3 --- public/index.html | 10 +++++++++ public/js/main.js | 57 +++++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 67 insertions(+) create mode 100644 public/index.html create mode 100644 public/js/main.js diff --git a/public/index.html b/public/index.html new file mode 100644 index 0000000..3e84245 --- /dev/null +++ b/public/index.html @@ -0,0 +1,10 @@ + + + + + CS 4241 In Class Exercise 2 + + + + + \ No newline at end of file diff --git a/public/js/main.js b/public/js/main.js new file mode 100644 index 0000000..d57e80d --- /dev/null +++ b/public/js/main.js @@ -0,0 +1,57 @@ +// Exercise 1: + +const Artist = { + speak: function(){ + console.log("I am an Artist") + } +} + +const x = Math.floor(Math.random() * 256) +const y = Math.floor(Math.random() * 256) +const z = Math.floor(Math.random() * 256) + +const Painter = Object.create(Artist); +Painter.paint= function (){ // https://www.w3resource.com/javascript-exercises/javascript-math-exercise-40.php + var background = "rgb(" + x + "," + y + "," + z + ")"; + console.log(background); + document.body.style.backgroundColor = background; +} + +Artist.speak(); +Painter.speak(); +Painter.paint(); // Run the HTML, it changes the background there. + +// Exercise 2 + +for (let i = 0; i < 20; i++) { + const block = document.createElement("div") + + const r = Math.floor(Math.random() * 256) + const g = Math.floor(Math.random() * 256) + const b = Math.floor(Math.random() * 256) + + while (r === g && g === b) { + let r = Math.floor(Math.random() * 256) + let g = Math.floor(Math.random() * 256) + let b = Math.floor(Math.random() * 256) + } + + block.style.backgroundColor = `rgb(${r}, ${g}, ${b})`; + + block.style.width = '50px'; + block.style.height = '50px'; + block.style.display = 'inline-block'; + block.style.margin = '5px'; + + document.body.appendChild(block); +} + +// Exercise 3: + +const input = document.createElement('input'); +document.body.appendChild(input); + + + + + From 3541f74544478c2012a6a166580e04ce7525a738 Mon Sep 17 00:00:00 2001 From: max-jeronimo Date: Mon, 8 Sep 2025 19:47:10 -0400 Subject: [PATCH 2/2] finished 3 and 4 --- public/js/main.js | 41 +++++++++++++++++++++++++++++++++++------ 1 file changed, 35 insertions(+), 6 deletions(-) diff --git a/public/js/main.js b/public/js/main.js index d57e80d..692e305 100644 --- a/public/js/main.js +++ b/public/js/main.js @@ -30,12 +30,6 @@ for (let i = 0; i < 20; i++) { const g = Math.floor(Math.random() * 256) const b = Math.floor(Math.random() * 256) - while (r === g && g === b) { - let r = Math.floor(Math.random() * 256) - let g = Math.floor(Math.random() * 256) - let b = Math.floor(Math.random() * 256) - } - block.style.backgroundColor = `rgb(${r}, ${g}, ${b})`; block.style.width = '50px'; @@ -51,6 +45,41 @@ for (let i = 0; i < 20; i++) { const input = document.createElement('input'); document.body.appendChild(input); +input.addEventListener('input', function() { + const letter = input.value; + + if (letter) { + const h1 = document.createElement("h1") + h1.textContent = letter; + document.body.appendChild(h1); + + input.value= ''; + } +}); + + +// Exercise 4: + +const button = document.createElement('button'); +button.textContent = "click"; +button.addEventListener('click', function() { + clickNewButton(); + button.remove(); +}) +document.body.appendChild(button); + +function clickNewButton() { + const newButton = document.createElement("button"); + newButton.textContent = `try again ${Math.random().toString(36).substring(7)}`; + document.body.appendChild(newButton); + + newButton.addEventListener("click", function() { + clickNewButton(); + newButton.remove(); + }); +} + +