diff --git a/Week3/LESSONPLAN.md b/Week3/Masoud/LESSONPLAN.md similarity index 100% rename from Week3/LESSONPLAN.md rename to Week3/Masoud/LESSONPLAN.md diff --git a/Week3/MAKEME.md b/Week3/Masoud/MAKEME.md similarity index 100% rename from Week3/MAKEME.md rename to Week3/Masoud/MAKEME.md diff --git a/Week3/README.md b/Week3/Masoud/README.md similarity index 100% rename from Week3/README.md rename to Week3/Masoud/README.md diff --git a/Week3/js-exercises/ex1-AddSix.js b/Week3/Masoud/js-exercises/ex1-AddSix.js similarity index 69% rename from Week3/js-exercises/ex1-AddSix.js rename to Week3/Masoud/js-exercises/ex1-AddSix.js index 67e8bb63f..2f812940a 100644 --- a/Week3/js-exercises/ex1-AddSix.js +++ b/Week3/Masoud/js-exercises/ex1-AddSix.js @@ -10,10 +10,18 @@ Call the function three times. The return values should be: */ -function createBase( /* ???? */ ) { +function createBase(num) { // Put here your logic... + function add(num) { + return num + 9; + } + return add; } const addSix = createBase(6); +console.log(addSix(6)); +console.log(addSix(15)); +console.log(addSix(24)); // Put here your function calls... + diff --git a/Week3/Masoud/js-exercises/ex2-RemoveDuplicates.js b/Week3/Masoud/js-exercises/ex2-RemoveDuplicates.js new file mode 100644 index 000000000..7f3c25f7c --- /dev/null +++ b/Week3/Masoud/js-exercises/ex2-RemoveDuplicates.js @@ -0,0 +1,19 @@ +const letters = ['a', 'b', 'b', 'c', 'd', 'a', 'e', 'f', 'f', 'c', 'b']; +const nonDuplicates = []; + +function removeDuplicates(array) { + nonDuplicates.push(array[0]); + for (let i = 1; i < array.length; i++) { + const x = []; + for (let j = 0; j < i; j++) { + if (array[j] == array[i]) { + x.push(array[j]); + } + } + if (x.length == 0) { + nonDuplicates.push(array[i]); + } + } + return nonDuplicates; +} +console.log(removeDuplicates(letters)); \ No newline at end of file diff --git a/Week3/js-exercises/ex3-GuessTheOutput.js b/Week3/Masoud/js-exercises/ex3-GuessTheOutput.js similarity index 68% rename from Week3/js-exercises/ex3-GuessTheOutput.js rename to Week3/Masoud/js-exercises/ex3-GuessTheOutput.js index 7d783ceef..926de36b8 100644 --- a/Week3/js-exercises/ex3-GuessTheOutput.js +++ b/Week3/Masoud/js-exercises/ex3-GuessTheOutput.js @@ -18,4 +18,6 @@ const x = (function () { }; })(); -x(); \ No newline at end of file +x(); + +//Output is alert to brower number 12, change the value of a to 12 because a declares as a global variable. \ No newline at end of file diff --git a/Week3/js-exercises/ex4-GuessMore.js b/Week3/Masoud/js-exercises/ex4-GuessMore.js similarity index 69% rename from Week3/js-exercises/ex4-GuessMore.js rename to Week3/Masoud/js-exercises/ex4-GuessMore.js index 81a4ec273..0d48e12f9 100644 --- a/Week3/js-exercises/ex4-GuessMore.js +++ b/Week3/Masoud/js-exercises/ex4-GuessMore.js @@ -15,7 +15,7 @@ function f1(val) { return val; } f1(x); -console.log(x); +console.log(f1(x)); const y = { x: 9 @@ -26,4 +26,6 @@ function f2(val) { return val; } f2(y); -console.log(y); \ No newline at end of file +console.log(f2(y)); + +// In this example, x has 2 parts, one of them is varible and the other is property of object y \ No newline at end of file diff --git a/Week3/js-exercises/ex5-LotteryMachine.js b/Week3/Masoud/js-exercises/ex5-LotteryMachine.js similarity index 55% rename from Week3/js-exercises/ex5-LotteryMachine.js rename to Week3/Masoud/js-exercises/ex5-LotteryMachine.js index ad09b963c..588305ef0 100644 --- a/Week3/js-exercises/ex5-LotteryMachine.js +++ b/Week3/Masoud/js-exercises/ex5-LotteryMachine.js @@ -29,10 +29,41 @@ Don't you just love the thrill of the lottery? What if I told you we can make ou function threeFive(startIndex, stopIndex, threeCallback, fiveCallback) { const numbers = []; // make array + if (startIndex > stopIndex) { + console.log('Change the values: The stop number should be greater than start number') + } else { + let pointer = startIndex; + for (let i = 0; i < stopIndex - startIndex + 1; i++) { + numbers.push(pointer); + pointer++; + } + } // start at beginning of array and check if you should call threeCallback or fiveCallback or go on to next + numbers.forEach(function (arr) { + if (arr % 3 == 0 && arr % 5 == 0) { + threeCallback(arr); + fiveCallback(arr); + } else if (arr % 5 == 0) { + fiveCallback(arr); + } else if (arr % 3 == 0) { + threeCallback(arr); + } else { + console.log('number ' + arr + ' is not divisible by 3 or 5'); + } + }) + + } -threeFive(10, 15, sayThree, sayFive); +threeFive(1, 10, sayThree, sayFive); // Should create an array [10,11,12,13,14,15] -// and call sayFive, sayThree, sayThree, sayFive \ No newline at end of file +// and call sayFive, sayThree, sayThree, sayFive + +function sayThree(arr) { + console.log('Number ' + arr + ' is divisible by 3'); +} + +function sayFive(arr) { + console.log('Number ' + arr + ' is divisible by 5'); +} diff --git a/Week3/old-homework/step2-1.js b/Week3/Masoud/old-homework/step2-1.js similarity index 100% rename from Week3/old-homework/step2-1.js rename to Week3/Masoud/old-homework/step2-1.js diff --git a/Week3/old-homework/step2-2.js b/Week3/Masoud/old-homework/step2-2.js similarity index 100% rename from Week3/old-homework/step2-2.js rename to Week3/Masoud/old-homework/step2-2.js diff --git a/Week3/old-homework/step2-3.js b/Week3/Masoud/old-homework/step2-3.js similarity index 100% rename from Week3/old-homework/step2-3.js rename to Week3/Masoud/old-homework/step2-3.js diff --git a/Week3/old-homework/step2-4.js b/Week3/Masoud/old-homework/step2-4.js similarity index 100% rename from Week3/old-homework/step2-4.js rename to Week3/Masoud/old-homework/step2-4.js diff --git a/Week3/old-homework/step2-5.js b/Week3/Masoud/old-homework/step2-5.js similarity index 100% rename from Week3/old-homework/step2-5.js rename to Week3/Masoud/old-homework/step2-5.js diff --git a/Week3/old-homework/step2-6.js b/Week3/Masoud/old-homework/step2-6.js similarity index 100% rename from Week3/old-homework/step2-6.js rename to Week3/Masoud/old-homework/step2-6.js diff --git a/Week3/old-homework/step2-7.js b/Week3/Masoud/old-homework/step2-7.js similarity index 100% rename from Week3/old-homework/step2-7.js rename to Week3/Masoud/old-homework/step2-7.js diff --git a/Week3/old-homework/step3-bonus.js b/Week3/Masoud/old-homework/step3-bonus.js similarity index 100% rename from Week3/old-homework/step3-bonus.js rename to Week3/Masoud/old-homework/step3-bonus.js diff --git a/Week3/old-homework/step3.js b/Week3/Masoud/old-homework/step3.js similarity index 100% rename from Week3/old-homework/step3.js rename to Week3/Masoud/old-homework/step3.js diff --git a/Week3/Masoud/project/index.html b/Week3/Masoud/project/index.html new file mode 100644 index 000000000..d53d50ff8 --- /dev/null +++ b/Week3/Masoud/project/index.html @@ -0,0 +1,57 @@ + + + + + + + Tip Calculator + + + + +
+

Tip Calculator

+
+
+ + + + + + + + + + +
+ +
+

TIP AMOUNT

+ - + - +
+ +
+ + + +
+ + + + + + \ No newline at end of file diff --git a/Week3/Masoud/project/index.js b/Week3/Masoud/project/index.js new file mode 100644 index 000000000..f8b49dccc --- /dev/null +++ b/Week3/Masoud/project/index.js @@ -0,0 +1,41 @@ +//declare variables +const bill = document.getElementById('bill'); +const service = document.getElementById('service'); +const people = document.getElementById('people'); +const calculate = document.getElementById('calculate'); +const amount = document.getElementById('amount'); +const each = document.getElementById('each'); +const modal = document.getElementById('modal'); +const close = document.getElementById('close'); + +// When press on calculate button +calculate.addEventListener('click', calculateTip); + +//calculate tip +function calculateTip(e) { + e.preventDefault(); + + // Display modal element when at least one field empty + if (bill.value == '' || service.value == 'default' || people.value == '') { + modal.style.display = 'block'; + close.addEventListener('click', function () { + modal.style.display = 'none'; + clearTimeout(timing); + }); + const timing = setTimeout(function () { + modal.style.display = 'none'; + }, 5000); + //transition modal + modal.classList.remove('trans'); + setTimeout(function () { + modal.classList.add('trans'); + }, 5); + } else { //Calculate tip when all fields are filled + amount.textContent = parseFloat(service.value * bill.value / 100 / people.value).toFixed(2); + each.textContent = 'each'; + each.style.display = 'block'; + if (people.value == 1) { + each.style.display = 'none'; + } + } +} diff --git a/Week3/Masoud/project/style.css b/Week3/Masoud/project/style.css new file mode 100644 index 000000000..8ec484ec4 --- /dev/null +++ b/Week3/Masoud/project/style.css @@ -0,0 +1,192 @@ +*{ + padding: 0; + margin: 0; + box-sizing: border-box; +} + +body{ + font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif; + font-size: 20px; + background-color: aquamarine; + color: azure; +} + +#app{ + width: 450px; + margin: 0; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + background-color: coral; + padding: 30px ; + border-radius: 10px; +} + +h1{ + text-align: center; + margin-bottom: 20px; + font-size: 2.5em; +} + +hr{ + border: 1px solid white; +} + +form{ + margin-top: 20px; + + } + +label{ + font-size: 1.2em; + margin: 10px 0; +} + +input[type=number], select { + width: 100%; + padding: 5px 20px; + margin: 8px auto; + font-size: 1em; + text-align: center; + text-align-last: center; +} + +label:first-child::after{ + content: '$'; + color: black; + position: absolute; + top: 165px; + left: 50px; + font-size: 1.4em; +} + +span, label, button, select, input{ + display: block; +} + +button{ + margin:50px 10px 0 0; + width: 100px; + height: 50px; + font-size: 1em; + background-color: white; + border: none; + color: coral; + border-radius: 5px; + float:right; + cursor: pointer; + +} + +.amount{ + background-color: tomato; + border: 1px solid white; + width: 60%; + margin: 20px auto; + padding: 10px; + text-align: center; + border-radius: 5px; + float: left; + box-shadow: 0px 0px 50px; +} + +span{ + font-size: 1.2em; + position: relative; +} + +#amount::before{ + content: '$'; + position: absolute; + top: 0px; + left: 50px; +} + +#amount { + font-size: 1.5em; +} + +.clearfix{ + clear: both; +} + +.modal{ + position: fixed; + width: 100%; + height: 100%; + top: 50%; + left: 50%; + display: none; + border-radius: 10px; + transform: translate(-50%, -50%); +} + +.trans{ + background-color: rgb(0, 0,0,0.5); + transition: background 500ms ease; +} + +.modal-box{ + background-color: orangered; + width: 60%; + margin: auto; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + border-radius: 10px; + text-align: center; + padding: 10px 10px; + font-size: 1.5em; +} + +.modal button{ + width: 50px; + height: 25px; + font-size: 0.5em; + margin: 10px; + float: none; + margin:10px auto; + font-weight: 700; + cursor: pointer; +} + +@media only screen and (max-width: 500px){ + #app{ + width: 300px; + padding: 10px ; + } + + h1{ + font-size: 2em; + } + + label:first-child::after{ + top: 133px; + left: 20px; + } + .amount{ + margin: 10px auto; + padding: 10px; + } + + .amount h2{ + font-size: 1.05em; + } + + button{ + margin:50px 0 0 0; + width: 100px; + height: 40px; + font-size: 0.9em; + } + + #amount::before{ + left: 20px; + } + + .modal-box{ + width: 80%; + } +} \ No newline at end of file diff --git a/Week3/test/console-test.js b/Week3/Masoud/test/console-test.js similarity index 100% rename from Week3/test/console-test.js rename to Week3/Masoud/test/console-test.js diff --git a/Week3/test/step2-1.test.js b/Week3/Masoud/test/step2-1.test.js similarity index 100% rename from Week3/test/step2-1.test.js rename to Week3/Masoud/test/step2-1.test.js diff --git a/Week3/test/step2-2.test.js b/Week3/Masoud/test/step2-2.test.js similarity index 100% rename from Week3/test/step2-2.test.js rename to Week3/Masoud/test/step2-2.test.js diff --git a/Week3/test/step2-3.test.js b/Week3/Masoud/test/step2-3.test.js similarity index 100% rename from Week3/test/step2-3.test.js rename to Week3/Masoud/test/step2-3.test.js diff --git a/Week3/test/step2-4.test.js b/Week3/Masoud/test/step2-4.test.js similarity index 100% rename from Week3/test/step2-4.test.js rename to Week3/Masoud/test/step2-4.test.js diff --git a/Week3/test/step2-5.test.js b/Week3/Masoud/test/step2-5.test.js similarity index 100% rename from Week3/test/step2-5.test.js rename to Week3/Masoud/test/step2-5.test.js diff --git a/Week3/test/step2-6.test.js b/Week3/Masoud/test/step2-6.test.js similarity index 100% rename from Week3/test/step2-6.test.js rename to Week3/Masoud/test/step2-6.test.js diff --git a/Week3/test/step3-bonus.test.js b/Week3/Masoud/test/step3-bonus.test.js similarity index 100% rename from Week3/test/step3-bonus.test.js rename to Week3/Masoud/test/step3-bonus.test.js diff --git a/Week3/test/step3.test.js b/Week3/Masoud/test/step3.test.js similarity index 100% rename from Week3/test/step3.test.js rename to Week3/Masoud/test/step3.test.js diff --git a/Week3/js-exercises/ex2-RemoveDuplicates.js b/Week3/js-exercises/ex2-RemoveDuplicates.js deleted file mode 100644 index f1eea3b8c..000000000 --- a/Week3/js-exercises/ex2-RemoveDuplicates.js +++ /dev/null @@ -1,35 +0,0 @@ -/** - - ** Exercise 2: The lottery machine ** - Write a function called removeDuplicates. This function accept an array as an argument - does not return anything but removes any duplicate elements from the array. - - The function should remove duplicate elements. So the result should be: - ['a', 'b', 'c', 'd', 'e', 'f'] - - */ - -/** - * Checks your solution against correct solution - * @param {Array} array your solution - * @returns boolean - */ -function checkSolution(array) { - const solution = ['a', 'b', 'c', 'd', 'e', 'f']; - if (array == null) return false; - if (array.length !== solution.length) return false; - - for (let i = 0; i < solution.length; i++) { - if (array[i] !== solution[i]) return false; - } - return true; -} - -// WRITE YOUR FUNCTION HERE - -const letters = ['a', 'b', 'c', 'd', 'a', 'e', 'f', 'c', 'b']; -removeDuplicates(letters); - -if (checkSolution(letters)) { - console.log("Hooray!"); -} \ No newline at end of file diff --git a/Week3/project/index.html b/Week3/project/index.html deleted file mode 100644 index fac819b21..000000000 --- a/Week3/project/index.html +++ /dev/null @@ -1,15 +0,0 @@ - - - - - - - Tip Calculator - - - -
- - - - \ No newline at end of file diff --git a/Week3/project/index.js b/Week3/project/index.js deleted file mode 100644 index e12fb76ed..000000000 --- a/Week3/project/index.js +++ /dev/null @@ -1,3 +0,0 @@ -// Your code goes in here - -document.querySelector("#app").innerText = "Tip Calculator"; \ No newline at end of file