diff --git a/wk3/ex1/addSix.js b/wk3/ex1/addSix.js new file mode 100644 index 000000000..e1eb2609d --- /dev/null +++ b/wk3/ex1/addSix.js @@ -0,0 +1,18 @@ +"use strict"; + +function createBase(base) { + function add(num) { + return base + num; + } + return add; +} + +const addSix = createBase(6); + +// Put here your function calls... with newNumber + +console.log(addSix(9)); // 15 + +console.log(addSix(18)); //24 + +console.log(addSix(30)); //36 \ No newline at end of file diff --git a/wk3/ex2/TakeOutTheDuplicates.js b/wk3/ex2/TakeOutTheDuplicates.js new file mode 100644 index 000000000..0e63e93ba --- /dev/null +++ b/wk3/ex2/TakeOutTheDuplicates.js @@ -0,0 +1,4 @@ +const letters = ["a", "b", "c", "d", "a", "e", "f", "c", "b"]; + +let newLetters = letters => letters.filter((v, i) => letters.indexOf(v) === i); +console.log(newLetters(letters)); \ No newline at end of file diff --git a/wk3/ex3/GuessTheOutput.js b/wk3/ex3/GuessTheOutput.js new file mode 100644 index 000000000..92a7589c4 --- /dev/null +++ b/wk3/ex3/GuessTheOutput.js @@ -0,0 +1,17 @@ +// Snippet + +let a = 10; +// the verbal a take 10 as value + +const x = (function() { + // here we give new value to the same variable that variable. + a = 12; + // then the value of variable x will be 12 + + return function() { + alert(a); + }; +})(); + +// the output for function x it will be 12 +x(); \ No newline at end of file diff --git a/wk3/ex4/GuessMore.js b/wk3/ex4/GuessMore.js new file mode 100644 index 000000000..88ddc75ba --- /dev/null +++ b/wk3/ex4/GuessMore.js @@ -0,0 +1,27 @@ +// Snippet +const x = 9; + +function f1(val) { + val = val + 1; + return val; +} +// when the functions f() fired it will increase verbal x +// so the output the value will be 10 +f1(x); + +// the function will not change the variable x value it will be still the sam so the output is 9 +console.log(x); + +const y = { x: 9 }; + +function f2(val) { + val.x = val.x + 1; + return val; +} + +// when the functions f2() fired it will increase the object y +// so the output the value will be 10 +f2(y); + +// the function here will change the the value of the object the output is 10 +console.log(y); \ No newline at end of file diff --git a/wk3/ex5/lotteryMachine.js b/wk3/ex5/lotteryMachine.js new file mode 100644 index 000000000..a2b9dc7be --- /dev/null +++ b/wk3/ex5/lotteryMachine.js @@ -0,0 +1,21 @@ +// +function threeFive(startIndex, stopIndex, threeCallback = 3, fiveCallback = 5) { + const numbers = []; + const sayWhat = []; + + for (let i = startIndex; i <= stopIndex; i++) { + numbers.push(i); + } + + for (let i = 0; i < numbers.length; i++) { + if (i % threeCallback === 0) { + sayWhat.push("Three"); + } else if (i % fiveCallback === 0) { + sayWhat.push("Five"); + } + } + + return numbers + "\n" + sayWhat; +} + +console.log(threeFive(10, 15, 3, 5)); \ No newline at end of file diff --git a/wk3/project/TipCalculator.html b/wk3/project/TipCalculator.html new file mode 100644 index 000000000..772ee7141 --- /dev/null +++ b/wk3/project/TipCalculator.html @@ -0,0 +1,49 @@ + + + + + + + + The Tip Calculator + + + + +
+ +
+

Tip Calculator

+
+ +
+

How Much Was Your Bill?

+ $ +

How Was Your Service?

+ +

How Many People Sharing the Table

+ People +
+ + + +
+

TIP AMOUNT

+

$

+

EACH

+
+ +
+ + + + + \ No newline at end of file diff --git a/wk3/project/tipCavulator.css b/wk3/project/tipCavulator.css new file mode 100644 index 000000000..8f35146ec --- /dev/null +++ b/wk3/project/tipCavulator.css @@ -0,0 +1,82 @@ +* { + box-sizing: border-box; +} + + +/* gluble class */ + +.fontSize { + text-align: center; + font-weight: bold; + font-size: large; +} + +body { + width: 100%; + height: 100vh; + margin: 0; + padding: 0; + background-color: rgb(83, 29, 19); +} + +.contenar { + background-color: white; + width: 40%; + /* height: 90%; */ + margin: 30px auto; + border-radius: 15px; + padding: 0; +} + +.showScreen { + padding: 20px; +} + +.top { + background-color: black; + border-radius: 15px 15px 0px 0px; + text-align: center; + color: white; + width: 100%; + margin: 0 0 5px 0; + height: 20%; + display: flex; + align-items: center; + justify-content: center; +} + +input { + width: 50%; + height: 40px; + font-weight: bold; + font-size: large; + padding: 15px; +} + +select { + width: 50%; + height: 40px; + padding: 10px; +} + +#calc { + background-color: rgb(159, 39, 61); + border: none; + border-radius: 10px; + width: 70%; + height: 40px; + margin: 20px 50px; + outline: none; + box-shadow: 0px 5px 10px rgb(51, 50, 50); +} + +#calc:hover { + cursor: pointer; + color: rgb(159, 39, 61); + background-color: black; +} + +#result, +#each { + display: none; +} \ No newline at end of file diff --git a/wk3/project/tipCavulator.js b/wk3/project/tipCavulator.js new file mode 100644 index 000000000..84a4d2f8a --- /dev/null +++ b/wk3/project/tipCavulator.js @@ -0,0 +1,26 @@ +const opt = document.querySelectorAll("option").values; +const person = document.querySelector("#person"); +const btn = document.querySelector("#calc"); +const service = document.getElementById("service"); +const result = document.querySelector("#result"); +const each = document.querySelector("#each"); + +function calculte() { + const billContentS = document.getElementById("bill").value; + let bill = parseInt(billContentS); + const serv = parseInt(service.value); + const eachPerson = parseInt(person.value); + + let percentage = (bill * serv) / 100; + + let dividedOnpeople = Math.floor(percentage / eachPerson); + + result.innerText = "$ " + dividedOnpeople; + result.style.display = "block"; + + if (eachPerson > 1) { + each.style.display = "block"; + } +} + +btn.addEventListener("click", calculte); \ No newline at end of file