Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Week2-AmirHossein-Conflicts resolved #7

Open
wants to merge 15 commits into
base: master
Choose a base branch
from
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@

** Exercise 1: The odd ones out **

Rewrite the following function using map and filter.
Rewrite the following function using map and filter.
Avoid using for loop or forEach.
The function should still behave the same.

Expand All @@ -18,4 +18,14 @@ function doubleEvenNumbers(numbers) {
}

const myNumbers = [1, 2, 3, 4];
console.log(doubleEvenNumbers(myNumbers)); // Logs "[4, 8]" to the console
// console.log(doubleEvenNumbers(myNumbers)); // Logs "[4, 8]" to the console


//Filter MEthod:
const evenDouble = myNumbers;
.filter(number => (number % 2 === 0))
.map(number => number *2 )


console.log(evenDouble);

Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
/**

** Exercise 2: What 's your Monday worth? **

Write a function that finds out what your hourly rate on a Monday would be
Use the map array function to take out the duration time for each task.
Avoid using for loop or forEach.
Expand All @@ -14,6 +14,12 @@

function dayWorth(tasks, hourlyRate) {
// put your code in here, the function does returns a euro formatted string
const totalTime = tasks
.map(item => item.duration)
.map(item => item / 60)
.map(item => item * hourlyRate)
.reduce((a, b) => a + b, 0);
return `€${totalTime}`;
}

const mondayTasks = [{
Expand All @@ -34,5 +40,5 @@ const mondayTasks = [{
},
];

console.log(dayWorth(mondayTasks, 25))
console.log(dayWorth(mondayTasks, 13.37))
console.log(dayWorth(mondayTasks, 25));
console.log(dayWorth(mondayTasks, 13.37));
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,8 @@

function takeOutLemons(basket) {
// your code goes in here. The output is a string
const allergicFruits = basket.filter(item => item !== "Lemon")
return `My mom bought me a fruit basket, containing ${allergicFruits}!`;
}

const fruitBasket = ['Apple', 'Lemon', 'Grapefruit', 'Lemon', 'Banana', 'Watermelon', 'Lemon'];
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,9 @@

function collectiveAge(people) {
// return the sum of age for all the people
const ages = people.map(item => item.age)
const sumAges = ages.reduce((a,b) => a + b ,0)
return sumAges;
}

const hackYourFutureMembers = [{
Expand Down
13 changes: 13 additions & 0 deletions Week2/AmirHossein/js-exercises/ex5-myFavoriteHobbies.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>


<script src="ex5-myFavoriteHobbies.js"></script>
</body>
</html>
Original file line number Diff line number Diff line change
Expand Up @@ -10,12 +10,26 @@

function createHTMLList(arr) {
// your code goes in here
}

const ulEl = document.createElement('ul');
document.body.appendChild(ulEl);
const listItem = arr.forEach(element => {
const liEl = document.createElement('li');
ulEl.appendChild(liEl);
liEl.innerHTML = element;



});

}
const myHobbies = [
'Meditation',
'Reading',
'Programming',
'Hanging out with friends',
'Going to the gym',
];

];

createHTMLList(myHobbies);
41 changes: 41 additions & 0 deletions Week2/AmirHossein/project/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,41 @@
<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Titillium+Web&display=swap" rel="stylesheet">
<link rel="stylesheet" href="style.css">
<title>Pomodoro Clock</title>
</head>

<body>
<div id="app">
<h1>Pomodoro Clock</h1>
<h2>Session Length</h2>
<div class="time-length">


<i class="arrow-btn fas fa-arrow-up"></i>
<h3 class = start-time>25</h3>
<i class="arrow-btn fas fa-arrow-down"></i>
</div>
<div class="timer-box">
<h2 class="session-text">Session</h2>
<!-- <div class="timer">25:00</div> -->
<div class="timer"><span class="minutes">25</span><span class="dots">:</span><span class="seconds">00</span></div>
</div>
<div class="function-btn">
<i class="fas fa-play"></i>
<i class="fas fa-pause"></i>
<i class="fas fa-stop"></i>
</div>


</div>
<script src="index.js"></script>
<script src="https://kit.fontawesome.com/2ecc8a9549.js" crossorigin="anonymous"></script>
</body>

</html>
117 changes: 117 additions & 0 deletions Week2/AmirHossein/project/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,117 @@
/**
In this week 's project you'll be making a Pomodoro Clock!
A user can specify how many minutes the timer should be set, and with a click on the play button it starts counting down!If the user wants to pause the timer, they can do so by clicking the pause button.

If the timer is running, the user can 't change the session length anymore
Use at least 3 functions
Display minutes and seconds
If the timer finishes the timer should be replaced by the message: Time 's up!
*
*/

const arrowUp = document.querySelector('.fa-arrow-up');
const arrowDown = document.querySelector('.fa-arrow-down');
const startTime = document.querySelector('.start-time');
const timerText = document.querySelector('.timer');
const playBtn = document.querySelector('.fa-play');
const stopBtn = document.querySelector('.fa-stop')
const pauseBtn = document.querySelector('.fa-pause');
let minutesTimer = document.querySelector('.minutes');
let secondsTimer = document.querySelector('.seconds');
const dots = document.querySelector('.dots')


let intialTime = 25;

arrowUp.addEventListener('click', addMinute);
arrowDown.addEventListener('click', minusMinute);
playBtn.addEventListener('click', counterRun);
stopBtn.addEventListener('click', stopTimer)

let counterStart;
function counterRun() {
pauseBtn.addEventListener('click', counterPause);
stopBtn.removeEventListener('click', stopTimer);
playBtn.removeEventListener('click', counterRun)
counterStart = setInterval(timer, 1000);

function counterPause() {
clearInterval(counterStart);
playBtn.addEventListener('click', counterRun);
stopBtn.addEventListener('click', stopTimer)

}

};




function stopTimer(){

minutesTimer.innerHTML = "25";
dots.textContent = ":";
secondsTimer.innerHTML = '00';
startTime.textContent = 25;
intialTime = 25
clearInterval(counterStart);
playBtn.addEventListener('click', counterRun);
arrowUp.addEventListener('click', addMinute);
arrowDown.addEventListener('click', minusMinute);

}


function addMinute() {
intialTime++;
startTime.innerHTML = intialTime;
minutesTimer.innerHTML = intialTime;
if(intialTime == 60) {
intialTime = 0;
};


};

function minusMinute() {
intialTime--;
startTime.innerHTML = intialTime;
minutesTimer.innerHTML = intialTime;
if(intialTime == 0){
intialTime = 60;
};

};

function timer() {
arrowUp.removeEventListener('click', addMinute);
arrowDown.removeEventListener('click', minusMinute);
if (secondsTimer.textContent != 0){
secondsTimer.textContent--;
} else if (minutesTimer.textContent != 0 && secondsTimer.textContent == 0){
secondsTimer.textContent = 59;
minutesTimer.textContent--;

} else {
minutesTimer.textContent = "Time's Up!";
secondsTimer.textContent = "";
dots.textContent = "";


stopBtn.addEventListener('click', stopTimer);
clearInterval(counterStart);


}


}









80 changes: 80 additions & 0 deletions Week2/AmirHossein/project/style.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,80 @@
* {
padding: 0;
margin: 0;
box-sizing: border-box;
font-family: 'Titillium Web', sans-serif;
}

body {
background-color: #1e555c;

}

#app {
display: flex;
flex-direction: column;
text-align: center;
margin-top: 40px;
color: white;
}
h1 {

font-size: 100px;


}
h2 {
font-size: 50px;
margin-bottom: 5px;

}


.time-length {
margin-bottom: 10px;
font-size: 40px;
display: flex;
justify-content: center;
flex-direction: row;
/* margin-left: 700px; */

}
h3 {
margin: 0 10px 0 10px;
}

.arrow-btn {
padding-top: 20px;
}


.timer-box {
width: 30%;
margin: auto;
margin-bottom: 30px;
padding: 1.5rem;

border: 10px solid black;
border-radius: 50px;
}

.session-text {
margin-bottom: 0;
}


.timer {

font-size: 65px;
}

.function-btn {
font-size: 40px;
}

.fa-play {
margin-right: 30px;
}
.fa-pause {
margin-right: 30px;
}
5 changes: 0 additions & 5 deletions Week2/js-exercises/ex5-myFavoriteHobbies.html

This file was deleted.

17 changes: 0 additions & 17 deletions Week2/project/index.html

This file was deleted.

Loading