From c48e8858615e318c07cd05472999c6c81150a088 Mon Sep 17 00:00:00 2001 From: KP-Tim Date: Wed, 30 Nov 2022 09:44:53 -0800 Subject: [PATCH 01/35] Update script.js --- 02-Fundamentals-Part-2/starter/script.js | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) diff --git a/02-Fundamentals-Part-2/starter/script.js b/02-Fundamentals-Part-2/starter/script.js index e69de29bb2..06a6b11da4 100755 --- a/02-Fundamentals-Part-2/starter/script.js +++ b/02-Fundamentals-Part-2/starter/script.js @@ -0,0 +1,16 @@ +// let abs = "hello"; + +// function keepTry(s) { +// console.log(s); +// } + +// keepTry(abs); +// keepTry(); +// keepTry(); + +function juiceMaker(apple, juice) { + const juices = `${apple} apples and ${juice} juices`; + return juices; +} + +console.log(juiceMaker(3, 2)); From 5abca3fe54aa193b7600e8eeeb1b1ba137a93b58 Mon Sep 17 00:00:00 2001 From: KP-Tim Date: Wed, 30 Nov 2022 12:11:13 -0800 Subject: [PATCH 02/35] Update script.js --- 02-Fundamentals-Part-2/starter/script.js | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/02-Fundamentals-Part-2/starter/script.js b/02-Fundamentals-Part-2/starter/script.js index 06a6b11da4..dced6364b6 100755 --- a/02-Fundamentals-Part-2/starter/script.js +++ b/02-Fundamentals-Part-2/starter/script.js @@ -8,9 +8,23 @@ // keepTry(); // keepTry(); +// function declaration because it uses function keyword to declare a function function juiceMaker(apple, juice) { const juices = `${apple} apples and ${juice} juices`; return juices; } console.log(juiceMaker(3, 2)); + +const appleJuice = juiceMaker(10, 3); +console.log(appleJuice); + +// function declaration +function calcAge1(birthYear) { + return 2022 - birthYear; +} + +const age1 = calcAge1(1982); +console.log(age1); + +// function expression From 1b219226c4ecc7cc9d53336b18b7e9e9a96f5e3a Mon Sep 17 00:00:00 2001 From: KP-Tim <79594296+KP-Tim@users.noreply.github.com> Date: Wed, 30 Nov 2022 12:33:39 -0800 Subject: [PATCH 03/35] Update script.js changed in laptop --- 02-Fundamentals-Part-2/starter/script.js | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/02-Fundamentals-Part-2/starter/script.js b/02-Fundamentals-Part-2/starter/script.js index dced6364b6..33e4c33301 100755 --- a/02-Fundamentals-Part-2/starter/script.js +++ b/02-Fundamentals-Part-2/starter/script.js @@ -28,3 +28,9 @@ const age1 = calcAge1(1982); console.log(age1); // function expression +const calcAge2 = function (birthYear) { + return 2022 - birthYear +} + +const age2 = calcAge2(1982, 1977) +console.log(age2) \ No newline at end of file From 0d337c71eac22b5cf150d61190f818bca55608f3 Mon Sep 17 00:00:00 2001 From: KP-Tim Date: Wed, 30 Nov 2022 12:36:38 -0800 Subject: [PATCH 04/35] Update script.js changes in desktop --- 02-Fundamentals-Part-2/starter/script.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/02-Fundamentals-Part-2/starter/script.js b/02-Fundamentals-Part-2/starter/script.js index 33e4c33301..973915535e 100755 --- a/02-Fundamentals-Part-2/starter/script.js +++ b/02-Fundamentals-Part-2/starter/script.js @@ -29,8 +29,8 @@ console.log(age1); // function expression const calcAge2 = function (birthYear) { - return 2022 - birthYear -} + return 2022 - birthYear; +}; -const age2 = calcAge2(1982, 1977) -console.log(age2) \ No newline at end of file +const age2 = calcAge2(1977); +console.log(age1, age2); From 0d50b60244f2d4ca8ee90b03d3515586a0831467 Mon Sep 17 00:00:00 2001 From: KP-Tim Date: Wed, 30 Nov 2022 13:11:24 -0800 Subject: [PATCH 05/35] Update script.js Added arrow function --- 02-Fundamentals-Part-2/starter/script.js | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/02-Fundamentals-Part-2/starter/script.js b/02-Fundamentals-Part-2/starter/script.js index 973915535e..e870bd4a6c 100755 --- a/02-Fundamentals-Part-2/starter/script.js +++ b/02-Fundamentals-Part-2/starter/script.js @@ -34,3 +34,8 @@ const calcAge2 = function (birthYear) { const age2 = calcAge2(1977); console.log(age1, age2); + +// arrow function +const calcAge3 = (birthYear) => 2022 - birthYear; + +console.log(calcAge3(1980)); From 67e6d68b8b2cab2a8bb4a23c6ccdca37408219e9 Mon Sep 17 00:00:00 2001 From: KP-Tim Date: Thu, 1 Dec 2022 13:37:58 -0800 Subject: [PATCH 06/35] Update script.js Coding Challenge #2 added --- 02-Fundamentals-Part-2/starter/script.js | 53 +++++++++++++++++++++++- 1 file changed, 52 insertions(+), 1 deletion(-) diff --git a/02-Fundamentals-Part-2/starter/script.js b/02-Fundamentals-Part-2/starter/script.js index e870bd4a6c..f51b9aafa8 100755 --- a/02-Fundamentals-Part-2/starter/script.js +++ b/02-Fundamentals-Part-2/starter/script.js @@ -8,6 +8,8 @@ // keepTry(); // keepTry(); +/* + // function declaration because it uses function keyword to declare a function function juiceMaker(apple, juice) { const juices = `${apple} apples and ${juice} juices`; @@ -37,5 +39,54 @@ console.log(age1, age2); // arrow function const calcAge3 = (birthYear) => 2022 - birthYear; - console.log(calcAge3(1980)); + +const retirement = (birth) => { + const age = 2022 - birth; + const retireYears = 65 - age; + return retireYears; +}; + +const yearsUntilRetirment = function (birthYear, names) { + const retire = retirement(birthYear); + if (retire > 0) { + console.log(`${names} will retire aftter ${retire} years`); + return retire; + } else { + console.log(`${names} has already retired`); + return -1; + } + // return `${names} will retire aftter ${retire} years`; +}; +console.log(yearsUntilRetirment(1983, "tim")); +console.log(yearsUntilRetirment(1950, "david")); + +// examples +const cutFruit = (fruit) => fruit * 3; +const fruitMaker = (apple, orange) => { + const appleJuice = cutFruit(apple); + const orangeJuice = cutFruit(orange); + return `${appleJuice} apples and ${orangeJuice} oranges`; +}; +console.log(fruitMaker(5, 2)); + +*/ + +const dolphinsScore = [96, 108, 89]; +const koalasScore = [88, 91, 110]; + +// let avgScore = 0; + +const averageScore = function (scores) { + let avgScore = 0; + for (let i = 0; i < scores.length; i++) { + avgScore += scores[i]; + } + return avgScore / scores.length; +}; + +const avgDolphins = averageScore(dolphinsScore); +const avgKoalas = averageScore(koalasScore); + +console.log(avgDolphins); +console.log(avgKoalas); From 3de509b3c609d4c5a85940a49c9b0e7dae13c480 Mon Sep 17 00:00:00 2001 From: KP-Tim Date: Thu, 1 Dec 2022 13:54:07 -0800 Subject: [PATCH 07/35] Update script.js Code challege problems 1 and 2 done --- 02-Fundamentals-Part-2/starter/script.js | 11 ++++++++++- 1 file changed, 10 insertions(+), 1 deletion(-) diff --git a/02-Fundamentals-Part-2/starter/script.js b/02-Fundamentals-Part-2/starter/script.js index f51b9aafa8..885575887b 100755 --- a/02-Fundamentals-Part-2/starter/script.js +++ b/02-Fundamentals-Part-2/starter/script.js @@ -82,7 +82,8 @@ const averageScore = function (scores) { for (let i = 0; i < scores.length; i++) { avgScore += scores[i]; } - return avgScore / scores.length; + let avg = avgScore / scores.length; + return avg; }; const avgDolphins = averageScore(dolphinsScore); @@ -90,3 +91,11 @@ const avgKoalas = averageScore(koalasScore); console.log(avgDolphins); console.log(avgKoalas); + +if (avgDolphins > avgKoalas) { + console.log("Team Dolphins is the winner"); +} else if (avgDolphins < avgKoalas) { + console.log("Team Koalas is the winner"); +} else { + console.log("It's a draw"); +} From 43354268d3af6957e873e91eb57ad336baed1072 Mon Sep 17 00:00:00 2001 From: KP-Tim Date: Fri, 2 Dec 2022 09:29:12 -0800 Subject: [PATCH 08/35] Update script.js Challenge #3 done and added --- 02-Fundamentals-Part-2/starter/script.js | 49 +++++++++++++++++++----- 1 file changed, 40 insertions(+), 9 deletions(-) diff --git a/02-Fundamentals-Part-2/starter/script.js b/02-Fundamentals-Part-2/starter/script.js index 885575887b..1c0e9606b9 100755 --- a/02-Fundamentals-Part-2/starter/script.js +++ b/02-Fundamentals-Part-2/starter/script.js @@ -72,6 +72,7 @@ console.log(fruitMaker(5, 2)); */ +/* const dolphinsScore = [96, 108, 89]; const koalasScore = [88, 91, 110]; @@ -89,13 +90,43 @@ const averageScore = function (scores) { const avgDolphins = averageScore(dolphinsScore); const avgKoalas = averageScore(koalasScore); -console.log(avgDolphins); -console.log(avgKoalas); +console.log(avgDolphins, avgKoalas); -if (avgDolphins > avgKoalas) { - console.log("Team Dolphins is the winner"); -} else if (avgDolphins < avgKoalas) { - console.log("Team Koalas is the winner"); -} else { - console.log("It's a draw"); -} +const compare = function (avgDolphins, avgKoalas) { + if (avgDolphins > avgKoalas && avgDolphins >= 100) { + console.log("Team Dolphins is the winner"); + } else if (avgDolphins < avgKoalas && avgKoalas >= 100) { + console.log("Team Koalas is the winner"); + } else { + console.log("No team wins"); + } +}; + +// compare(avgDolphins, avgKoalas); + +const average = (a, b, c) => (a + b + c) / 3; + +const teamDolphinsAVG = average(44, 23, 71); +const teamKoalasAVG = average(65, 54, 49); +const teamDolphinsAVG1 = average(97, 112, 101); +const teamKoalasAVG1 = average(109, 95, 123); +const teamDolphinsAVG2 = average(97, 112, 101); +const teamKoalasAVG2 = average(109, 95, 106); + +const compareFunction = function (dolphins, koalas) { + if (dolphins >= 2 * koalas && dolphins > 100) { + console.log("Team Dolphins Wins"); + } else if (2 * dolphins <= koalas && koalas > 100) { + console.log("Team Koalas Wins"); + } else if (dolphins === koalas && dolphins > 100 && koalas > 100) { + console.log("Draws"); + } else { + console.log("No team wins"); + } +}; + +compareFunction(teamDolphinsAVG, teamKoalasAVG); +compareFunction(teamDolphinsAVG1, teamKoalasAVG1); +compareFunction(teamDolphinsAVG2, teamKoalasAVG2); + +*/ From 92ec97bb6c86f684f47dd72bd89f598790341139 Mon Sep 17 00:00:00 2001 From: KP-Tim Date: Fri, 2 Dec 2022 12:17:52 -0800 Subject: [PATCH 09/35] Update script.js Basic Array Lecture Done and Added --- 02-Fundamentals-Part-2/starter/script.js | 40 ++++++++++++++++++++++++ 1 file changed, 40 insertions(+) diff --git a/02-Fundamentals-Part-2/starter/script.js b/02-Fundamentals-Part-2/starter/script.js index 1c0e9606b9..012294cbc0 100755 --- a/02-Fundamentals-Part-2/starter/script.js +++ b/02-Fundamentals-Part-2/starter/script.js @@ -73,6 +73,8 @@ console.log(fruitMaker(5, 2)); */ /* +CHALLENGE #3 + const dolphinsScore = [96, 108, 89]; const koalasScore = [88, 91, 110]; @@ -130,3 +132,41 @@ compareFunction(teamDolphinsAVG1, teamKoalasAVG1); compareFunction(teamDolphinsAVG2, teamKoalasAVG2); */ + +/* +const friends = ["Michael", "Steven", "Peter"]; +console.log(friends); + +const yearss = new Array(1991, 1984, 2008, 2020); +console.log(yearss); + +friends[friends.length - 1] = "Jay"; +console.log(friends); + +const firstName = "Tim"; +const tim = [firstName, "Ha", 2020 - 1982, "IT", friends]; + +console.log(tim); + +const calcAge = function (birthday) { + return 2022 - birthday; +}; + +const years = [1990, 1967, 2002, 2010, 2018]; + +const age = [ + calcAge(years[0]), + calcAge(years[1]), + calcAge(years[2]), + calcAge(years[3]), + calcAge(years[years.length - 1]), +]; + +console.log(age); +*/ + +const friends = ["Michael", "Steven", "Peter"]; + +friends.push("Daivd"); + +console.log(friends); From 701fe8998feda5d2fe85a9df0748b07cb91fa56f Mon Sep 17 00:00:00 2001 From: KP-Tim Date: Fri, 2 Dec 2022 15:55:10 -0800 Subject: [PATCH 10/35] Last change Last change done I don't know what it is --- 02-Fundamentals-Part-2/starter/script.js | 14 +++++++++++++- 1 file changed, 13 insertions(+), 1 deletion(-) diff --git a/02-Fundamentals-Part-2/starter/script.js b/02-Fundamentals-Part-2/starter/script.js index 012294cbc0..e4643b79f0 100755 --- a/02-Fundamentals-Part-2/starter/script.js +++ b/02-Fundamentals-Part-2/starter/script.js @@ -165,8 +165,20 @@ const age = [ console.log(age); */ +// Add Element in array are (unshift and push) const friends = ["Michael", "Steven", "Peter"]; -friends.push("Daivd"); +const newLength = friends.push("David"); +const newLength1 = friends.unshift("Tim"); +const newLength2 = friends.unshift("Tom"); console.log(friends); +console.log(newLength1); +console.log(newLength2); + +// Remove Element in array are (pop and shift) +const removeLength = friends.pop(); +const removeFirst = friends.shift(); +console.log(friends); +console.log(removeLength); +console.log(removeFirst); From 7212a4babfa2ef6718f3c328e3e0338e0addf6f2 Mon Sep 17 00:00:00 2001 From: KP-Tim <79594296+KP-Tim@users.noreply.github.com> Date: Sat, 3 Dec 2022 11:09:45 -0800 Subject: [PATCH 11/35] Update script.js Basic array methods added --- 02-Fundamentals-Part-2/starter/script.js | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/02-Fundamentals-Part-2/starter/script.js b/02-Fundamentals-Part-2/starter/script.js index e4643b79f0..9573463d96 100755 --- a/02-Fundamentals-Part-2/starter/script.js +++ b/02-Fundamentals-Part-2/starter/script.js @@ -165,6 +165,7 @@ const age = [ console.log(age); */ +/* // Add Element in array are (unshift and push) const friends = ["Michael", "Steven", "Peter"]; @@ -182,3 +183,9 @@ const removeFirst = friends.shift(); console.log(friends); console.log(removeLength); console.log(removeFirst); + +console.log(friends.indexOf('Michael')) +console.log(friends.includes('Steven')) +*/ + + From 1feca92bf2080ca28dfd161791f82894cc370a6d Mon Sep 17 00:00:00 2001 From: KP-Tim <79594296+KP-Tim@users.noreply.github.com> Date: Sat, 3 Dec 2022 12:03:41 -0800 Subject: [PATCH 12/35] Update script.js Code Challege #2 Done and Added --- 02-Fundamentals-Part-2/starter/script.js | 19 +++++++++++++++++++ 1 file changed, 19 insertions(+) diff --git a/02-Fundamentals-Part-2/starter/script.js b/02-Fundamentals-Part-2/starter/script.js index 9573463d96..26ebc0126d 100755 --- a/02-Fundamentals-Part-2/starter/script.js +++ b/02-Fundamentals-Part-2/starter/script.js @@ -189,3 +189,22 @@ console.log(friends.includes('Steven')) */ +// Coding Challenge #4 +const bills = [275, 40, 430] + +const tip = function (bill) { + const restTip = 300 >= bill && bill >= 50 ? bill * 0.15 : bill * 0.20; + console.log(`The bill was ${bill}, the tip was ${restTip}, and the total value ${bill + restTip}`); + return restTip; +} + +tip(275) + +const tableTip = bill => 300 >= bill && bill >= 50 ? bill * 0.15 : bill * 0.20 + +const tips = [tableTip(bills[0]), tableTip(bills[1]), tableTip(bills[2])] + +const tableBills = [bills[0], bills[1], bills[2]] + +const total = [tableBills[0] + tips[0], tableBills[1] + tips[1], tableBills[2] + tips[2]] +console.log(tableBills, tips, total) \ No newline at end of file From 0a6201ad01be3c214fe6352faf3b551472e43a94 Mon Sep 17 00:00:00 2001 From: KP-Tim <79594296+KP-Tim@users.noreply.github.com> Date: Sat, 3 Dec 2022 18:27:30 -0800 Subject: [PATCH 13/35] Update script.js About to begin challenge 2. --- 02-Fundamentals-Part-2/starter/script.js | 45 +++++++++++++++++++++++- 1 file changed, 44 insertions(+), 1 deletion(-) diff --git a/02-Fundamentals-Part-2/starter/script.js b/02-Fundamentals-Part-2/starter/script.js index 26ebc0126d..491a7c6418 100755 --- a/02-Fundamentals-Part-2/starter/script.js +++ b/02-Fundamentals-Part-2/starter/script.js @@ -189,6 +189,7 @@ console.log(friends.includes('Steven')) */ +/* // Coding Challenge #4 const bills = [275, 40, 430] @@ -207,4 +208,46 @@ const tips = [tableTip(bills[0]), tableTip(bills[1]), tableTip(bills[2])] const tableBills = [bills[0], bills[1], bills[2]] const total = [tableBills[0] + tips[0], tableBills[1] + tips[1], tableBills[2] + tips[2]] -console.log(tableBills, tips, total) \ No newline at end of file +console.log(tableBills, tips, total) +*/ + +// Array and Object + +const timArray = [ + 'tim', + 'ha', + 2022 - 1982, + 'IT', + ['David', 'Frank', 'Lynn'] +] + +const timObject = { + firstName: 'Tim', + lastName: 'Ha', + job: 'IT', + birthYear: 1982, + friends: ['Ken', 'Frank', 'Lynn'], + hasDriversLicense: true, + calcAge: function () { + this.age = 2022 - this.birthYear + return this.age; + } +} +const names = 'Name' +// console.log(timObject.'first Name') + +console.log(timObject.calcAge()) + +//Chanellge +// Tim is 40 years old IT, and has a/no driver's license. +console.log() + + +// console.log(timObject['calcAge'](1982)) + +// timObject.location = 'California'; +// timObject['twitter'] = 'solo'; +// console.log(timObject) +// // Tim has 3 friends, and his best friend is called Ken. + +// console.log(`${timObject.firstName} has ${timObject.friends.length} friends, and his bes friend is called ${timObject.friends[0]}.`) \ No newline at end of file From 54d355e8e33cbfada00198bb877abc634ec98ae2 Mon Sep 17 00:00:00 2001 From: KP-Tim <79594296+KP-Tim@users.noreply.github.com> Date: Sat, 3 Dec 2022 20:39:26 -0800 Subject: [PATCH 14/35] Challenge 3 Starts Challenge 2 Done --- 02-Fundamentals-Part-2/starter/script.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/02-Fundamentals-Part-2/starter/script.js b/02-Fundamentals-Part-2/starter/script.js index 491a7c6418..ba64644ba8 100755 --- a/02-Fundamentals-Part-2/starter/script.js +++ b/02-Fundamentals-Part-2/starter/script.js @@ -231,6 +231,9 @@ const timObject = { calcAge: function () { this.age = 2022 - this.birthYear return this.age; + }, + getSummary: function () { + return `${this.firstName} is ${this.calcAge()} years old ${this.job}, and has ${this.hasDriversLicense ? "a" : 'no'} driver's license.` } } const names = 'Name' @@ -240,7 +243,7 @@ console.log(timObject.calcAge()) //Chanellge // Tim is 40 years old IT, and has a/no driver's license. -console.log() +console.log(timObject.getSummary()) // console.log(timObject['calcAge'](1982)) From fdd1b20d2a6bf054df6fa7a81b60172efe450b4a Mon Sep 17 00:00:00 2001 From: KP-Tim <79594296+KP-Tim@users.noreply.github.com> Date: Sat, 3 Dec 2022 21:59:11 -0800 Subject: [PATCH 15/35] Loop lecture starts Challenge 3 Done --- 02-Fundamentals-Part-2/starter/script.js | 44 +++++++++++++++++++++++- 1 file changed, 43 insertions(+), 1 deletion(-) diff --git a/02-Fundamentals-Part-2/starter/script.js b/02-Fundamentals-Part-2/starter/script.js index ba64644ba8..47621cc86f 100755 --- a/02-Fundamentals-Part-2/starter/script.js +++ b/02-Fundamentals-Part-2/starter/script.js @@ -211,6 +211,8 @@ const total = [tableBills[0] + tips[0], tableBills[1] + tips[1], tableBills[2] + console.log(tableBills, tips, total) */ + +/* // Array and Object const timArray = [ @@ -253,4 +255,44 @@ console.log(timObject.getSummary()) // console.log(timObject) // // Tim has 3 friends, and his best friend is called Ken. -// console.log(`${timObject.firstName} has ${timObject.friends.length} friends, and his bes friend is called ${timObject.friends[0]}.`) \ No newline at end of file +// console.log(`${timObject.firstName} has ${timObject.friends.length} friends, and his bes friend is called ${timObject.friends[0]}.`) + +*/ + + +// Challenge 3 +/* +const mark = { + firstName: 'Mark', + lastName: 'Miller', + mass: 78, + height: 1.69, + calcBMI: function () { + this.BMI = this.mass / this.height ** 2 + return this.BMI + // return this.mass / (this.height * this.height) + } +} + +console.log(mark.calcBMI()) + +const john = { + firstName: 'John', + lastName: 'Smith', + mass: 92, + height: 1.95, + calcBMI: function () { + this.BMI = this.mass / this.height ** 2 + return this.BMI + // return this.mass / (this.height * this.height) + } +} + +console.log(john.calcBMI()); + +if (mark.calcBMI() > john.calcBMI()) { + console.log(`${mark.firstName} ${mark.lastName} weights ${mark.mass} kg and is ${mark.height} tall. ${john.firstName} ${john.lastName} weights ${john.mass} kg and is ${john.height} m tall.`) +} else if (mark.calcBMI() < john.calcBMI()) { + console.log(`${john.firstName} ${john.lastName} weights ${john.mass} kg and is ${mark.height} tall. ${mark.firstName} ${mark.lastName} weights ${mark.mass} kg and is ${mark.height} m tall.`) +} +*/ From cc5a186e1a82ded84b1a3675d4904e9598fe34bc Mon Sep 17 00:00:00 2001 From: KP-Tim <79594296+KP-Tim@users.noreply.github.com> Date: Sun, 4 Dec 2022 13:38:05 -0800 Subject: [PATCH 16/35] While loop lecture starts Loop backwards done --- 02-Fundamentals-Part-2/starter/index.html | 60 ++++++++++++----------- 02-Fundamentals-Part-2/starter/script.js | 59 ++++++++++++++++++++++ 2 files changed, 91 insertions(+), 28 deletions(-) diff --git a/02-Fundamentals-Part-2/starter/index.html b/02-Fundamentals-Part-2/starter/index.html index ee4909e282..03419ad37f 100755 --- a/02-Fundamentals-Part-2/starter/index.html +++ b/02-Fundamentals-Part-2/starter/index.html @@ -1,30 +1,34 @@ - - - - - JavaScript Fundamentals – Part 2 - - - -

JavaScript Fundamentals – Part 2

- - - + + + + + + JavaScript Fundamentals – Part 2 + + + + +

JavaScript Fundamentals – Part 2

+ + + + \ No newline at end of file diff --git a/02-Fundamentals-Part-2/starter/script.js b/02-Fundamentals-Part-2/starter/script.js index 47621cc86f..9ee7e0b5fc 100755 --- a/02-Fundamentals-Part-2/starter/script.js +++ b/02-Fundamentals-Part-2/starter/script.js @@ -296,3 +296,62 @@ if (mark.calcBMI() > john.calcBMI()) { console.log(`${john.firstName} ${john.lastName} weights ${john.mass} kg and is ${mark.height} tall. ${mark.firstName} ${mark.lastName} weights ${mark.mass} kg and is ${mark.height} m tall.`) } */ +// for (let i = 1; i <= 10; i++) { +// console.log(`Lifting weights repetition ${i}`) +// } + +const timArray = [ + 'tim', + 'ha', + 2022 - 1982, + 'IT', + ['David', 'Frank', 'Lynn'] +] + +/* +// Loop backwards +for (let i = timArray.length - 1; i >= 0; i--) { + console.log(timArray[i]) +} +for (let i = 0; i < timArray.length; i++) { + console.log(timArray[i]) +} +*/ + +/* +// Loop inside the loop exercise +for (let i = 1; i <= 3; i++) { + console.log(`Starting exercise ${i}`) + for (let y = 1; y <= 5; y++) { + console.log(`${i}-----Exercise repetion ${y}`) + } +} +*/ + +/* +console.log('typeof of timArray') +for (let i = 0; i < timArray.length; i++) { + console.log(timArray[i], typeof timArray[i]) +} + +console.log('Only log strings with continue') +for (let i = 0; i < timArray.length; i++) { + if (typeof timArray[i] !== 'string') continue; + console.log(timArray[i], typeof timArray[i]); +} + +console.log('Break with numbers') +for (let i = 0; i < timArray.length; i++) { + if (typeof timArray[i] === 'number') break; + console.log(timArray[i], typeof timArray[i]); +} + + +const years = [1991, 2007, 1969, 2020] +const age = [] + +for (let i = 0; i < years.length; i++) { + age.push(2022 - years[i]) +} +console.log(age) +*/ \ No newline at end of file From 0d3beedee4b27d76234b86e473f93237d6ba767a Mon Sep 17 00:00:00 2001 From: KP-Tim <79594296+KP-Tim@users.noreply.github.com> Date: Sun, 4 Dec 2022 16:19:58 -0800 Subject: [PATCH 17/35] Challenge 4 starts Loop lectures are done. --- 02-Fundamentals-Part-2/starter/script.js | 25 +++++++++++++++++++++++- 1 file changed, 24 insertions(+), 1 deletion(-) diff --git a/02-Fundamentals-Part-2/starter/script.js b/02-Fundamentals-Part-2/starter/script.js index 9ee7e0b5fc..d499845eb4 100755 --- a/02-Fundamentals-Part-2/starter/script.js +++ b/02-Fundamentals-Part-2/starter/script.js @@ -354,4 +354,27 @@ for (let i = 0; i < years.length; i++) { age.push(2022 - years[i]) } console.log(age) -*/ \ No newline at end of file +*/ + +// for (let i = 1; i <= 3; i++) { +// console.log(`Starting exercise ${i}`) +// for (let y = 1; y <= 5; y++) { +// console.log(`${i}-----Exercise repetion ${y}`) +// } +// } + +console.log('-------------using WHILE LOOPS-----------') + +// let i = 1; +// while (i <= 10) { +// console.log(`Repetition ${i}`) +// i++; +// } + +let randomNumber = Math.trunc(Math.random() * 6) + 1; + + +while (randomNumber !== 6) { + console.log(`You rolled ${randomNumber}`) + randomNumber = Math.trunc(Math.random() * 6) + 1; +} \ No newline at end of file From f810fe0efabf23da1c3ba4c4e621fd896034388c Mon Sep 17 00:00:00 2001 From: KP-Tim <79594296+KP-Tim@users.noreply.github.com> Date: Sun, 4 Dec 2022 21:16:08 -0800 Subject: [PATCH 18/35] Check challenge 4 Challenge 4 done but redo it --- 02-Fundamentals-Part-2/starter/script.js | 36 +++++++++++++++++++++++- 1 file changed, 35 insertions(+), 1 deletion(-) diff --git a/02-Fundamentals-Part-2/starter/script.js b/02-Fundamentals-Part-2/starter/script.js index d499845eb4..e62ebc607d 100755 --- a/02-Fundamentals-Part-2/starter/script.js +++ b/02-Fundamentals-Part-2/starter/script.js @@ -363,6 +363,7 @@ console.log(age) // } // } +/* console.log('-------------using WHILE LOOPS-----------') // let i = 1; @@ -377,4 +378,37 @@ let randomNumber = Math.trunc(Math.random() * 6) + 1; while (randomNumber !== 6) { console.log(`You rolled ${randomNumber}`) randomNumber = Math.trunc(Math.random() * 6) + 1; -} \ No newline at end of file +} +*/ + +// Challenege #4 + +const bills = [22, 295, 176, 440, 37, 105, 10, 1100, 86, 52] + +let tips = []; +let totals = []; + +for (let i = 0; i < bills.length; i++) { + const calcTip = function () { + if (bills[i] >= 50 && bills[i] <= 300) { + const tip = tips.push(bills[i] * 0.15) + const total = totals.push(tips[i] + bills[i]) + } else { + const tip = tips.push(bills[i] * 0.2) + const total = totals.push(tips[i] + bills[i]) + } + } + calcTip() +} +console.log(tips) +console.log(totals) + +let sum = 0; +for (let i = 0; i < totals.length; i++) { + const calcAverage = function (arr) { + sum += arr[i] / arr.length + } + calcAverage(totals) +} + +console.log(sum) \ No newline at end of file From 29f680062a5242ace0e3ed5ec6a915bb824b7149 Mon Sep 17 00:00:00 2001 From: KP-Tim Date: Mon, 5 Dec 2022 12:24:39 -0800 Subject: [PATCH 19/35] How to solve a problem done Learning how to code using mdn, google. stackoverflow --- .prettierrc | 1 + 02-Fundamentals-Part-2/starter/script.js | 62 ++++++++++++------------ 03-Developer-Skills/starter/index.html | 2 +- 03-Developer-Skills/starter/script.js | 31 ++++++++++++ 4 files changed, 65 insertions(+), 31 deletions(-) create mode 100644 .prettierrc diff --git a/.prettierrc b/.prettierrc new file mode 100644 index 0000000000..eaa7f6a356 --- /dev/null +++ b/.prettierrc @@ -0,0 +1 @@ +{ "singleQuote": true, "arrowParens": "avoid" } diff --git a/02-Fundamentals-Part-2/starter/script.js b/02-Fundamentals-Part-2/starter/script.js index e62ebc607d..8350c9cd2a 100755 --- a/02-Fundamentals-Part-2/starter/script.js +++ b/02-Fundamentals-Part-2/starter/script.js @@ -188,7 +188,6 @@ console.log(friends.indexOf('Michael')) console.log(friends.includes('Steven')) */ - /* // Coding Challenge #4 const bills = [275, 40, 430] @@ -211,7 +210,6 @@ const total = [tableBills[0] + tips[0], tableBills[1] + tips[1], tableBills[2] + console.log(tableBills, tips, total) */ - /* // Array and Object @@ -259,7 +257,6 @@ console.log(timObject.getSummary()) */ - // Challenge 3 /* const mark = { @@ -300,13 +297,7 @@ if (mark.calcBMI() > john.calcBMI()) { // console.log(`Lifting weights repetition ${i}`) // } -const timArray = [ - 'tim', - 'ha', - 2022 - 1982, - 'IT', - ['David', 'Frank', 'Lynn'] -] +const timArray = ["tim", "ha", 2022 - 1982, "IT", ["David", "Frank", "Lynn"]]; /* // Loop backwards @@ -383,32 +374,43 @@ while (randomNumber !== 6) { // Challenege #4 -const bills = [22, 295, 176, 440, 37, 105, 10, 1100, 86, 52] +const bills = [22, 295, 176, 440, 37, 105, 10, 1100, 86, 52]; let tips = []; let totals = []; +const calcTip = function (bill) { + return bill >= 50 && bill <= 300 ? bill * 0.15 : bill * 0.2; +}; + for (let i = 0; i < bills.length; i++) { - const calcTip = function () { - if (bills[i] >= 50 && bills[i] <= 300) { - const tip = tips.push(bills[i] * 0.15) - const total = totals.push(tips[i] + bills[i]) - } else { - const tip = tips.push(bills[i] * 0.2) - const total = totals.push(tips[i] + bills[i]) - } - } - calcTip() + const tip = calcTip(bills[i]); + tips.push(tip); + totals.push(tip + bills[i]); } -console.log(tips) -console.log(totals) -let sum = 0; -for (let i = 0; i < totals.length; i++) { - const calcAverage = function (arr) { - sum += arr[i] / arr.length +// for (let i = 0; i < bills.length; i++) { +// const calcTip = function () { +// if (bills[i] >= 50 && bills[i] <= 300) { +// const tip = tips.push(bills[i] * 0.15); +// const total = totals.push(tips[i] + bills[i]); +// } else { +// const tip = tips.push(bills[i] * 0.2); +// const total = totals.push(tips[i] + bills[i]); +// } +// }; +// calcTip(); +// } + +console.log(tips); +console.log(totals); + +const calcAverage = function (arr) { + let sum = 0; + for (let i = 0; i < totals.length; i++) { + sum += arr[i]; } - calcAverage(totals) -} + return sum / arr.length; +}; -console.log(sum) \ No newline at end of file +console.log(calcAverage(totals)); diff --git a/03-Developer-Skills/starter/index.html b/03-Developer-Skills/starter/index.html index fe26bd2b09..10587cf760 100644 --- a/03-Developer-Skills/starter/index.html +++ b/03-Developer-Skills/starter/index.html @@ -24,7 +24,7 @@ -

Developer Skills & Editor Setup

+

Developer Skills & Editor Setup!!!

diff --git a/03-Developer-Skills/starter/script.js b/03-Developer-Skills/starter/script.js index 939b2a2446..adcb058231 100644 --- a/03-Developer-Skills/starter/script.js +++ b/03-Developer-Skills/starter/script.js @@ -1,3 +1,34 @@ // Remember, we're gonna use strict mode in all scripts now! 'use strict'; +const temperature = [3, -2, -6, -1, 9, 13, 17, 15, 14, 9, 5]; +const temperature1 = [2, 5, 19, -9, 22]; + +const calcAmp = function (temp1, temp2) { + const temps = temp1.concat(temp2); + console.log(temps); + + let max = temps[0]; + let min = temps[0]; + + for (let i = 0; i < temps.length; i++) { + const curTemp = temps[i]; + if (typeof curTemp !== 'number') continue; + if (max < curTemp) max = curTemp; + if (min > curTemp) min = curTemp; + } + + console.log(max, min); + return max - min; +}; + +const amplitude = calcAmp(temperature, temperature1); +console.log(amplitude); +// task is to convert temperature to amplitude + +// what is amplitude + +// how to convert termperature to amplitude +// max - min is amplitude + +// what to do with error From b24ac7b0b1f924915bade7e7d99488cdd9e1575b Mon Sep 17 00:00:00 2001 From: KP-Tim Date: Mon, 5 Dec 2022 15:57:58 -0800 Subject: [PATCH 20/35] 12/5/ done --- 03-Developer-Skills/starter/index.html | 2 +- 03-Developer-Skills/starter/script.js | 14 ++++++++++++++ 2 files changed, 15 insertions(+), 1 deletion(-) diff --git a/03-Developer-Skills/starter/index.html b/03-Developer-Skills/starter/index.html index 10587cf760..fe26bd2b09 100644 --- a/03-Developer-Skills/starter/index.html +++ b/03-Developer-Skills/starter/index.html @@ -24,7 +24,7 @@ -

Developer Skills & Editor Setup!!!

+

Developer Skills & Editor Setup

diff --git a/03-Developer-Skills/starter/script.js b/03-Developer-Skills/starter/script.js index adcb058231..ac962a12db 100644 --- a/03-Developer-Skills/starter/script.js +++ b/03-Developer-Skills/starter/script.js @@ -1,6 +1,7 @@ // Remember, we're gonna use strict mode in all scripts now! 'use strict'; +/* const temperature = [3, -2, -6, -1, 9, 13, 17, 15, 14, 9, 5]; const temperature1 = [2, 5, 19, -9, 22]; @@ -32,3 +33,16 @@ console.log(amplitude); // max - min is amplitude // what to do with error +*/ + +const measureKelvin = function () { + const measurement = { + type: 'temp', + unit: 'celsius', + value: prompt('Degrees celsius:'), + }; + const kelvin = Number(measurement.value) + 273; + return kelvin; +}; + +console.log(measureKelvin(10)); From b0d6ba5c580874acf7951a9c514f0845969bdc4e Mon Sep 17 00:00:00 2001 From: KP-Tim Date: Tue, 6 Dec 2022 08:51:19 -0800 Subject: [PATCH 21/35] Code Challenge #1 starts Developer skills & editor setup lecture done. --- 03-Developer-Skills/starter/script.js | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/03-Developer-Skills/starter/script.js b/03-Developer-Skills/starter/script.js index ac962a12db..7dba0a633f 100644 --- a/03-Developer-Skills/starter/script.js +++ b/03-Developer-Skills/starter/script.js @@ -35,6 +35,7 @@ console.log(amplitude); // what to do with error */ +/* const measureKelvin = function () { const measurement = { type: 'temp', @@ -46,3 +47,10 @@ const measureKelvin = function () { }; console.log(measureKelvin(10)); + +const hi = 'hi'; +if (x === 23) console.log(23); +console.log(); +*/ + +//Coding Challenge #1 From 1bc21050e3b80316f7fbe45b7acac56306839c7c Mon Sep 17 00:00:00 2001 From: KP-Tim Date: Tue, 6 Dec 2022 10:00:42 -0800 Subject: [PATCH 22/35] HTML and CSS crash course begins Developer Challenge #1 Done --- 03-Developer-Skills/starter/script.js | 17 +++++++++++++++++ 1 file changed, 17 insertions(+) diff --git a/03-Developer-Skills/starter/script.js b/03-Developer-Skills/starter/script.js index 7dba0a633f..65191d9c81 100644 --- a/03-Developer-Skills/starter/script.js +++ b/03-Developer-Skills/starter/script.js @@ -54,3 +54,20 @@ console.log(); */ //Coding Challenge #1 +const data1 = [17, 21, 23]; +const data2 = [12, 5, -5, 0, 4]; +/* + ... 17ºC in 1 +days ... 21ºC in 2 days ... 23ºC in 3 days ..." +*/ + +const printForecast = function (arr) { + let string = ''; + for (let i = 0; i < arr.length; i++) { + string += ` ${arr[i]} in ${i + 1} days ...`; + } + console.log('...' + string); +}; + +printForecast(data1); +printForecast(data2); From 55a01bb022696e4aea0380de6aa21b4de382bb30 Mon Sep 17 00:00:00 2001 From: KP-Tim Date: Tue, 6 Dec 2022 15:52:31 -0800 Subject: [PATCH 23/35] last --- 04-HTML-CSS/starter/index.html | 31 +++++++++++++++++++++++++++++++ 04-HTML-CSS/starter/style.css | 31 +++++++++++++++++++++++++++++++ 2 files changed, 62 insertions(+) create mode 100644 04-HTML-CSS/starter/index.html create mode 100644 04-HTML-CSS/starter/style.css diff --git a/04-HTML-CSS/starter/index.html b/04-HTML-CSS/starter/index.html new file mode 100644 index 0000000000..19cf0fb55f --- /dev/null +++ b/04-HTML-CSS/starter/index.html @@ -0,0 +1,31 @@ + + + + + + + + Learning HTML & CSS + + +

Kancan is fun, but so is HTML and CSS!

+

+ You can learn Javascript without HTML and CSS, but for DOM manipulation + it's useful to have some basic ideas of HTML & CSS. You can learn more + about it + Tim on Udemy +

+

Another heading

+

Just another paragraph.

+ +
+

Your name here

+

Please fill in this form :)

+ + +
+ + diff --git a/04-HTML-CSS/starter/style.css b/04-HTML-CSS/starter/style.css new file mode 100644 index 0000000000..88b763c061 --- /dev/null +++ b/04-HTML-CSS/starter/style.css @@ -0,0 +1,31 @@ +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +body { + background-color: rgb(191, 167, 33); + font-family: Arial; + font-size: 20px; + padding: 50px; +} + +h1 { + font-size: 40px; + margin-bottom: 25px; +} + +h2 { + margin-bottom: 20px; + text-align: center; +} + +.first { + color: red; +} + +#your-name { + background-color: rgb(136, 155, 77); + border: 5px solid #444; +} From c25f866b034935ebb43449c09a08e1a78524df56 Mon Sep 17 00:00:00 2001 From: KP-Tim Date: Thu, 8 Dec 2022 14:49:54 -0800 Subject: [PATCH 24/35] Guess my number proejct in the middle just in case i forget to submit --- 05-Guess-My-Number/starter/index.html | 4 ++-- 05-Guess-My-Number/starter/script.js | 10 ++++++++++ 2 files changed, 12 insertions(+), 2 deletions(-) diff --git a/05-Guess-My-Number/starter/index.html b/05-Guess-My-Number/starter/index.html index b25c17540a..0a201c8cd7 100644 --- a/05-Guess-My-Number/starter/index.html +++ b/05-Guess-My-Number/starter/index.html @@ -5,11 +5,11 @@ - Guess My Number! + Kancan Style!
-

Guess My Number!

+

Kancan Style!

(Between 1 and 20)

?
diff --git a/05-Guess-My-Number/starter/script.js b/05-Guess-My-Number/starter/script.js index ad9a93a7c1..44559b6456 100644 --- a/05-Guess-My-Number/starter/script.js +++ b/05-Guess-My-Number/starter/script.js @@ -1 +1,11 @@ 'use strict'; + +let text = document.querySelector('.message').textContent; + +text = 'hello'; + +document.querySelector('.guess').textContent = 'x'; + +document.querySelector('.check').addEventListener('click', function () { + document.querySelector('.guess').value = 5; +}); From 94bdebce6120f24bd657cb74cd2363b60f5372ea Mon Sep 17 00:00:00 2001 From: KP-Tim Date: Thu, 8 Dec 2022 15:43:40 -0800 Subject: [PATCH 25/35] Dice roll update updated dice roll project --- 05-Guess-My-Number/starter/script.js | 15 +++++++++++---- 1 file changed, 11 insertions(+), 4 deletions(-) diff --git a/05-Guess-My-Number/starter/script.js b/05-Guess-My-Number/starter/script.js index 44559b6456..1042871804 100644 --- a/05-Guess-My-Number/starter/script.js +++ b/05-Guess-My-Number/starter/script.js @@ -1,11 +1,18 @@ 'use strict'; -let text = document.querySelector('.message').textContent; +// Generate random number +let randomNumber = Math.ceil(Math.random() * 10); +console.log(randomNumber); -text = 'hello'; +document.querySelector('.score').textContent = 10; -document.querySelector('.guess').textContent = 'x'; +// hide the randomNumber later +document.querySelector('.number').textContent = randomNumber; document.querySelector('.check').addEventListener('click', function () { - document.querySelector('.guess').value = 5; + const guess = Number(document.querySelector('.guess').value); + console.log(guess); + if (guess === randomNumber) { + console.log('match'); + } else if () }); From f5e5c76c1bbb204f8ad5ac93e8e89115797bad5e Mon Sep 17 00:00:00 2001 From: KP-Tim Date: Fri, 9 Dec 2022 07:50:35 -0800 Subject: [PATCH 26/35] I guess we changed it --- 05-Guess-My-Number/starter/script.js | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/05-Guess-My-Number/starter/script.js b/05-Guess-My-Number/starter/script.js index 1042871804..6736524a2f 100644 --- a/05-Guess-My-Number/starter/script.js +++ b/05-Guess-My-Number/starter/script.js @@ -1,10 +1,10 @@ 'use strict'; // Generate random number -let randomNumber = Math.ceil(Math.random() * 10); +const randomNumber = Math.trunc(Math.random() * 10) + 1; console.log(randomNumber); -document.querySelector('.score').textContent = 10; +const score = document.querySelector('.score').textContent; // hide the randomNumber later document.querySelector('.number').textContent = randomNumber; @@ -14,5 +14,7 @@ document.querySelector('.check').addEventListener('click', function () { console.log(guess); if (guess === randomNumber) { console.log('match'); - } else if () + } else if (guess > randomNumber) { + score; + } }); From 917a61e76a0999bdccfee655e59c20c1fba13640 Mon Sep 17 00:00:00 2001 From: KP-Tim Date: Fri, 9 Dec 2022 14:40:08 -0800 Subject: [PATCH 27/35] Keep going random game --- 05-Guess-My-Number/starter/script.js | 28 +++++++++++++++++++--------- 1 file changed, 19 insertions(+), 9 deletions(-) diff --git a/05-Guess-My-Number/starter/script.js b/05-Guess-My-Number/starter/script.js index 6736524a2f..a5a7401d20 100644 --- a/05-Guess-My-Number/starter/script.js +++ b/05-Guess-My-Number/starter/script.js @@ -1,20 +1,30 @@ 'use strict'; // Generate random number -const randomNumber = Math.trunc(Math.random() * 10) + 1; -console.log(randomNumber); +const secretNumber = Math.trunc(Math.random() * 10) + 1; +console.log(secretNumber); -const score = document.querySelector('.score').textContent; +// hide the secretNumber later +document.querySelector('.number').textContent = secretNumber; -// hide the randomNumber later -document.querySelector('.number').textContent = randomNumber; +let score = 20; document.querySelector('.check').addEventListener('click', function () { const guess = Number(document.querySelector('.guess').value); console.log(guess); - if (guess === randomNumber) { - console.log('match'); - } else if (guess > randomNumber) { - score; + if (!guess) { + document.querySelector('.message').textContent = '⛔ No Number!'; + } else if (guess === secretNumber) { + document.querySelector('.message').textContent = '🎉 Correct Number!'; + } else if (score <= 1) { + document.querySelector('.message').textContent = 'Game Over!'; + } else if (guess > secretNumber) { + document.querySelector('.message').textContent = '📈 Too high!'; + score--; + document.querySelector('.score').textContent = score; + } else if (guess < secretNumber) { + document.querySelector('.message').textContent = '📉 Too low!'; + score--; + document.querySelector('.score').textContent = score; } }); From 4df5698f67569caba79d5b0819fd91151e5158bc Mon Sep 17 00:00:00 2001 From: KP-Tim Date: Fri, 9 Dec 2022 15:52:20 -0800 Subject: [PATCH 28/35] Last update --- 05-Guess-My-Number/starter/script.js | 24 ++++++++++++++++-------- 1 file changed, 16 insertions(+), 8 deletions(-) diff --git a/05-Guess-My-Number/starter/script.js b/05-Guess-My-Number/starter/script.js index a5a7401d20..b2526a2938 100644 --- a/05-Guess-My-Number/starter/script.js +++ b/05-Guess-My-Number/starter/script.js @@ -16,15 +16,23 @@ document.querySelector('.check').addEventListener('click', function () { document.querySelector('.message').textContent = '⛔ No Number!'; } else if (guess === secretNumber) { document.querySelector('.message').textContent = '🎉 Correct Number!'; - } else if (score <= 1) { - document.querySelector('.message').textContent = 'Game Over!'; } else if (guess > secretNumber) { - document.querySelector('.message').textContent = '📈 Too high!'; - score--; - document.querySelector('.score').textContent = score; + if (score > 1) { + document.querySelector('.message').textContent = '📈 Too high!'; + score--; + document.querySelector('.score').textContent = score; + } else { + document.querySelector('.message').textContent = 'Game Over!'; + document.querySelector('.score').textContent = 0; + } } else if (guess < secretNumber) { - document.querySelector('.message').textContent = '📉 Too low!'; - score--; - document.querySelector('.score').textContent = score; + if (score > 1) { + document.querySelector('.message').textContent = '📉 Too low!'; + score--; + document.querySelector('.score').textContent = score; + } else { + document.querySelector('.message').textContent = 'Game Over!'; + document.querySelector('.score').textContent = 0; + } } }); From 305574e33e5df88a487bce789119cb73e65c18e1 Mon Sep 17 00:00:00 2001 From: KP-Tim <79594296+KP-Tim@users.noreply.github.com> Date: Fri, 9 Dec 2022 21:35:48 -0800 Subject: [PATCH 29/35] Random number project almost done done except implementing high score --- 05-Guess-My-Number/starter/script.js | 25 +++++++++++++++++++++---- 1 file changed, 21 insertions(+), 4 deletions(-) diff --git a/05-Guess-My-Number/starter/script.js b/05-Guess-My-Number/starter/script.js index b2526a2938..5e3f1bfd81 100644 --- a/05-Guess-My-Number/starter/script.js +++ b/05-Guess-My-Number/starter/script.js @@ -1,21 +1,26 @@ 'use strict'; // Generate random number -const secretNumber = Math.trunc(Math.random() * 10) + 1; +let secretNumber = Math.trunc(Math.random() * 10) + 1; console.log(secretNumber); -// hide the secretNumber later -document.querySelector('.number').textContent = secretNumber; - let score = 20; +// when check button is clicked document.querySelector('.check').addEventListener('click', function () { const guess = Number(document.querySelector('.guess').value); console.log(guess); + // When there is no input if (!guess) { document.querySelector('.message').textContent = '⛔ No Number!'; + // When player wins } else if (guess === secretNumber) { + document.querySelector('body').style.backgroundColor = '#60b347'; + document.querySelector('.number').style.width = '30rem'; document.querySelector('.message').textContent = '🎉 Correct Number!'; + // hide the secretNumber later + document.querySelector('.number').textContent = secretNumber; + // When player guesses higher number } else if (guess > secretNumber) { if (score > 1) { document.querySelector('.message').textContent = '📈 Too high!'; @@ -25,6 +30,7 @@ document.querySelector('.check').addEventListener('click', function () { document.querySelector('.message').textContent = 'Game Over!'; document.querySelector('.score').textContent = 0; } + // When player guesses lower number } else if (guess < secretNumber) { if (score > 1) { document.querySelector('.message').textContent = '📉 Too low!'; @@ -36,3 +42,14 @@ document.querySelector('.check').addEventListener('click', function () { } } }); +// When again button is clicked +document.querySelector('.again').addEventListener('click', function () { + score = 20; + secretNumber = Math.trunc(Math.random() * 10) + 1; + document.querySelector('.message').textContent = 'Start guessing...'; + document.querySelector('.score').textContent = score; + document.querySelector('.number').style.width = '15rem'; + document.querySelector('body').style.backgroundColor = '#222'; + document.querySelector('.guess').value = ''; + document.querySelector('.number').textContent = '?'; +}); From 949eb15e468956a99c813f6bdc40e9b7ed055972 Mon Sep 17 00:00:00 2001 From: KP-Tim <79594296+KP-Tim@users.noreply.github.com> Date: Sat, 10 Dec 2022 17:17:07 -0800 Subject: [PATCH 30/35] UI project starts Guessing game finished --- 05-Guess-My-Number/starter/script.js | 73 ++++++++++++++++++---------- 1 file changed, 48 insertions(+), 25 deletions(-) diff --git a/05-Guess-My-Number/starter/script.js b/05-Guess-My-Number/starter/script.js index 5e3f1bfd81..543827ad3e 100644 --- a/05-Guess-My-Number/starter/script.js +++ b/05-Guess-My-Number/starter/script.js @@ -1,10 +1,20 @@ 'use strict'; // Generate random number -let secretNumber = Math.trunc(Math.random() * 10) + 1; +let secretNumber = Math.trunc(Math.random() * 20) + 1; console.log(secretNumber); let score = 20; +let highScore = 0; + +// Display message +let displayMessage = function (message) { + document.querySelector('.message').textContent = message; +}; + +let displayScore = function (score) { + document.querySelector('.score').textContent = score; +}; // when check button is clicked document.querySelector('.check').addEventListener('click', function () { @@ -12,42 +22,55 @@ document.querySelector('.check').addEventListener('click', function () { console.log(guess); // When there is no input if (!guess) { - document.querySelector('.message').textContent = '⛔ No Number!'; + displayMessage('⛔ No Number!'); // When player wins } else if (guess === secretNumber) { document.querySelector('body').style.backgroundColor = '#60b347'; document.querySelector('.number').style.width = '30rem'; - document.querySelector('.message').textContent = '🎉 Correct Number!'; - // hide the secretNumber later + displayMessage('🎉 Correct Number!'); + // show secret number when player wins document.querySelector('.number').textContent = secretNumber; - // When player guesses higher number - } else if (guess > secretNumber) { - if (score > 1) { - document.querySelector('.message').textContent = '📈 Too high!'; - score--; - document.querySelector('.score').textContent = score; - } else { - document.querySelector('.message').textContent = 'Game Over!'; - document.querySelector('.score').textContent = 0; - } - // When player guesses lower number - } else if (guess < secretNumber) { - if (score > 1) { - document.querySelector('.message').textContent = '📉 Too low!'; - score--; - document.querySelector('.score').textContent = score; - } else { - document.querySelector('.message').textContent = 'Game Over!'; - document.querySelector('.score').textContent = 0; + // check highscore and replace if necess... + if (score > highScore) { + highScore = score; + document.querySelector('.highscore').textContent = highScore; } + // when guess is different than secretNumber + } else if (guess !== secretNumber) { + displayMessage(guess > secretNumber ? '📈 Too high!' : '📉 Too low!'); + score--; + displayScore(score); + } else { + displayMessage('Game Over!'); + displayMessage(0); } + // When player guesses higher number + // else if (guess > secretNumber) { + // if (score > 1) { + // document.querySelector('.message').textContent = '📈 Too high!'; + // score--; + // document.querySelector('.score').textContent = score; + // } else { + // document.querySelector('.message').textContent = 'Game Over!'; + // document.querySelector('.score').textContent = 0; + // } + // // When player guesses lower number + // } else if (guess < secretNumber) { + // if (score > 1) { + // document.querySelector('.message').textContent = '📉 Too low!'; + // score--; + // document.querySelector('.score').textContent = score; + // } else { + // document.querySelector('.message').textContent = 'Game Over!'; + // document.querySelector('.score').textContent = 0; + // } }); // When again button is clicked document.querySelector('.again').addEventListener('click', function () { score = 20; secretNumber = Math.trunc(Math.random() * 10) + 1; - document.querySelector('.message').textContent = 'Start guessing...'; - document.querySelector('.score').textContent = score; + displayMessage('Start guessing...'); + displayMessage(score); document.querySelector('.number').style.width = '15rem'; document.querySelector('body').style.backgroundColor = '#222'; document.querySelector('.guess').value = ''; From 143a6860f9830aca831928b54b26893b628f1406 Mon Sep 17 00:00:00 2001 From: KP-Tim Date: Mon, 12 Dec 2022 12:53:45 -0800 Subject: [PATCH 31/35] Random Dice game 1 Changed inital setup and rolling dice player 1 --- 06-Modal/starter/script.js | 72 +++++++++++++++++++++++++++++++++++ 07-Pig-Game/starter/script.js | 27 +++++++++++++ 07-Pig-Game/starter/style.css | 4 ++ 3 files changed, 103 insertions(+) diff --git a/06-Modal/starter/script.js b/06-Modal/starter/script.js index ad9a93a7c1..bd6dd702e6 100644 --- a/06-Modal/starter/script.js +++ b/06-Modal/starter/script.js @@ -1 +1,73 @@ 'use strict'; + +/* +const showModal = document.querySelectorAll('.show-modal'); +const modal = document.querySelector('.modal'); +const closeModal = document.querySelector('.close-modal'); +const overlay = document.querySelector('.overlay'); + +const openModals = function () { + modal.classList.remove('hidden'); + overlay.classList.remove('hidden'); +}; + +const closeModals = function () { + modal.classList.add('hidden'); + overlay.classList.add('hidden'); +}; + +// show modals +for (let i = 0; i < showModal.length; i++) { + showModal[i].addEventListener('click', openModals); +} + +closeModal.addEventListener('click', closeModals); +overlay.addEventListener('click', closeModals); + +// // close modals +// closeModal.addEventListener('click', function () { +// modal.classList.add('hidden'); +// overlay.classList.add('hidden'); +// }); + +// // close modal with clicking background +// overlay.addEventListener('click', function () { +// modal.classList.add('hidden'); +// overlay.classList.add('hidden'); +// }); + +document.addEventListener('keydown', function (e) { + if (e.key === 'Escape') { + closeModals(); + } +}); +*/ + +const showModal = document.querySelectorAll('.show-modal'); +const modal = document.querySelector('.modal'); +const overlay = document.querySelector('.overlay'); +const closeModal = document.querySelector('.close-modal'); + +const closeModals = function () { + modal.classList.add('hidden'); + overlay.classList.add('hidden'); +}; + +const showModals = function () { + modal.classList.remove('hidden'); + overlay.classList.remove('hidden'); +}; + +for (let i = 0; i < showModal.length; i++) { + showModal[i].addEventListener('click', showModals); +} + +closeModal.addEventListener('click', closeModals); +overlay.addEventListener('click', closeModals); + +document.addEventListener('keydown', function (e) { + console.log(e); + if (e.key === 'Escape' && !modal.classList.contains('hidden')) { + closeModals(); + } +}); diff --git a/07-Pig-Game/starter/script.js b/07-Pig-Game/starter/script.js index ad9a93a7c1..7b96877917 100644 --- a/07-Pig-Game/starter/script.js +++ b/07-Pig-Game/starter/script.js @@ -1 +1,28 @@ 'use strict'; + +// Buttons +const btnRoll = document.querySelector('.btn--roll'); +const btnNew = document.querySelector('.btn--new'); +const btnHold = document.querySelector('.btn--hold'); + +// Selecting elements +const score0El = document.querySelector('#score--0'); +const score1El = document.querySelector('#score--1'); +const diceEl = document.querySelector('.dice'); + +// Intial Setting +// Set the starting score to 0 +score0El.textContent = 0; +score1El.textContent = 0; +// Hide the dice +diceEl.classList.add('hidden'); + +// User rolls dice +btnRoll.addEventListener('click', function () { + // Generate randome dice roll + const randomDice = Math.trunc(Math.random() * 6) + 1; + // Display dice roll + diceEl.classList.remove('hidden'); + // Display rolled dice number + diceEl.src = `dice-${randomDice}.png`; +}); diff --git a/07-Pig-Game/starter/style.css b/07-Pig-Game/starter/style.css index dcf788f011..555ea263e0 100644 --- a/07-Pig-Game/starter/style.css +++ b/07-Pig-Game/starter/style.css @@ -165,3 +165,7 @@ main { font-weight: 700; color: #c7365f; } + +.hidden { + display: none; +} From dc1cb411a1c01bded2249782bd52d4c6861f861a Mon Sep 17 00:00:00 2001 From: KP-Tim Date: Mon, 12 Dec 2022 14:43:19 -0800 Subject: [PATCH 32/35] Rolls dice and update player scores --- 07-Pig-Game/starter/script.js | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/07-Pig-Game/starter/script.js b/07-Pig-Game/starter/script.js index 7b96877917..ba71a2ef0b 100644 --- a/07-Pig-Game/starter/script.js +++ b/07-Pig-Game/starter/script.js @@ -17,6 +17,9 @@ score1El.textContent = 0; // Hide the dice diceEl.classList.add('hidden'); +// Current score +let currentScore = 0; + // User rolls dice btnRoll.addEventListener('click', function () { // Generate randome dice roll @@ -25,4 +28,7 @@ btnRoll.addEventListener('click', function () { diceEl.classList.remove('hidden'); // Display rolled dice number diceEl.src = `dice-${randomDice}.png`; + // Check if a number is one + if (randomDice !== 1) { + } }); From f008f2911d23700d93ed3a79aa0a6b963e9a1a25 Mon Sep 17 00:00:00 2001 From: KP-Tim Date: Tue, 13 Dec 2022 15:59:21 -0800 Subject: [PATCH 33/35] check --- 07-Pig-Game/final/index.html | 2 +- 07-Pig-Game/starter/script.js | 44 +++++++++++++++++++++++++++++++++++ 2 files changed, 45 insertions(+), 1 deletion(-) diff --git a/07-Pig-Game/final/index.html b/07-Pig-Game/final/index.html index f72c8f4e92..964cbd1b4c 100644 --- a/07-Pig-Game/final/index.html +++ b/07-Pig-Game/final/index.html @@ -5,7 +5,7 @@ - Pig Game + Final
diff --git a/07-Pig-Game/starter/script.js b/07-Pig-Game/starter/script.js index ba71a2ef0b..0b970b397b 100644 --- a/07-Pig-Game/starter/script.js +++ b/07-Pig-Game/starter/script.js @@ -5,11 +5,19 @@ const btnRoll = document.querySelector('.btn--roll'); const btnNew = document.querySelector('.btn--new'); const btnHold = document.querySelector('.btn--hold'); +// Current Score +const current0El = document.querySelector('#current--0'); +const current1El = document.querySelector('#current--1'); + // Selecting elements const score0El = document.querySelector('#score--0'); const score1El = document.querySelector('#score--1'); const diceEl = document.querySelector('.dice'); +// Selecting players +const player0El = document.querySelector('.player--0'); +const player1El = document.querySelector('.player--1'); + // Intial Setting // Set the starting score to 0 score0El.textContent = 0; @@ -19,6 +27,8 @@ diceEl.classList.add('hidden'); // Current score let currentScore = 0; +let activePlayer = 0; +let totalScore = [0, 0]; // User rolls dice btnRoll.addEventListener('click', function () { @@ -30,5 +40,39 @@ btnRoll.addEventListener('click', function () { diceEl.src = `dice-${randomDice}.png`; // Check if a number is one if (randomDice !== 1) { + currentScore += randomDice; + document.getElementById(`current--${activePlayer}`).textContent = + currentScore; + } else { + // If it is not one + document.getElementById(`current--${activePlayer}`).textContent = 0; + console.log('changed'); + // Switch player + activePlayer = activePlayer ? 0 : 1; + currentScore = 0; + // Switch player scores and background color + document.getElementById(`current--${activePlayer}`).textContent = + currentScore; + player0El.classList.toggle('player--active'); + player1El.classList.toggle('player--active'); + console.log(activePlayer); } + console.log(currentScore); +}); + +btnHold.addEventListener('click', function () { + totalScore[`${activePlayer}`] = currentScore; + document.querySelector(`#score--${activePlayer}`).textContent = + totalScore[`${activePlayer}`]; + console.log(totalScore); + document.getElementById(`score--${activePlayer}`).textContent = currentScore; + // Switch player scores and background color + document.getElementById(`current--${activePlayer}`).textContent = 0; + activePlayer = activePlayer ? 0 : 1; + player0El.classList.toggle('player--active'); + player1El.classList.toggle('player--active'); + totalScore[`${activePlayer}`] = currentScore; + document.querySelector(`#score--${activePlayer}`).textContent = + totalScore[`${activePlayer}`]; + console.log(activePlayer); }); From 5698c7ae887ce6634b422c6bb2947797f29f6063 Mon Sep 17 00:00:00 2001 From: KP-Tim Date: Wed, 14 Dec 2022 12:18:29 -0800 Subject: [PATCH 34/35] Pig-Game Done Initially I created the project and finished it. --- 07-Pig-Game/starter/script.js | 108 ++++++++++++++++++++++------------ 1 file changed, 70 insertions(+), 38 deletions(-) diff --git a/07-Pig-Game/starter/script.js b/07-Pig-Game/starter/script.js index 0b970b397b..3d80ac1409 100644 --- a/07-Pig-Game/starter/script.js +++ b/07-Pig-Game/starter/script.js @@ -29,50 +29,82 @@ diceEl.classList.add('hidden'); let currentScore = 0; let activePlayer = 0; let totalScore = [0, 0]; +let isGameOver = false; + +// Switch player function +const switchPlayer = function () { + // Switch player + document.getElementById(`current--${activePlayer}`).textContent = 0; + // Switch player scores and background color + activePlayer = activePlayer ? 0 : 1; + // Set current score to 0 + currentScore = 0; + // Switch player scores and background color + player0El.classList.toggle('player--active'); + player1El.classList.toggle('player--active'); +}; // User rolls dice btnRoll.addEventListener('click', function () { - // Generate randome dice roll - const randomDice = Math.trunc(Math.random() * 6) + 1; - // Display dice roll - diceEl.classList.remove('hidden'); - // Display rolled dice number - diceEl.src = `dice-${randomDice}.png`; - // Check if a number is one - if (randomDice !== 1) { - currentScore += randomDice; - document.getElementById(`current--${activePlayer}`).textContent = - currentScore; - } else { - // If it is not one - document.getElementById(`current--${activePlayer}`).textContent = 0; - console.log('changed'); - // Switch player - activePlayer = activePlayer ? 0 : 1; - currentScore = 0; - // Switch player scores and background color - document.getElementById(`current--${activePlayer}`).textContent = - currentScore; - player0El.classList.toggle('player--active'); - player1El.classList.toggle('player--active'); - console.log(activePlayer); + if (!isGameOver) { + // Generate randome dice roll + const randomDice = Math.trunc(Math.random() * 6) + 1; + // Display dice roll + diceEl.classList.remove('hidden'); + // Display rolled dice number + diceEl.src = `dice-${randomDice}.png`; + // Check if a number is one + if (randomDice !== 1) { + currentScore += randomDice; + document.getElementById(`current--${activePlayer}`).textContent = + currentScore; + } else { + switchPlayer(); + } + console.log(currentScore); } - console.log(currentScore); }); btnHold.addEventListener('click', function () { - totalScore[`${activePlayer}`] = currentScore; - document.querySelector(`#score--${activePlayer}`).textContent = - totalScore[`${activePlayer}`]; - console.log(totalScore); - document.getElementById(`score--${activePlayer}`).textContent = currentScore; - // Switch player scores and background color - document.getElementById(`current--${activePlayer}`).textContent = 0; - activePlayer = activePlayer ? 0 : 1; - player0El.classList.toggle('player--active'); - player1El.classList.toggle('player--active'); - totalScore[`${activePlayer}`] = currentScore; - document.querySelector(`#score--${activePlayer}`).textContent = - totalScore[`${activePlayer}`]; + if (!isGameOver) { + totalScore[activePlayer] += currentScore; + document.getElementById(`score--${activePlayer}`).textContent = + totalScore[activePlayer]; + console.log(totalScore); + // If a player wins + if (totalScore[activePlayer] >= 20) { + // Game over + isGameOver = true; + // Display winner + document + .querySelector(`.player--${activePlayer}`) + .classList.add('player--winner'); + document + .querySelector(`.player--${activePlayer}`) + .classList.remove('player--active'); + // Hide the dice and score to zero + diceEl.classList.add('hidden'); + document.getElementById(`current--${activePlayer}`).textContent = 0; + } else { + switchPlayer(); + } + } +}); + +btnNew.addEventListener('click', function () { + if (isGameOver || !isGameOver) { + isGameOver = false; + totalScore = [0, 0]; + currentScore = 0; + activePlayer = 0; + current0El.textContent = 0; + current1El.textContent = 0; + score0El.textContent = 0; + score1El.textContent = 0; + document + .querySelector(`.player--${activePlayer}`) + .classList.remove('player--winner'); + console.log(totalScore); + } console.log(activePlayer); }); From 2f5853c8f41b7301ed0eb55b12fd75a88de36902 Mon Sep 17 00:00:00 2001 From: KP-Tim Date: Wed, 14 Dec 2022 15:27:58 -0800 Subject: [PATCH 35/35] Revised Pig Game Myself --- 07-Pig-Game/starter/script.js | 50 +++++++++++++++-------------------- 1 file changed, 22 insertions(+), 28 deletions(-) diff --git a/07-Pig-Game/starter/script.js b/07-Pig-Game/starter/script.js index 3d80ac1409..2cbfc93612 100644 --- a/07-Pig-Game/starter/script.js +++ b/07-Pig-Game/starter/script.js @@ -18,18 +18,28 @@ const diceEl = document.querySelector('.dice'); const player0El = document.querySelector('.player--0'); const player1El = document.querySelector('.player--1'); -// Intial Setting -// Set the starting score to 0 -score0El.textContent = 0; -score1El.textContent = 0; -// Hide the dice -diceEl.classList.add('hidden'); - // Current score -let currentScore = 0; -let activePlayer = 0; -let totalScore = [0, 0]; -let isGameOver = false; +let currentScore, activePlayer, totalScore, isGameOver; + +const init = function () { + currentScore = 0; + activePlayer = 0; + totalScore = [0, 0]; + isGameOver = false; + + diceEl.classList.add('hidden'); + score0El.textContent = 0; + score1El.textContent = 0; + current0El.textContent = 0; + current1El.textContent = 0; + + player0El.classList.remove('player--winner'); + player1El.classList.remove('player--winner'); + player0El.classList.add('player--active'); + player1El.classList.remove('player--active'); +}; + +init(); // Switch player function const switchPlayer = function () { @@ -91,20 +101,4 @@ btnHold.addEventListener('click', function () { } }); -btnNew.addEventListener('click', function () { - if (isGameOver || !isGameOver) { - isGameOver = false; - totalScore = [0, 0]; - currentScore = 0; - activePlayer = 0; - current0El.textContent = 0; - current1El.textContent = 0; - score0El.textContent = 0; - score1El.textContent = 0; - document - .querySelector(`.player--${activePlayer}`) - .classList.remove('player--winner'); - console.log(totalScore); - } - console.log(activePlayer); -}); +btnNew.addEventListener('click', init);