From 61331727e36bb4223758846d27438ba2bbc969f1 Mon Sep 17 00:00:00 2001 From: Nazanin Saedi Date: Thu, 25 Apr 2024 12:56:17 +0100 Subject: [PATCH 01/14] debugcodeAnd change --- .vscode/settings.json | 3 +++ book-library/index.html | 26 ++++++++++++-------------- book-library/script.js | 37 ++++++++++++++++--------------------- book-library/style.css | 30 ++++++++++++++++++++++-------- 4 files changed, 53 insertions(+), 43 deletions(-) create mode 100644 .vscode/settings.json diff --git a/.vscode/settings.json b/.vscode/settings.json new file mode 100644 index 00000000..6f3a2913 --- /dev/null +++ b/.vscode/settings.json @@ -0,0 +1,3 @@ +{ + "liveServer.settings.port": 5501 +} \ No newline at end of file diff --git a/book-library/index.html b/book-library/index.html index 23acfa71..fe1568d4 100644 --- a/book-library/index.html +++ b/book-library/index.html @@ -1,19 +1,22 @@ - + My Book Library + + + @@ -31,7 +34,7 @@

Library

class="form-control" id="title" name="title" @@ -39,7 +42,7 @@

Library

/> class="form-control" id="author" name="author" @@ -61,12 +64,13 @@

Library

value="" />Read - class="btn btn-primary" onclick="submit();" - /> + > + Submit +
@@ -81,13 +85,7 @@

Library

- - - - - - - + diff --git a/book-library/script.js b/book-library/script.js index dc14a775..4440acaf 100644 --- a/book-library/script.js +++ b/book-library/script.js @@ -7,7 +7,7 @@ window.addEventListener("load", function (e) { function populateStorage() { if (myLibrary.length == 0) { - let book1 = new Book("Robison Crusoe", "Daniel Defoe", "252", true); + let book1 = new Book("Robinson Crusoe", "Daniel Defoe", "252", true); // Corrected book title let book2 = new Book( "The Old Man and the Sea", "Ernest Hemingway", @@ -25,20 +25,20 @@ const author = document.getElementById("author"); const pages = document.getElementById("pages"); const check = document.getElementById("check"); -//check the right input from forms and if its ok -> add the new book (object in array) -//via Book function and start render function function submit() { if ( title.value == null || title.value == "" || + author.value == null || // Check for author input + author.value == "" || pages.value == null || pages.value == "" ) { alert("Please fill all fields!"); return false; } else { - let book = new Book(title.value, title.value, pages.value, check.checked); - library.push(book); + let book = new Book(title.value, author.value, pages.value, check.checked); // Passed author.value instead of title.value + myLibrary.push(book); render(); } } @@ -53,11 +53,11 @@ function Book(title, author, pages, check) { function render() { let table = document.getElementById("display"); let rowsNumber = table.rows.length; - //delete old table - for (let n = rowsNumber - 1; n > 0; n-- { + // Delete old table rows + for (let n = rowsNumber - 1; n > 0; n--) { // Corrected the loop condition table.deleteRow(n); } - //insert updated row and cells + // Insert updated rows and cells let length = myLibrary.length; for (let i = 0; i < length; i++) { let row = table.insertRow(1); @@ -70,17 +70,12 @@ function render() { cell2.innerHTML = myLibrary[i].author; cell3.innerHTML = myLibrary[i].pages; - //add and wait for action for read/unread button + // Add read/unread button let changeBut = document.createElement("button"); changeBut.id = i; changeBut.className = "btn btn-success"; cell4.appendChild(changeBut); - let readStatus = ""; - if (myLibrary[i].check == false) { - readStatus = "Yes"; - } else { - readStatus = "No"; - } + let readStatus = myLibrary[i].check ? "No" : "Yes"; // Corrected readStatus assignment changeBut.innerHTML = readStatus; changeBut.addEventListener("click", function () { @@ -88,13 +83,13 @@ function render() { render(); }); - //add delete button to every row and render again + // Add delete button let delButton = document.createElement("button"); - delBut.id = i + 5; - cell5.appendChild(delBut); - delBut.className = "btn btn-warning"; - delBut.innerHTML = "Delete"; - delBut.addEventListener("clicks", function () { + delButton.id = i + 5; // Corrected variable name from delBut to delButton + cell5.appendChild(delButton); + delButton.className = "btn btn-warning"; + delButton.innerHTML = "Delete"; + delButton.addEventListener("click", function () { // Corrected event name from "clicks" to "click" alert(`You've deleted title: ${myLibrary[i].title}`); myLibrary.splice(i, 1); render(); diff --git a/book-library/style.css b/book-library/style.css index 302950cb..78d94cf1 100644 --- a/book-library/style.css +++ b/book-library/style.css @@ -1,19 +1,33 @@ +/* Adjusted styles for the form group */ .form-group { - width: 400px; - height: 300px; - align-self: left; - padding-left: 20px; + max-width: 400px; + /* Changed width to max-width for responsiveness */ + margin: 0 auto; + /* Center the form group */ + padding: 20px; } +/* Adjusted styles for buttons */ .btn { - display: block; + display: inline-block; + /* Changed display to inline-block for buttons to appear inline */ + margin-right: 10px; + /* Added margin-right for spacing between buttons */ } +/* Adjusted styles for form-check-label */ .form-check-label { + display: inline-block; + /* Changed display to inline-block for checkbox label */ padding-left: 20px; - margin: 5px 0px 5px 0px; + margin: 5px 20px 5px 0; + /* Adjusted margin for spacing */ } +/* Adjusted styles for the add new book button */ button.btn-info { - margin: 20px; -} + margin: 20px auto; + /* Center the button */ + display: block; + /* Added display: block for full-width button */ +} \ No newline at end of file From 85a2bfb1ac83ae3d812fe4640e0dd15d4ce8a942 Mon Sep 17 00:00:00 2001 From: Nazanin Saedi Date: Wed, 1 May 2024 22:04:29 +0100 Subject: [PATCH 02/14] write html --- programmer-humour/index.html | 13 +++++++++++++ programmer-humour/script.js | 5 +++++ programmer-humour/style.css | 0 3 files changed, 18 insertions(+) create mode 100644 programmer-humour/index.html create mode 100644 programmer-humour/script.js create mode 100644 programmer-humour/style.css diff --git a/programmer-humour/index.html b/programmer-humour/index.html new file mode 100644 index 00000000..a5ed69a6 --- /dev/null +++ b/programmer-humour/index.html @@ -0,0 +1,13 @@ + + + + + + xkcd Comic Viewer + + + +

xkcd Comic Viewer

+
+ + \ No newline at end of file diff --git a/programmer-humour/script.js b/programmer-humour/script.js new file mode 100644 index 00000000..9515cbdc --- /dev/null +++ b/programmer-humour/script.js @@ -0,0 +1,5 @@ +async function fetchComic(){ + try { + + } +} \ No newline at end of file diff --git a/programmer-humour/style.css b/programmer-humour/style.css new file mode 100644 index 00000000..e69de29b From 3c58f2f59092745598df4a606eeb866b38980748 Mon Sep 17 00:00:00 2001 From: Nazanin Saedi Date: Wed, 1 May 2024 22:10:33 +0100 Subject: [PATCH 03/14] fetch & render --- programmer-humour/script.js | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/programmer-humour/script.js b/programmer-humour/script.js index 9515cbdc..33c00324 100644 --- a/programmer-humour/script.js +++ b/programmer-humour/script.js @@ -1,5 +1,16 @@ async function fetchComic(){ try { + const response = await fetch('https://xkcd.now.sh/?comic=latest'); + const data = await response.json(); + // Log the received data to the console + console.log(data); + + //render the comic img + renderComic(data.img); + } catch (error) { + //handle errors + console.error('Error fetching comic:', error); + } } } \ No newline at end of file From 809a1545d45a00d2722eb3b0e0f7fd8c4af5bcf7 Mon Sep 17 00:00:00 2001 From: Nazanin Saedi Date: Wed, 1 May 2024 22:19:56 +0100 Subject: [PATCH 04/14] functions --- programmer-humour/script.js | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) diff --git a/programmer-humour/script.js b/programmer-humour/script.js index 33c00324..608a5739 100644 --- a/programmer-humour/script.js +++ b/programmer-humour/script.js @@ -13,4 +13,14 @@ async function fetchComic(){ console.error('Error fetching comic:', error); } } -} \ No newline at end of file + + //function to render the comic image into the Dom + function renderComic(imgUrl) { + const comicContainer = document.getElementById('comicContainer'); + const imgElement = document.createElement('img'); + imgElement.src = imgUrl; + imgElement.alt = 'xkcd Comic'; + imgElement.id = 'comic'; + comicContainer.appendChild(imgElement); + } + window.onload = fetchComic; \ No newline at end of file From 3855496347e2a649368268b683f6ba1d07a8d983 Mon Sep 17 00:00:00 2001 From: Nazanin Saedi Date: Wed, 1 May 2024 22:22:57 +0100 Subject: [PATCH 05/14] styling for the img --- programmer-humour/style.css | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/programmer-humour/style.css b/programmer-humour/style.css index e69de29b..de689260 100644 --- a/programmer-humour/style.css +++ b/programmer-humour/style.css @@ -0,0 +1,5 @@ +/* basic style for the img */ +#comic { + max-width: 100%; + height: auto; +} \ No newline at end of file From dd7f745db11f8091622c1ce471a293eaed131958 Mon Sep 17 00:00:00 2001 From: Nazanin Saedi Date: Thu, 2 May 2024 13:50:13 +0100 Subject: [PATCH 06/14] answerQ1&2 --- code-reading/readme.md | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/code-reading/readme.md b/code-reading/readme.md index 5636dd35..1764d8f5 100644 --- a/code-reading/readme.md +++ b/code-reading/readme.md @@ -15,7 +15,8 @@ Take a look at the following code: ``` Explain why line 4 and line 6 output different numbers. - +## My answer: +Line 4 creates a new local variable x inside the function f1, which shadows the outer variable x. So, when console.log(x) executes on line 5, it refers to the local x with a value of 2. Line 7 refers to the outer variable x, which retains its original value of 1. ## Question 2 Take a look at the following code: @@ -33,6 +34,9 @@ console.log(y); ``` What will be the output of this code. Explain your answer in 50 words or less. +# The code output: +10 +undefined ## Question 3 From d2bacff323e703d59f3caba90c0ddf6a43401766 Mon Sep 17 00:00:00 2001 From: Nazanin Saedi Date: Thu, 2 May 2024 13:54:29 +0100 Subject: [PATCH 07/14] ANSWER ALL QUESTION WITH EXPLAIN --- code-reading/readme.md | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/code-reading/readme.md b/code-reading/readme.md index 1764d8f5..168791fd 100644 --- a/code-reading/readme.md +++ b/code-reading/readme.md @@ -37,6 +37,9 @@ What will be the output of this code. Explain your answer in 50 words or less. # The code output: 10 undefined +# Explain for my answer : +console.log(x) inside f1() prints the value of the outer variable x, which is 10. y is defined locally within f1(), so it's not accessible outside the function, resulting in undefined. + ## Question 3 @@ -64,4 +67,13 @@ f2(y); console.log(y); ``` +# answer Q3 +# THE OUTPUT +9 +{ x: 10 } + +# MY EXPLAIN +In the first case, x is a primitive (number), so passing it to f1() doesn't change its value. In the second case, y is an object, and since objects are passed by reference, modifying val.x inside f2() affects the original object y. + + What will be the output of this code. Explain your answer in 50 words or less. From caa6eb7979657a7606d09f9e38d21b47e3ca52fe Mon Sep 17 00:00:00 2001 From: Nazanin Saedi Date: Thu, 2 May 2024 22:45:46 +0100 Subject: [PATCH 08/14] answer questions --- code-reading/readme.md | 14 +++++++++----- 1 file changed, 9 insertions(+), 5 deletions(-) diff --git a/code-reading/readme.md b/code-reading/readme.md index 168791fd..312fc78f 100644 --- a/code-reading/readme.md +++ b/code-reading/readme.md @@ -15,7 +15,8 @@ Take a look at the following code: ``` Explain why line 4 and line 6 output different numbers. -## My answer: + +My answer: Line 4 creates a new local variable x inside the function f1, which shadows the outer variable x. So, when console.log(x) executes on line 5, it refers to the local x with a value of 2. Line 7 refers to the outer variable x, which retains its original value of 1. ## Question 2 @@ -34,9 +35,11 @@ console.log(y); ``` What will be the output of this code. Explain your answer in 50 words or less. -# The code output: + The code output: + 10 undefined + # Explain for my answer : console.log(x) inside f1() prints the value of the outer variable x, which is 10. y is defined locally within f1(), so it's not accessible outside the function, resulting in undefined. @@ -67,12 +70,13 @@ f2(y); console.log(y); ``` -# answer Q3 -# THE OUTPUT +answer Q3 + THE OUTPUT : + 9 { x: 10 } -# MY EXPLAIN +MY EXPLAIN In the first case, x is a primitive (number), so passing it to f1() doesn't change its value. In the second case, y is an object, and since objects are passed by reference, modifying val.x inside f2() affects the original object y. From 53851054d6af2e0fe878406a4c893f139521df24 Mon Sep 17 00:00:00 2001 From: Nazanin Saedi Date: Thu, 2 May 2024 22:50:37 +0100 Subject: [PATCH 09/14] answers From 8f83c95373295b02e8e2d671529420a30bb96f29 Mon Sep 17 00:00:00 2001 From: Nazanin Saedi Date: Fri, 3 May 2024 19:54:05 +0100 Subject: [PATCH 10/14] exercice one done --- object-destructuring/exercise-1/exercise.js | 21 ++++++++++++++------- 1 file changed, 14 insertions(+), 7 deletions(-) diff --git a/object-destructuring/exercise-1/exercise.js b/object-destructuring/exercise-1/exercise.js index a6eab299..585e8edb 100644 --- a/object-destructuring/exercise-1/exercise.js +++ b/object-destructuring/exercise-1/exercise.js @@ -1,13 +1,20 @@ -const personOne = { - name: "Popeye", - age: 34, - favouriteFood: "Spinach", -}; +// const personOne = { +// name: "Popeye", +// age: 34, +// favouriteFood: "Spinach", +// }; -function introduceYourself(___________________________) { +// function introduceYourself(___________________________) { +// console.log( +// `Hello, my name is ${name}. I am ${age} years old and my favourite food is ${favouriteFood}.` +// ); +// } + +// introduceYourself(personOne); +function introduceYourself({ name, age, favouriteFood }) { console.log( `Hello, my name is ${name}. I am ${age} years old and my favourite food is ${favouriteFood}.` ); } -introduceYourself(personOne); + From 10791ff8e5c507434906ca6ecc2be7923dc34d40 Mon Sep 17 00:00:00 2001 From: Nazanin Saedi Date: Fri, 3 May 2024 20:15:08 +0100 Subject: [PATCH 11/14] EX2_Task1 --- object-destructuring/exercise-2/exercise.js | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/object-destructuring/exercise-2/exercise.js b/object-destructuring/exercise-2/exercise.js index e11b75eb..10f032fc 100644 --- a/object-destructuring/exercise-2/exercise.js +++ b/object-destructuring/exercise-2/exercise.js @@ -70,3 +70,8 @@ let hogwarts = [ occupation: "Teacher", }, ]; +console.log("Task 1:"); +let GryffindorMembers = hogwarts.filter(({ house }) => house === "Gryffindor"); +GryffindorMembers.forEach(({ firstName, lastName }) => { + console.log('${firstName} ${lastName}'); +}); From 13ab837f1df209e79cdef0daa18730e99059befa Mon Sep 17 00:00:00 2001 From: Nazanin Saedi Date: Fri, 3 May 2024 20:19:25 +0100 Subject: [PATCH 12/14] EX2-Task2 --- object-destructuring/exercise-2/exercise.js | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/object-destructuring/exercise-2/exercise.js b/object-destructuring/exercise-2/exercise.js index 10f032fc..007f69aa 100644 --- a/object-destructuring/exercise-2/exercise.js +++ b/object-destructuring/exercise-2/exercise.js @@ -70,8 +70,19 @@ let hogwarts = [ occupation: "Teacher", }, ]; + +// Task 1: console.log("Task 1:"); let GryffindorMembers = hogwarts.filter(({ house }) => house === "Gryffindor"); GryffindorMembers.forEach(({ firstName, lastName }) => { console.log('${firstName} ${lastName}'); }); + +//Task 2 +console.log("Task 2:"); +let teachersWithPets = hogwaters.filter(({ occupation, pet }) => occupation === "Teacher" && pet !== null); +teachersWithPets.forEach(({ firstName, lastName }) => { + console.log(`${firstName} ${lastName}`); +}); + + From de16492441e4988884e6916b411057e8976e4c4b Mon Sep 17 00:00:00 2001 From: Nazanin Saedi Date: Fri, 3 May 2024 20:43:49 +0100 Subject: [PATCH 13/14] addfunctions --- object-destructuring/exercise-3/exercise.js | 22 +++++++++++++++++++++ 1 file changed, 22 insertions(+) diff --git a/object-destructuring/exercise-3/exercise.js b/object-destructuring/exercise-3/exercise.js index 0a01f8f0..516e355f 100644 --- a/object-destructuring/exercise-3/exercise.js +++ b/object-destructuring/exercise-3/exercise.js @@ -1,3 +1,4 @@ +// Define the order as an array of objects, each object representing an item let order = [ { itemName: "Hot cakes", quantity: 1, unitPrice: 2.29 }, { itemName: "Apple Pie", quantity: 2, unitPrice: 1.39 }, @@ -6,3 +7,24 @@ let order = [ { itemName: "Hot Coffee", quantity: 2, unitPrice: 1.0 }, { itemName: "Hash Brown", quantity: 4, unitPrice: 0.4 }, ]; + +//function to calculate the total cost of an item +function calculateTotal(quantity, unitPrice) { + return quantity * unitPrice; +} + +//function to print the receipt +function printReceipt(order) { + console.log("QTY\tItem\t\t\tTOTAL"); + + let totalOrderCost = 0; + + order.array.forEach(element => { + const total = calculateTotal(item.quantity, item.unitPrice); + + totalOrderCost += total; + + }); + + +} \ No newline at end of file From 3d129231fa9eae88dc656372cac0198eaf0a7652 Mon Sep 17 00:00:00 2001 From: Nazanin Saedi Date: Fri, 3 May 2024 20:51:40 +0100 Subject: [PATCH 14/14] receipt for this order --- object-destructuring/exercise-3/exercise.js | 18 +++++++++++++----- 1 file changed, 13 insertions(+), 5 deletions(-) diff --git a/object-destructuring/exercise-3/exercise.js b/object-destructuring/exercise-3/exercise.js index 516e355f..7309c33f 100644 --- a/object-destructuring/exercise-3/exercise.js +++ b/object-destructuring/exercise-3/exercise.js @@ -15,16 +15,24 @@ function calculateTotal(quantity, unitPrice) { //function to print the receipt function printReceipt(order) { + // Print the header console.log("QTY\tItem\t\t\tTOTAL"); + // Initialize total cost of the order let totalOrderCost = 0; - +// Iterate through each item in the order order.array.forEach(element => { + + // Calculate the total cost of the current item const total = calculateTotal(item.quantity, item.unitPrice); + // Add the total cost of the current item to the total order cost totalOrderCost += total; - +// Print the quantity, item name, and total cost of the current item + console.log(`${item.quantity}\t${item.itemName.padEnd(20)}${total.toFixed(2)}`); }); - - -} \ No newline at end of file +// Print the total cost of the order +console.log("\nTotal:" , totalOrderCost.toFixed(2)); +} +// Call the function to print the receipt +printReceipt(order); \ No newline at end of file