From 5007c4b2e7454bed90a8cb18e7332329a4f67932 Mon Sep 17 00:00:00 2001 From: asaniDev Date: Thu, 30 Oct 2025 01:35:50 +0000 Subject: [PATCH 1/6] added all tests to test, started mean.js but not finished --- prep/mean.js | 18 ++++++++++++++++++ prep/mean.test.js | 22 ++++++++++++++++++++++ prep/package.json | 16 ++++++++++++++++ 3 files changed, 56 insertions(+) create mode 100644 prep/mean.js create mode 100644 prep/mean.test.js create mode 100644 prep/package.json diff --git a/prep/mean.js b/prep/mean.js new file mode 100644 index 000000000..31f463f9c --- /dev/null +++ b/prep/mean.js @@ -0,0 +1,18 @@ +//a data structure is used to group data together. it is a collection of data which has functions which allow you to access and manipulate the data. +//an array is a zero indexed collection of data that holds data in an ordered list. +function calculateMean(list) { + let total = 0; + + for (const item of list) { + total += item; + } +} + +function calculateMedian(list) { + const middleIndex = Math.floor(list.length / 2); + const median = list.splice(middleIndex, 1)[0]; + + return median; +} + +calculateMean([10, 20, 30, 40, 50]); diff --git a/prep/mean.test.js b/prep/mean.test.js new file mode 100644 index 000000000..386732522 --- /dev/null +++ b/prep/mean.test.js @@ -0,0 +1,22 @@ +test("calculates the mean of a list of numbers", () => { + const list = [3, 50, 7]; + const currentOutput = calculateMean(list); + const targetOutput = 20; + + expect(currentOutput).toEqual(targetOutput); +}); + +test("calculates the median of a list of odd length", () => { + const list = [10, 20, 30, 50, 60]; + const currentOutput = calculateMedian(list); + const targetOutput = 30; + + expect(currentOutput).toEqual(targetOutput); +}); + +test("doesn't modify the input", () => { + const list = [1, 2, 3]; + calculateMedian(list); + + expect(list).toEqual([1, 2, 3]); // Note that the toEqual matcher checks the values inside arrays when comparing them - it doesn't use `===` on the arrays, we know that would always evaluate to false. +}); diff --git a/prep/package.json b/prep/package.json new file mode 100644 index 000000000..2301e1638 --- /dev/null +++ b/prep/package.json @@ -0,0 +1,16 @@ +{ + "name": "prep", + "version": "1.0.0", + "description": "", + "main": "mean.js", + "scripts": { + "test": "jest" + }, + "keywords": [], + "author": "", + "license": "ISC", + "type": "commonjs", + "devDependencies": { + "jest": "^30.2.0" + } +} From 9a085155d5442f071f141120be19140c57d68368 Mon Sep 17 00:00:00 2001 From: asaniDev Date: Mon, 8 Dec 2025 11:28:55 +0000 Subject: [PATCH 2/6] changed title of index file to quote generator app, created basic plan for app --- Sprint-3/quote-generator/index.html | 2 +- Sprint-3/quote-generator/quotes.js | 19 +++++++++++++++++++ Sprint-3/quote-generator/readme.md | 17 +++++++++++++++++ 3 files changed, 37 insertions(+), 1 deletion(-) diff --git a/Sprint-3/quote-generator/index.html b/Sprint-3/quote-generator/index.html index 30b434bcf..0cf139636 100644 --- a/Sprint-3/quote-generator/index.html +++ b/Sprint-3/quote-generator/index.html @@ -3,7 +3,7 @@ - Title here + Quote Generator App diff --git a/Sprint-3/quote-generator/quotes.js b/Sprint-3/quote-generator/quotes.js index 4a4d04b72..907b4d58e 100644 --- a/Sprint-3/quote-generator/quotes.js +++ b/Sprint-3/quote-generator/quotes.js @@ -20,6 +20,25 @@ function pickFromArray(choices) { return choices[Math.floor(Math.random() * choices.length)]; } +/** +- onload get random quote from array + - get the length of the array + - generate random number between 0 and last index of array + - use number to fetch quote from array and store in variable randomQuote +- display quote + - display quote stored in randomQuote +- display author associated with quote + +- when button clicked + - get random quote from array + - get the length of the array + - generate random number between 0 and last index of array + - use number to fetch quote from array and store in variable randomQuote +- display quote + - display quote stored in randomQuote +- display author associated with quote + */ + // A list of quotes you can use in your app. // DO NOT modify this array, otherwise the tests may break! const quotes = [ diff --git a/Sprint-3/quote-generator/readme.md b/Sprint-3/quote-generator/readme.md index 868291958..b521dc17d 100644 --- a/Sprint-3/quote-generator/readme.md +++ b/Sprint-3/quote-generator/readme.md @@ -10,8 +10,25 @@ First off, once you've branched off `main`, then update the title element in `in When the page loads it should show a random quote from the `quotes` array on the screen. It should also show who said the quote. +- onload get random quote from array + - get the length of the array + - generate random number between 0 and last index of array + - use number to fetch quote from array and store in variable randomQuote +- display quote + - display quote stored in randomQuote +- display author associated with quote + When you click a button on the screen it should change the quote on the screen. +- when button clicked + - get random quote from array + - get the length of the array + - generate random number between 0 and last index of array + - use number to fetch quote from array and store in variable randomQuote +- display quote + - display quote stored in randomQuote +- display author associated with quote + It can look however you like but there is an example in this folder at `quote_generator_example.png` ## Need Help? From fc7b1139dd49f539424f8900c43e9f8aaf612736 Mon Sep 17 00:00:00 2001 From: asaniDev Date: Mon, 8 Dec 2025 13:52:28 +0000 Subject: [PATCH 3/6] created function to diplay random quote on load and generate a quote when a button is clicked --- Sprint-3/quote-generator/quotes.js | 54 ++++++++++++++++++++---------- 1 file changed, 36 insertions(+), 18 deletions(-) diff --git a/Sprint-3/quote-generator/quotes.js b/Sprint-3/quote-generator/quotes.js index 907b4d58e..23817060c 100644 --- a/Sprint-3/quote-generator/quotes.js +++ b/Sprint-3/quote-generator/quotes.js @@ -1,25 +1,22 @@ -// DO NOT EDIT BELOW HERE +function displayQuote() { + const firstQuote = pickFromArray(quotes); + const initialQuote = document.querySelector("#quote"); + initialQuote.innerText = firstQuote.quote; -// pickFromArray is a function which will return one item, at -// random, from the given array. -// -// Parameters -// ---------- -// choices: an array of items to pick from. -// -// Returns -// ------- -// One item at random from the given array. -// -// Examples of use -// --------------- -// pickFromArray(['a','b','c','d']) // maybe returns 'c' + const author = document.querySelector("#author"); + author.innerText = firstQuote.author; +} -// You don't need to change this function -function pickFromArray(choices) { - return choices[Math.floor(Math.random() * choices.length)]; +function generateQuote() { + displayQuote(); + + document.querySelector("#new-quote").addEventListener("click", () => { + displayQuote(); + }); } +window.onload = generateQuote; + /** - onload get random quote from array - get the length of the array @@ -38,6 +35,27 @@ function pickFromArray(choices) { - display quote stored in randomQuote - display author associated with quote */ +// DO NOT EDIT BELOW HERE + +// pickFromArray is a function which will return one item, at +// random, from the given array. +// +// Parameters +// ---------- +// choices: an array of items to pick from. +// +// Returns +// ------- +// One item at random from the given array. +// +// Examples of use +// --------------- +// pickFromArray(['a','b','c','d']) // maybe returns 'c' + +// You don't need to change this function +function pickFromArray(choices) { + return choices[Math.floor(Math.random() * choices.length)]; +} // A list of quotes you can use in your app. // DO NOT modify this array, otherwise the tests may break! From 292d419ef66915772c52527930e06ef9f78d5f51 Mon Sep 17 00:00:00 2001 From: asaniDev Date: Mon, 8 Dec 2025 14:50:48 +0000 Subject: [PATCH 4/6] added some style and an element to better position the quote generator --- Sprint-3/quote-generator/index.html | 17 ++++++--- Sprint-3/quote-generator/style.css | 53 +++++++++++++++++++++++++++++ 2 files changed, 66 insertions(+), 4 deletions(-) diff --git a/Sprint-3/quote-generator/index.html b/Sprint-3/quote-generator/index.html index 0cf139636..01f83e188 100644 --- a/Sprint-3/quote-generator/index.html +++ b/Sprint-3/quote-generator/index.html @@ -3,13 +3,22 @@ + + + + Quote Generator App -

hello there

-

-

- +
+

Quote of the day

+

+

+ +
diff --git a/Sprint-3/quote-generator/style.css b/Sprint-3/quote-generator/style.css index 63cedf2d2..4f35347c8 100644 --- a/Sprint-3/quote-generator/style.css +++ b/Sprint-3/quote-generator/style.css @@ -1 +1,54 @@ /** Write your CSS in here **/ +body { + font-family: "Roboto", sans-serif; + text-align: center; + margin: 50px; + color: #222843; + background-color: #5372ef; +} + +#card { + background-color: #ffffff; + border-radius: 10px; + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); + padding: 20px; + max-width: 600px; + margin: auto; +} + +#quote { + font-size: 1.5rem; + margin-bottom: 10px; + padding: 0 2rem; +} + +#quote::before, +#quote::after { + content: '"'; + font-size: 1.5rem; +} + +#author { + font-style: italic; + margin-top: 10px; + margin-bottom: 2rem; + padding-right: 2rem; + padding-bottom: 1.5rem; + color: #555555; + text-align: right; + border-bottom: #e8e8e8 1px solid; +} + +#author::before { + content: "— "; +} + +#new-quote { + background-color: #5372ef; + color: white; + border: none; + padding: 10px 20px; + border-radius: 25px; + cursor: pointer; + font-size: 16px; +} From 43b2cdb5d4df3889e27be6830ee77442e5dfc873 Mon Sep 17 00:00:00 2001 From: asaniDev Date: Mon, 8 Dec 2025 14:52:14 +0000 Subject: [PATCH 5/6] removed steps outline --- Sprint-3/quote-generator/quotes.js | 18 ------------------ 1 file changed, 18 deletions(-) diff --git a/Sprint-3/quote-generator/quotes.js b/Sprint-3/quote-generator/quotes.js index 23817060c..e1ddb072e 100644 --- a/Sprint-3/quote-generator/quotes.js +++ b/Sprint-3/quote-generator/quotes.js @@ -17,24 +17,6 @@ function generateQuote() { window.onload = generateQuote; -/** -- onload get random quote from array - - get the length of the array - - generate random number between 0 and last index of array - - use number to fetch quote from array and store in variable randomQuote -- display quote - - display quote stored in randomQuote -- display author associated with quote - -- when button clicked - - get random quote from array - - get the length of the array - - generate random number between 0 and last index of array - - use number to fetch quote from array and store in variable randomQuote -- display quote - - display quote stored in randomQuote -- display author associated with quote - */ // DO NOT EDIT BELOW HERE // pickFromArray is a function which will return one item, at From 5d530fba4cfc41d3fb2d9201fbd33268cdd12ef9 Mon Sep 17 00:00:00 2001 From: asaniDev Date: Mon, 8 Dec 2025 15:08:10 +0000 Subject: [PATCH 6/6] reverted unrelated changes --- prep/mean.js | 18 ------------------ prep/mean.test.js | 22 ---------------------- prep/package.json | 16 ---------------- 3 files changed, 56 deletions(-) delete mode 100644 prep/mean.js delete mode 100644 prep/mean.test.js delete mode 100644 prep/package.json diff --git a/prep/mean.js b/prep/mean.js deleted file mode 100644 index 31f463f9c..000000000 --- a/prep/mean.js +++ /dev/null @@ -1,18 +0,0 @@ -//a data structure is used to group data together. it is a collection of data which has functions which allow you to access and manipulate the data. -//an array is a zero indexed collection of data that holds data in an ordered list. -function calculateMean(list) { - let total = 0; - - for (const item of list) { - total += item; - } -} - -function calculateMedian(list) { - const middleIndex = Math.floor(list.length / 2); - const median = list.splice(middleIndex, 1)[0]; - - return median; -} - -calculateMean([10, 20, 30, 40, 50]); diff --git a/prep/mean.test.js b/prep/mean.test.js deleted file mode 100644 index 386732522..000000000 --- a/prep/mean.test.js +++ /dev/null @@ -1,22 +0,0 @@ -test("calculates the mean of a list of numbers", () => { - const list = [3, 50, 7]; - const currentOutput = calculateMean(list); - const targetOutput = 20; - - expect(currentOutput).toEqual(targetOutput); -}); - -test("calculates the median of a list of odd length", () => { - const list = [10, 20, 30, 50, 60]; - const currentOutput = calculateMedian(list); - const targetOutput = 30; - - expect(currentOutput).toEqual(targetOutput); -}); - -test("doesn't modify the input", () => { - const list = [1, 2, 3]; - calculateMedian(list); - - expect(list).toEqual([1, 2, 3]); // Note that the toEqual matcher checks the values inside arrays when comparing them - it doesn't use `===` on the arrays, we know that would always evaluate to false. -}); diff --git a/prep/package.json b/prep/package.json deleted file mode 100644 index 2301e1638..000000000 --- a/prep/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "prep", - "version": "1.0.0", - "description": "", - "main": "mean.js", - "scripts": { - "test": "jest" - }, - "keywords": [], - "author": "", - "license": "ISC", - "type": "commonjs", - "devDependencies": { - "jest": "^30.2.0" - } -}