Full Stack Morning

Full Stack Morning

  1. Given 3 variables, money = 57 (us dollars), distance = 122 (miles) and fuel = 20 (gallons). You need to console log three lines. Create three new variables, name them anything you want. The first variable should be the money, but the value should be in rupees, the second one the distance should be in kilometers and the third new variable’s value should be in liters. Use the original variable values to do the conversion. In the end, write three console logs which shows the original and the new converted values.
  2. Make a variable named choice that will have a random number value between 1 – 10. Use the Math.random() method to do this. Then, write a simple conditional to check if choice is 7. If choice is 7 console log ‘LUCKY’, otherwise console log ‘UNLUCKY’.
  3. Create a variable called num and give it a random number value. Then write a conditional to check if the number is odd. If num is odd, console log ‘ODD’, otherwise console log ‘EVEN’.
  4. Create a variable named food. Create another variable named randomNum which should be a random number between 1 – 6.  Then write a switch statement which sets each number case to a particular food. Case 1 should make food equal to ‘Apple’, case 2 should make food equal to grape and so on. Here is the list, (apple, grape, cabage, carrot, biryani, pulav).
    Next, write normal if, else if, else statements to do the following:
    1. If food is set to either ‘apple’ or ‘grape’, your code should console log ‘fruit’.
    2. If food is set to either ‘cabbage’ or ‘carrot’, your code should console log ‘vegetable’
    3. If food is set to either ‘biryani’ or ‘pulav’ your code should console log ‘rice’
  5. Create a variable named message and make it equal to 2-3 lines of lorem ipsum. Demonstrate all the string methods on this variable.
// // let message = `Hello World and
// // once again hello world`

// // console.log(message)

// // message = 'Aloha World and \nonce again hello world'

// // console.log(message)

// let name = 'John Doe'
// let city = 'Delhi'
// // message = `Aloha ${name + ' from ' + city}, and hello to you.`
// message = `Aloha ${name} from ${city}, and hello to you.`

// console.log(message)

// let age = 65

// if (age >= 18) {
//   console.log('You are allowed to come in, but you cannot drink.')
// } else if (age >= 21) {
//   console.log('You can come and you can drink as well.')
// } else if (age >= 65) {
//   console.log('You can come in, and drinks are free.')
// }

// let john = 'delhite'

// if (john === 'admin') {
//   console.log('You are allowed to access this page')
// } else if (john === 'moderator') {
//   console.log('You are allowed to see some other content')
// } else if (john === 'subscriber') {
//   console.log('You are allowed to pay me some money')
// } else {
//   console.log("You aren't welcome here!")
// }

// if (age >= 21) {
//   console.log('You can come and you can drink as well.')
// }

// if (age < 18) {
//   console.log('Buzz off')
// }

// let password = 'hell'

// if (password.length >= 6) {
//   // inner conditional
//   if (password.indexOf(' ') !== -1) {
//     console.log('Password is not valid')
//   } else {
//     console.log('Password is valid')
//   }
// } else {
//   console.log('Password is too short')
// }

// let loggedInUser = 'john'

// // form -loggedin -> username

// if (loggedInUser) {
//   console.log(`Welcome ${loggedInUser}`)
// } else {
//   console.log('SHOW CONTENT')
// }

// let age = 20
// // let city = 'delhi'

// if (age >= 18 && age < 21) {
//   console.log('You are allowed to enter, but you cannot drink.')
// } else if (age >= 21 && age <= 65) {
//   console.log('You are allowed to enter, and drink.')
// } else if (age > 65) {
//   console.log('Drinks are free')
// } else {
//   console.log('Buzz off')
// }

// // let loggedInUser = 'john'
// let loggedIn = null

// if (!loggedIn) {
//   console.log('PLEASE LOG IN')
// } else {
//   console.log(`Welcome ${loggedInUser}`)
// }

// let day = 40

// switch (day) {
//   case 1:
//     console.log('MONDAY')
//     break
//     case 2:
//       console.log('TUESDAY')
//       break
//       case 3:
//         console.log('WED')
//         break
//         case 4:
//           console.log('THU')
//           break
//           case 5:
//             console.log('FRI')
//     break
//     case 6:
//       console.log('SAT')
//       break
//       case 7:
//     console.log('SUN')
//     break
//     default:
//     console.log('INVALID DAY')
//   }

// let password = '2134'

// switch (password) {
//   case '1234':
//     console.log('TOO SIMPLE PASSWORD')
//     break
//   case 'password':
//     console.log('TOO COMMON')
//     break
//   default:
//     console.log('This is OK')
// }

// let num = 19

// num === 2 ? console.log('LUCKY') : console.log('UNLUCKY')

// let status = 'offline'

// let color = status === 'online' ? 'green' : 'red'

// console.log(color)

// let food
// let randomNum = Math.floor(Math.random() * 6) + 1

// console.log(food)

// switch (randomNum) {
//   case 1:
//     food = 'Apple'
//     break
//   case 2:
//     food = 'Grapes'
//     break
//   case 3:
//     food = 'Cabbage'
//     break
//   case 4:
//     food = 'Carrot'
//     break
//   case 5:
//     food = 'Biryani'
//     break
//   case 6:
//     food = 'Pulav'
//     break
//   default:
//     console.log('Incorrect food number')
// }

// console.log(food)

// let message = 'Some value'
// console.log(message.toUpperCase())

// // console.log(upperMessage)

// Arrays

// let names = ['rakesh', 'hafiza', 'akshay', 'aditya']

// if (names.length === 4) {
//   console.log('This is a good array')
// } else if (names.length < 4 || names.length > 4) {
//   console.log('Bad array')
// }

// HW
// let message = 'This is a crap message'

// console.log(`Original Message: ${message}`)

// if (message.split(' ').indexOf('crap') !== -1) {
//   let censoredIdx = message.split(' ').indexOf('crap')
//   let censoredMsg = message.split(' ').pop(censoredIdx)
//   console.log(`Censored Message: ${censoredMsg}`)
// }

// Objects

// const userDetails = ['John', 'Doe', 25, 'john.doe@gmail.com']

// const user = {
//   email: 'john.doe@gmail.com',
//   lastName: 'Doe',
//   age: 25,
//   firstName: 'John',
//   80: "User's age"
// }

// console.log(user.email)
// console.log(user.age)
// console.log(user['80'])
// console.log(user['firstName'])
// console.log(user.middleName)

// const pallette = {
//   red: '#eb4d4b',
//   yellow: '#f9ca24',
//   blue: '#30336b'
// }

// let userSelection = 'yellow'

// console.log(pallette[userSelection])

// console.log(pallette['yellow'])

// console.log(`The color selected is ${pallette['userSelection']}`)

// const user = {
//   email: 'john.doe@gmail.com',
//   lastName: 'Doe',
//   age: 25,
//   firstName: 'John'
// }

// const products = [
//   {
//     name: 'Samsung Galaxy 20',
//     skew: '21821sjh2187',
//     details: 'This does so and so......',
//     price: 90000,
//     images: [
//       'https://rstforum.net/image/1',
//       'https://rstforum.net/image/2',
//       'https://rstforum.net/image/3'
//     ],
//     brand: 'Samsung'
//   },
//   {
//     name: 'Apple iPhone',
//     skew: '2134324324',
//     details: 'This does so and so......',
//     price: 120000,
//     images: [
//       'https://rstforum.net/image/apple/1',
//       'https://rstforum.net/image/apple/2',
//       'https://rstforum.net/image/apple/3'
//     ],
//     brand: 'Apple'
//   }
// ]

// // console.log(products[1].details)
// console.log(products[1]['details'])

// const myPlaylist = {
//   song1: {
//     name: 'Song1',
//     duration: '3:09',
//     price: 1000000 // 100,00,00
//   },
//   song2: {
//     name: 'Song1',
//     duration: '3:09'
//   },
//   song3: {
//     name: 'Song1',
//     duration: '3:09'
//   }
// }

// console.log(myPlaylist.song1.name)

// Object literal
const fitnessData = {
  totalSteps: 400000,
  totalKms: 253.32,
  avgCalorieBurn: 2300,
  workoutsThisWeek: '5 of 7',
  avgSleep: '5:45',
  80: 'Work week',
  'Full Name': 'John Doe'
}

// console.log(fitnessData.avgSleep)
// console.log(fitnessData['totalKms'])
// console.log(fitnessData['80'])

// console.log(fitnessData['Full Name'])

// console.log(fitnessData)
// fitnessData.BPM = 98
// console.log(fitnessData)
// fitnessData.BPM++
// fitnessData.totalKms -= 100
// console.log(fitnessData)

const products = [
  {
    name: 'iPhone 12',
    price: 80000,
    brand: 'Apple'
  },
  {
    name: 'Galaxy 20',
    price: 100000,
    brand: 'Samsung'
  },
  {
    name: 'MI 11',
    price: 40000,
    brand: 'Xiaomi'
  }
]

// products[0].price = 100000
// console.log(products[0].price)

// const nums = [21, 21, 23, 452, 5, 2, 2121, 212, 2]

// for (let i = 1; i <= 100; i++) {
//   // console.log(i ** 2)
//   // console.log('The value of i is ' + i)
//   // console.log(`The value of i is ${i}`)
//   console.log('HELLO WORLD!')
// }

// for (let i = 50; i > 0; i /= 5) {
//   console.log(i)
// }

// let times = 10

// for (let i = 0; i < times; i++) {
//   console.log(i)
// }

// for (let num = 1; num <= 10; num++) {
//   console.log(`${num}*${num}=${num * num}`)
// }

// const nums = [12, 34, 56, 34, 78, 54, 23, 12]

// for (let count = 0; count <= nums.length; count++) {
//   console.log(nums[count])
// }

// const movies = [
//   { movieName: 'Inception', rating: 3.8 },
//   { movieName: 'Avengers', rating: 3.4 },
//   { movieName: 'Iron Man', rating: 2.9 }
// ]

// for (let i = 0; i < movies.length; i++) {
//   let movie = movies[i]
//   console.log(`${movie['movieName']} has a rating of ${movie.rating}`)
// }

// for (let char = 0; char < word.length; char++) {
//   console.log(word[char].toUpperCase())
// }

// const word = 'Hello World'

// let reversedWord = ''

// for (let char = word.length - 1; char >= 0; char--) {
//   // console.log(word[char])
//   reversedWord = reversedWord + word[char]
// }

// console.log(reversedWord)

// for (let i = 1; i <= 10; i++) {
//   for (let j = 0; j < 5; j++) {
//     for (let k = 0; k < 3; k++) {
//       console.log(i, j, k)
//     }
//   }
// }

// const arr = [
//   [4, 64],
//   [128, 32, 4, 16],
//   [16, 4, 4, 32],
//   [2, 16, 16, 2]
// ]

// // for (let i = 0; i < gameBoard.length; i++) {
// //   for (let j = 0; j < gameBoard[i].length; j++) {
// //     console.log(gameBoard[i][j])
// //   }
// // }

// const arr = [
//   ['A', 'B', 'C', 'D'],
//   ['E', 'F', 'G'],
//   ['hello', 'world', 'cool'],
//   [23, 45, 64, 212, 34, 565, 32]
// ]

// for (let i = 0; i < arr.length; i++) {
//   for (let j = 0; j < arr[i].length; j++) {
//     console.log(arr[i][j])
//   }
// }

// // const wordsArr = // split words
// const selectedWordsA = []

// const allSelectedWords = [
//   ['amet', 'accusamus'],
//   ['lorem', '']
// ]

// let words =
//   'Lorem ipsum dolor sit amet consectetur adipisicing elit. Accusamus illum ipsam minus rem tempora aliquam reprehenderit ea adipisci nisi quisquam.'

// const wordsArr = words.toLowerCase().split(' ')
// const selectedWordsA = []
// const selectedWordsL = []

// console.log(wordsArr)

// for (let i = 0; i < wordsArr.length; i++) {
//   if (wordsArr[i][0] === 'a') {
//     selectedWordsA.push(wordsArr[i])
//   } else if (wordsArr[i][0] === 'l') {
//     selectedWordsL.push(wordsArr[i])
//   }
// }

// console.log(selectedWordsA)
// console.log(selectedWordsL)

// // For loop
// for (let i = 0; i < 100; i++) {
//   console.log(`${i}: Hello World`)
// }

// for (let num = 0; num <= 20; num++) {
//   console.log(num)
// }

// let str = 'b' + 'a' + +'a' + 'a'
// console.log(str)

// let i = 0

// while (i <= 20) {
//   console.log(i)
//   i++
// }

// const target = Math.floor(Math.random() * 9999) + 1
// // // console.log(target)
// let guess = Math.floor(Math.random() * 9999) + 1
// // // console.log(guess)

// while (guess !== target) {
//   console.log(`Target: ${target} | Guess: ${guess}`)
//   guess = Math.floor(Math.random() * 9999) + 1
// }

// // console.log(`The final result: Target: ${target} | Guess: ${guess}`)

// const target = Math.floor(Math.random() * 100) + 1
// let guess = Math.floor(Math.random() * 100) + 1

// while (guess !== target) {
//   if (guess === 13) {
//     console.log('13 is an unlucky number.\nBreaking out of this loop.')
//     break
//   }

//   console.log(`Target: ${target} | Guess: ${guess}`)
//   guess = Math.floor(Math.random() * 100) + 1
// }

// console.log(`The final result: Target: ${target} | Guess: ${guess}`)

// const target = Math.floor(Math.random() * 100) + 1
// let guess = Math.floor(Math.random() * 100) + 1

// // true -> loop forever
// while (true) {
//   console.log(`Target: ${target} | Guess: ${guess}`)

//   if (target === guess) {
//     break // break out of the loop when condition is true
//   }

//   guess = Math.floor(Math.random() * 100) + 1
// }

// console.log(`\nGame over!\nTarget: ${target} | Guess: ${guess}.`)

const names = ['John', 'Jack', 'Jim', 'Jane', 'James', 'Janardhan']
// // for loop
// for (let i = 0; i < names.length; i++) {
//   console.log(names[i])
// }

// for...of loop
// for (let name of names) {
//   console.log(`Hello ${name}!`)
//   console.log(name)
// }

// console.log(name)

// let name = 'John Doe'
// let reversedName = []

// for (let char of name) {
//   // console.log(char.toUpperCase( ))
//   reversedName.unshift(char)
// }

// console.log(reversedName.join(''))

// const matrix = [
//   [1, 4, 7],
//   [9, 7, 2],
//   [9, 4, 16]
// ]

// let total = 0

// for (let row of matrix) {
//   for (let num of row) {
//     total += num
//   }
// }

// console.log(total)

// const cats = ['fashion', 'mobiles', 'books']
// const prods = ['tshirt', 'samsung', '1984', 'bro']

// for (let i = 0; i < prods.length; i++) {
//   console.log(cats[i], prods[i])
// }

// const productPrices = {
//   apple: 80000,
//   onePlus: 50000,
//   samsung: 90000
// }

// for (let brand of Object.keys(productPrices)) {
//   console.log(`${brand} is going to cost you ${productPrices[brand]}`)
// }

// for (let price of Object.values(productPrices)) {
//   console.log(price)
// }

// const movieRating = {
//   pursuitOfHappiness: 4.8,
//   satya: 4.8,
//   gangsOfWasepur: 4,
//   robot: -3
// }

// for (let movie in movieRating) {
//   // console.log(movie)
//   console.log(`${movie} has a rating of ${movieRating[movie]}`)
// }

const data = [
  {
    id: 1,
    first_name: 'Mozelle',
    last_name: 'Beesley',
    email: 'mbeesley0@ebay.co.uk',
    gender: 'Female',
    ip_address: '204.93.93.196',
    bank_balance: '$641.25'
  },
  {
    id: 2,
    first_name: 'Marjie',
    last_name: 'Kinge',
    email: 'mkinge1@wsj.com',
    gender: 'Female',
    ip_address: '19.175.126.65',
    bank_balance: '$937.11'
  },
  {
    id: 3,
    first_name: 'Gage',
    last_name: 'Renish',
    email: 'grenish2@hatena.ne.jp',
    gender: 'Male',
    ip_address: '219.51.80.158',
    bank_balance: '$819.20'
  },
  {
    id: 4,
    first_name: 'Alika',
    last_name: 'Skeffington',
    email: 'askeffington3@senate.gov',
    gender: 'Female',
    ip_address: '158.35.238.167',
    bank_balance: '$172.63'
  },
  {
    id: 5,
    first_name: 'Noel',
    last_name: 'Crudginton',
    email: 'ncrudginton4@elegantthemes.com',
    gender: 'Male',
    ip_address: '250.158.31.16',
    bank_balance: '$565.80'
  },
]

const upperClass = [] // >800
const middleClass = [] // 500 || 800
const lowerClass = [] // <500

for (let customer of data) {
  let balance = +customer.bank_balance.split('$')[1]

  if (balance >= 800) {
    upperClass.push(customer)
  } else if (balance > 400 && balance < 800) {
    middleClass.push(customer)
  } else {
    lowerClass.push(customer)
  }
}

console.log(upperClass)

// if price is less than 5000 -> push it to CHEAP array
// if price is between than 5000 and 12000 -> push it to AFFORDABLE array
// if price is over 12000 -> push it to EXPENSIVE array
// Create 4 arrays -> SUZUKI, TESLA, FORD, TOYOTA, OTHER
// function validatePassword(password, username) {
//   //   if (
//   //     password.indexOf(' ') === -1 &&
//   //     password.indexOf(username) === -1 &&
//   //     password.length > 6
//   //   ) {
//   //     return true
//   //   } else {
//   //     return false
//   //   }

//   return (
//     password.indexOf(' ') === -1 &&
//     password.indexOf(username) === -1 &&
//     password.length > 6
//   )
// }

// // console.log(validatePassword('jdoe2021', 'doe.20'))

// let rstUser = 'johndoe9883292'
// let rstPassword = 'johndoe'

// if (validatePassword(rstPassword, rstUser)) {
//   console.log('Welcome to RST Forum')
// } else {
//   console.log('Please check your username or password')
// }

// function isValidPassword(password, username) {
//   const tooShort = password.length < 8
//   const hasSpace = password.indexOf(' ') !== -1
//   const tooSimilar = password.indexOf(username) !== -1

//   return tooShort || hasSpace || tooSimilar
// }

// function isPangram(sentence) {
//   sentence = sentence.toLowerCase()

//   for (let char of 'abcdefghifklmnopqrstuvwxyz') {
//     if (sentence.indexOf(char) === -1) {
//       return false
//     }
//   }

//   return true
// }

// console.log(isPangram('Two driven'))

let msg = 'Hello Mars'

function greet() {
  var msg = 'Hello World'
  return msg + '!'
}

function great() {
  var msg = 'Hello World!!!!!!!!!!!!!!!'
  return msg + '!'
}

console.log(msg)
console.log(greet())
// // Function validator (approach 1)
// function isValidPassword(password, username) {
//   if (
//     password.length < 8 ||
//     password.indexOf(' ') !== -1 ||
//     password.indexOf(username) !== -1
//   ) {
//     return false
//   } else {
//     return true
//   }
// }

// // Function validator (approach 2)
// function isValidPassword(password, username) {
//   const tooShort = password.length < 8
//   const hasSpace = password.indexOf(' ') !== -1
//   const tooSimilar = password.indexOf(username) !== -1

//   if (tooShort || hasSpace || tooSimilar) return false
//   return true
// }

// // Function validator (approach 3)
// function isValidPassword(password, username) {
//   const tooShort = password.length < 8
//   const hasSpace = password.indexOf(' ') !== -1
//   const tooSimilar = password.indexOf(username) !== -1

//   return tooShort || hasSpace || tooSimilar
// }

// // console.log(isValidPassword('helloworld', 'hello'))
// // console.log(isValidPassword('kasmd21sdda89', 'hello'))
// // console.log(isValidPassword('asd as', 'johndoe'))

// // Function Average
// function avg(arr) {
//   let total = 0
//   for (let num of arr) {
//     total += num
//   }
//   return total / arr.length
// }

// // console.log(avg([12, 34, 5, 2, 13, 45]))

// // Function Pangram (a sentence that contains every letter of the alphabet)
// function isPangram(sentence) {
//   sentence = sentence.toLowerCase()
//   for (let char of 'abcdefghifklmnopqrstuvwxyz') {
//     if (sentence.indexOf(char) === -1) {
//       return false
//     }
//   }
//   return true
// }

// // console.log(isPangram('The quick brown fox jumps over the lazy dog.'))
// // console.log(isPangram('Kay re tichaya'))


// Exercises
// 1. Write a simple function which accepts an array returns a new arr
// where all the values are doubled.

// 2. Write a simple function called coinFlip and when called should
// either return HEADS or TAILS

// 3. Write a function called generateEvens which should take an argument
// of the number upto which it wants even numbers. So if I pass 100 to the
// function, I want to get back an array with even numbers starting from 0
// all the way to 100, i.e. [2,4,6,8,10,12,...,100]

// 4. Write a function called returnDay which should accept a number between
// 1 and 7 and return the corresponding day (monday, tuesday, wednesday... etc)

// 5. Write a function called capitalized which should accept a string and
// return the same string with it's first letter capitalized.
// ex. capitalized("john") // "John"

// 6. Write a function isPalindrome which accepts a string and checks if the
// string is a palindrome, if it is, then it should return true or else false.
// A palindrome is a word or sentence which reads the same backward or forward.
// isPalindrome("racecar") // true
// radar, level, rotor, kayak, madam, refer, mom, wow,
function isPalindrome(word) {
  return word === word.split('').reverse().join('')
}

// function capitalize(words) {
//   let wordArr = words.split(' ')
//   let capitalArr = []
//   for (word of wordArr) {
//     capitalArr.push(word[0].toUpperCase() + word.substring(1))
//   }
//   return capitalArr.join(' ')
// }

// console.log(capitalize('hello world hello universe'))

// let name = 'Jack'

// var first_name = 'Jack'
// console.log(first_name)

// if (true) {
//   var first_name = 'John'
//   var last_name = 'Doe'
//   console.log(first_name + ' ' + last_name)
// }

// console.log(first_name, last_name)

// for (var i = 0; i < 10; i++) {
//   console.log(i)
// }

// console.log(i)

// // console.log(first_name, last_name) // ERROR

// function outer() {
//   let movie = 'Avengers'

//   function inner() {
//     let otherMovie = 'John Wick'
//     let ratings = `${movie} has a rating of 4.2`
//     console.log(ratings)
//   }
//   inner()
// }

// // outer()

// function square(num) {
//   return num * num
// }

// const square = function (num) {
//   return num * num
// }

// // Named function
// function add(x, y) {
//   return x + y
// }

// // Function expression
// const sum = function (x, y) {
//   return x + y
// }

// // Function expressions also point to named functions
// const product = function multiply(x, y) {
//   return x * y
// }

// console.log(sum(10, 50))
// console.log(product(10, 4))
// console.log(multiply(10, 10)) // ERROR!

// function add(x, y) {
//   return x + y
// }

// const sub = function (x, y) {
//   return x - y
// }

// const mul = function (x, y) {
//   return x * y
// }

// function div(x, y) {
//   return x / y
// }

// const operations = [add, sub, mul, div]

// for (let op of operations) {
//   let result = op(10, 2)
//   console.log(result)
// }

// console.log(operations[1](10, 30))

// const customMath = {
//   sub: function (x, y) {
//     return x - y
//   },
//   div: div
// }

// console.log(customMath.sub(10, 5))

// Higher Order Functions (HOF)
// function multipleGreets(f) {
//   f()
//   f()
//   f()
// }

// function sayHello() {
//   console.log('Hello World')
// }
// function printNums() {
//   for (let i = 0; i < 10; i++) {
//     console.log(i)
//   }
// }

// multipleGreets(sayHello)
// multipleGreets(printNums)

// multipleGreets(function () {
//   console.log("I'm a FUNCTION!!!!")
// })

// // multipleGreets('Hello Bro')

// function sayHello() {
//   console.log('Hello World')
// }
// function sayGoodbye() {
//   console.log('Goodbye World')
// }

// function repeat(func, num) {
//   for (let i = 0; i < num; i++) {
//     func()
//   }
// }

// // repeat(sayHello, 10)
// repeat(sayGoodbye, 2)

// // HOF
// function randomPick(f1, f2) {
//   let randNum = Math.random()
//   if (randNum < 0.5) {
//     f1()
//   } else {
//     f2()
//   }
// }

// randomPick(
//   function () {
//     console.log('Hello World!')
//   },
//   function () {
//     console.log('Goodbye World!')
//   }
// )

// const square = function (x) {
//   return x ** 2
// }

// console.log(square(10))

function raiseBy(num) {
  return function (x) {
    return x ** num
  }
}

let square = raiseBy(2)
let cube = raiseBy(3)

console.log(square(20))
console.log(cube(20))
  1. Write a function named sqArr that accepts an array. The function return an array with all the numbers in the argument array squared. Use a function expression instead of a regular function.
    Ex. sqArr([2,5,6,4]) -> [4,25,36,16]
  2. Create a HOF factory function named multiplyBy that accepts a number and return a new function. Very similar to the raise
    Ex. const fiveTimes = multiplyBy(5)
    fiveTimes(10) -> 50
  3. Write a function named maths, which accepts three arguments. The first two will be two numbers and the third argument will be a function. This will will use the two arguments and do whatever arithmetic operations on them.
    Ex. maths(5, 5, add) -> 10
    maths(10, 3, sub) -> 7
    Make four maths function calls. Pass function references in the first two and the next two pass anonymous functions.
// function raiseBy(num) {
//   return function (x) {
//     return x ** num
//   }
// }

// const square = raiseBy(2)
// const cube = raiseBy(3)

// // console.log(square(10))

// const myMaths = {
//   add: function (x, y) {
//     return x + y
//   },
//   sub: function (x, y) {
//     return x - y
//   },
//   mul: function (x, y) {
//     return x * y
//   }
// }

// console.log(myMaths.add(10, 40))

// function isBetween(x, y) {
//   return function (num) {
//     return num >= x && num <= y
//   }
// }

// const isChild = isBetween(0, 15)
// const isTeen = isBetween(16, 18)
// const isAdult = isBetween(18, 65)
// const isSenior = isBetween(65, 100)

// let userAge = 99

// if (isChild(userAge)) {
//   console.log('You are not welcome here')
// } else if (isTeen(userAge)) {
//   console.log('You are welcome but you cannot drink')
// } else if (isAdult(userAge)) {
//   console.log('You are welcome')
// } else if (isSenior(userAge)) {
//   console.log('Drinks are free')
// } else {
//   console.log("I don't believe it")
// }

// maths

// function maths(x, y, fn) {
//   return fn(x, y)
// }

// function add(x, y) {
//   return x + y
// }

// let result = maths(10, 10, function (x, y) {
//   return x - y
// })

// let addResult = maths(10, 10, add)

// console.log(result)
// console.log(addResult)

// setTimeout(function () {
//   console.log('Hello World')
// }, 1000)

// var name
// var last_name

// console.log(name)
// name = 'john doe'

// console.log(person)
// let person = 'John Doe'

// const nums = [9, 2, 4, 6, 2, 3, 7, 6]

// // nums.forEach(function (x) {
// //   console.log(x)
// // })

// nums.forEach(function (x) {
//   if (x % 2 === 1) {
//     console.log(x)
//   }
// })

// // console.log(nums)

// const movies = [
//   {
//     title: 'Avengers',
//     rating: 4.1
//   },
//   {
//     title: 'Dr. Strange',
//     rating: 3.9
//   },
//   {
//     title: 'Tenet',
//     rating: 4.3
//   },
//   {
//     title: 'Joker',
//     rating: 4.7
//   }
// ]

// movies.forEach(function (item) {
//   console.log(item['title'].toUpperCase())
// })

// movies.forEach(function (movie, i) {
//   console.log(i + 1, movie.title.toUpperCase())
// })

// let nums = [1, 2, 3, 4, 5, 6]

// // const newNums = []

// nums.forEach(function (num, idx) {
//   console.log(`${idx + 1}: ${num * 10}`)
// })

// const names = ['john', 'jack', 'jane', 'james']

// // let capitalNames = names.map(function (name) {
// //   return name.toUpperCase()
// // })

// console.log(
//   names.map(function (name) {
//     return name.toUpperCase()
//   })
// )

// console.log(capitalNames)

const nums = [2, 3, 4, 7, 6, 8, 13, 10, 19, 12, 14, 22, 21, 16]

// const doubles = nums.map(function (num) {
//   return num * 2 // we have to return a value
// })
// console.log(doubles)

const numDetails = nums.map(function (num) {
  return {
    number: num,
    isEven: num % 2 === 0
  }
})

console.log(numDetails)
// function doubleArr(arr) {
//   return arr.map(function (item) {
//     return item * 2
//   })
// }

// console.log(doubleArr([1, 2, 3, 4]))

// // HOF
// function maths(num1, num2, func) {
//   return func(num1, num2)
// }

// function divide(a, b) {
//   return a / b
// }

// console.log(
//   maths(10, 10, function (a, b) {
//     return a + b
//   })
// )

// console.log(maths(10, 10, divide))

// // Function Expression
// const square = function (x) {
//   return x * x
// }

// // Arrow functions
// const cube = x => {
//   return x * x * x
// }

// const add = (x, y) => {
//   return x + y
// }

// const randomNum = () => {
//   return Math.random()
// }

// const square = (x) => {
//   return x * x
// }

// // Implicit return
// const square2 = x => (
//   x * x
// )

// const square3 = x => x * x

// console.log(square(20))
// console.log(cube(20))
// console.log(add(20, 10))
// console.log(randomNum())

// console.log(square2(100))

// function maths(num1, num2, fn) {
//   return fn(num1, num2)
// }

// const maths = (num1, num2, fn) => (
//   fn(num1, num2)
// )

// HOF
// const maths = (num1, num2, fn) => fn(num1, num2)

// console.log(maths(10, 50, (x, y) => x / y))

// const nums = [1, 2, 3, 4, 5, 6]

// nums.map(num => num * 2)

// let movies = ['The Terminator', 'The Avengers', 'Jurassic Park', 'Titanic']

// // console.log(
// //   movies.find(movie => {
// //     return movie.includes('The')
// //   })
// // )

// console.log(movies.find(movie => movie.indexOf('tan') !== -1))

// const books = [
//   {
//     title: 'The Shining',
//     author: 'Stephen King',
//     rating: 4.1
//   },
//   {
//     title: 'Sacred Games',
//     author: 'Vikram Chandra',
//     rating: 4.5
//   },
//   {
//     title: '1984',
//     author: 'George Orwell',
//     rating: 4.9
//   },
//   {
//     title: 'The Alchemist',
//     author: 'Paulo Coelho',
//     rating: 3.5
//   },
//   {
//     title: 'The Great Gatsby',
//     author: 'F. Scott Fitzgerald',
//     rating: 3.8
//   }
// ]

// books.sort((a, b) => a.rating - b.rating)

// console.log(books)

// console.log(books.find(book => book.rating > 4))

// const nums = [9, 8, 3, 4, 6, 12, 17, 23, 0]

// console.log(nums.filter(num => num % 2 === 0))
// console.log(nums.filter(n => n > 10))

// console.log(books.filter(book => book.rating > 4))

// const names = ['jack', 'james', 'john', 'jane', 'josh', 'brad']

// console.log(names.every(name => name[0] === 'j'))
// console.log(names.some(name => name[0] === 'b'))

// console.log(names.every(name => name.length >= 4))

// console.log(names.every(name => name[name.length - 1] !== 'n'))

// const prices = [500.4, 211, 23, 5, 4, 22.2, -23.2, 9233]

// // const result = [211,  23, 500.4, 5, 4, 22.2, -23.2, 9233]

// // prices.sort((n1, n2) => n1 - n2)
// prices.sort((n1, n2) => n2 - n1)

// console.log(prices)

let nums = [21, 221, 2000000, 1, 34, 123, 4342, 56, 4]

const maxVal = nums.reduce((max, currentVal) => {
  if (currentVal > max) {
    return currentVal
  }
  return max
}, 40000)

console.log(maxVal) // 2000000

// const nums = [3, 2, 4, 6, 9]

let total = nums.reduce((accumulator, currentValue) => {
  return accumulator + currentValue
}, 1000)

console.log(total)
// const multiply = (x = 1, y = 1) => {
//   // if (typeof y === 'undefined') {
//   //   y = 1
//   // }

//   // y = typeof y === 'undefined' ? 1 : y

//   return x * y
// }

// console.log(multiply())

// const greet = (name, msg = 'Hi') => {
//   return `${msg}, ${name}`
// }

// console.log(greet('john'))

// const numberArr = [5, 10, 11, 2, 1]

// Math.max(nums)

// function add(a, b, c, d, e) {
//   return a + b + c + d + e
// }

// function add2(...nums) {
//   let total = 0
//   // nums.forEach(num => (total += num))

//   for (num of nums) {
//     total += num
//   }

//   return total
// }

// console.log(add(...numberArr))
// console.log(add(...numberArr))

// function printNames(name1, name2, ...others) {
//   console.log(name1)
//   console.log(name2)
//   console.log(others)
// }

// function add(x, y, ...others) {

// }

// printNames('john', 'jane', 'jack', 'josh', 'brad')

const fullName = ({ firstName, lastName }) => {
  return `${firstName} ${lastName}`
}
const data = [
  {
    id: 1,
    title: 'Fjallraven - Foldsack No. 1 Backpack, Fits 15 Laptops',
    price: 109.95,
    description:
      'Your perfect pack for everyday use and walks in the forest. Stash your laptop (up to 15 inches) in the padded sleeve, your everyday',
    category: 'men clothing',
    image: 'https://fakestoreapi.com/img/81fPKd-2AYL._AC_SL1500_.jpg'
  },
  {
    id: 2,
    title: 'Mens Casual Premium Slim Fit T-Shirts ',
    price: 22.3,
    description:
      'Slim-fitting style, contrast raglan long sleeve, three-button henley placket, light weight & soft fabric for breathable and comfortable wearing. And Solid stitched shirts with round neck made for durability and a great fit for casual fashion wear and diehard baseball fans. The Henley style round neckline includes a three-button placket.',
    category: 'men clothing',
    image:
      'https://fakestoreapi.com/img/71-3HjGNDUL._AC_SY879._SX._UX._SY._UY_.jpg'
  },
  {
    id: 3,
    title: 'Mens Cotton Jacket',
    price: 55.99,
    description:
      'great outerwear jackets for Spring/Autumn/Winter, suitable for many occasions, such as working, hiking, camping, mountain/rock climbing, cycling, traveling or other outdoors. Good gift choice for you or your family member. A warm hearted love to Father, husband or son in this thanksgiving or Christmas Day.',
    category: 'men clothing',
    image: 'https://fakestoreapi.com/img/71li-ujtlUL._AC_UX679_.jpg'
  },
  {
    id: 4,
    title: 'Mens Casual Slim Fit',
    price: 15.99,
    description:
      'The color could be slightly different between on the screen and in practice. / Please note that body builds vary by person, therefore, detailed size information should be reviewed below on the product description.',
    category: 'men clothing',
    image: 'https://fakestoreapi.com/img/71YXzeOuslL._AC_UY879_.jpg'
  },
  {
    id: 5,
    title:
      "John Hardy Women's Legends Naga Gold & Silver Dragon Station Chain Bracelet",
    price: 695,
    description:
      "From our Legends Collection, the Naga was inspired by the mythical water dragon that protects the ocean's pearl. Wear facing inward to be bestowed with love and abundance, or outward for protection.",
    category: 'jewelery',
    image: 'https://fakestoreapi.com/img/71pWzhdJNwL._AC_UL640_QL65_ML3_.jpg'
  },
  {
    id: 6,
    title: 'Solid Gold Petite Micropave ',
    price: 168,
    description:
      'Satisfaction Guaranteed. Return or exchange any order within 30 days.Designed and sold by Hafeez Center in the United States. Satisfaction Guaranteed. Return or exchange any order within 30 days.',
    category: 'jewelery',
    image: 'https://fakestoreapi.com/img/61sbMiUnoGL._AC_UL640_QL65_ML3_.jpg'
  },
  {
    id: 7,
    title: 'White Gold Plated Princess',
    price: 9.99,
    description:
      "Classic Created Wedding Engagement Solitaire Diamond Promise Ring for Her. Gifts to spoil your love more for Engagement, Wedding, Anniversary, Valentine's Day...",
    category: 'jewelery',
    image: 'https://fakestoreapi.com/img/71YAIFU48IL._AC_UL640_QL65_ML3_.jpg'
  },
  {
    id: 8,
    title: 'Pierced Owl Rose Gold Plated Stainless Steel Double',
    price: 10.99,
    description:
      'Rose Gold Plated Double Flared Tunnel Plug Earrings. Made of 316L Stainless Steel',
    category: 'jewelery',
    image: 'https://fakestoreapi.com/img/51UDEzMJVpL._AC_UL640_QL65_ML3_.jpg'
  },
  {
    id: 9,
    title: 'WD 2TB Elements Portable External Hard Drive - USB 3.0 ',
    price: 64,
    description:
      'USB 3.0 and USB 2.0 Compatibility Fast data transfers Improve PC Performance High Capacity; Compatibility Formatted NTFS for Windows 10, Windows 8.1, Windows 7; Reformatting may be required for other operating systems; Compatibility may vary depending on user’s hardware configuration and operating system',
    category: 'electronics',
    image: 'https://fakestoreapi.com/img/61IBBVJvSDL._AC_SY879_.jpg'
  },
  {
    id: 10,
    title: 'SanDisk SSD PLUS 1TB Internal SSD - SATA III 6 Gb/s',
    price: 109,
    description:
      'Easy upgrade for faster boot up, shutdown, application load and response (As compared to 5400 RPM SATA 2.5” hard drive; Based on published specifications and internal benchmarking tests using PCMark vantage scores) Boosts burst write performance, making it ideal for typical PC workloads The perfect balance of performance and reliability Read/write speeds of up to 535MB/s/450MB/s (Based on internal testing; Performance may vary depending upon drive capacity, host device, OS and application.)',
    category: 'electronics',
    image: 'https://fakestoreapi.com/img/61U7T1koQqL._AC_SX679_.jpg'
  },
  {
    id: 11,
    title:
      'Silicon Power 256GB SSD 3D NAND A55 SLC Cache Performance Boost SATA III 2.5',
    price: 109,
    description:
      '3D NAND flash are applied to deliver high transfer speeds Remarkable transfer speeds that enable faster bootup and improved overall system performance. The advanced SLC Cache Technology allows performance boost and longer lifespan 7mm slim design suitable for Ultrabooks and Ultra-slim notebooks. Supports TRIM command, Garbage Collection technology, RAID, and ECC (Error Checking & Correction) to provide the optimized performance and enhanced reliability.',
    category: 'electronics',
    image: 'https://fakestoreapi.com/img/71kWymZ+c+L._AC_SX679_.jpg'
  },
  {
    id: 12,
    title:
      'WD 4TB Gaming Drive Works with Playstation 4 Portable External Hard Drive',
    price: 114,
    description:
      "Expand your PS4 gaming experience, Play anywhere Fast and easy, setup Sleek design with high capacity, 3-year manufacturer's limited warranty",
    category: 'electronics',
    image: 'https://fakestoreapi.com/img/61mtL65D4cL._AC_SX679_.jpg'
  },
  {
    id: 13,
    title: 'Acer SB220Q bi 21.5 inches Full HD (1920 x 1080) IPS Ultra-Thin',
    price: 599,
    description:
      '21. 5 inches Full HD (1920 x 1080) widescreen IPS display And Radeon free Sync technology. No compatibility for VESA Mount Refresh Rate: 75Hz - Using HDMI port Zero-frame design | ultra-thin | 4ms response time | IPS panel Aspect ratio - 16: 9. Color Supported - 16. 7 million colors. Brightness - 250 nit Tilt angle -5 degree to 15 degree. Horizontal viewing angle-178 degree. Vertical viewing angle-178 degree 75 hertz',
    category: 'electronics',
    image: 'https://fakestoreapi.com/img/81QpkIctqPL._AC_SX679_.jpg'
  },
  {
    id: 14,
    title:
      'Samsung 49-Inch CHG90 144Hz Curved Gaming Monitor (LC49HG90DMNXZA) – Super Ultrawide Screen QLED ',
    price: 999.99,
    description:
      '49 INCH SUPER ULTRAWIDE 32:9 CURVED GAMING MONITOR with dual 27 inch screen side by side QUANTUM DOT (QLED) TECHNOLOGY, HDR support and factory calibration provides stunningly realistic and accurate color and contrast 144HZ HIGH REFRESH RATE and 1ms ultra fast response time work to eliminate motion blur, ghosting, and reduce input lag',
    category: 'electronics',
    image: 'https://fakestoreapi.com/img/81Zt42ioCgL._AC_SX679_.jpg'
  },
  {
    id: 15,
    title: "BIYLACLESEN Women's 3-in-1 Snowboard Jacket Winter Coats",
    price: 56.99,
    description:
      'Note:The Jackets is US standard size, Please choose size as your usual wear Material: 100% Polyester; Detachable Liner Fabric: Warm Fleece. Detachable Functional Liner: Skin Friendly, Lightweigt and Warm.Stand Collar Liner jacket, keep you warm in cold weather. Zippered Pockets: 2 Zippered Hand Pockets, 2 Zippered Pockets on Chest (enough to keep cards or keys)and 1 Hidden Pocket Inside.Zippered Hand Pockets and Hidden Pocket keep your things secure. Humanized Design: Adjustable and Detachable Hood and Adjustable cuff to prevent the wind and water,for a comfortable fit. 3 in 1 Detachable Design provide more convenience, you can separate the coat and inner as needed, or wear it together. It is suitable for different season and help you adapt to different climates',
    category: 'women clothing',
    image: 'https://fakestoreapi.com/img/51Y5NI-I5jL._AC_UX679_.jpg'
  },
  {
    id: 16,
    title:
      "Lock and Love Women's Removable Hooded Faux Leather Moto Biker Jacket",
    price: 29.95,
    description:
      '100% POLYURETHANE(shell) 100% POLYESTER(lining) 75% POLYESTER 25% COTTON (SWEATER), Faux leather material for style and comfort / 2 pockets of front, 2-For-One Hooded denim style faux leather jacket, Button detail on waist / Detail stitching at sides, HAND WASH ONLY / DO NOT BLEACH / LINE DRY / DO NOT IRON',
    category: 'women clothing',
    image: 'https://fakestoreapi.com/img/81XH0e8fefL._AC_UY879_.jpg'
  },
  {
    id: 17,
    title: 'Rain Jacket Women Windbreaker Striped Climbing Raincoats',
    price: 39.99,
    description:
      "Lightweight perfet for trip or casual wear---Long sleeve with hooded, adjustable drawstring waist design. Button and zipper front closure raincoat, fully stripes Lined and The Raincoat has 2 side pockets are a good size to hold all kinds of things, it covers the hips, and the hood is generous but doesn't overdo it.Attached Cotton Lined Hood with Adjustable Drawstrings give it a real styled look.",
    category: 'women clothing',
    image: 'https://fakestoreapi.com/img/71HblAHs5xL._AC_UY879_-2.jpg'
  },
  {
    id: 18,
    title: "MBJ Women's Solid Short Sleeve Boat Neck V ",
    price: 9.85,
    description:
      '95% RAYON 5% SPANDEX, Made in USA or Imported, Do Not Bleach, Lightweight fabric with great stretch for comfort, Ribbed on sleeves and neckline / Double stitching on bottom hem',
    category: 'women clothing',
    image: 'https://fakestoreapi.com/img/71z3kpMAYsL._AC_UY879_.jpg'
  },
  {
    id: 19,
    title: "Opna Women's Short Sleeve Moisture",
    price: 7.95,
    description:
      '100% Polyester, Machine wash, 100% cationic polyester interlock, Machine Wash & Pre Shrunk for a Great Fit, Lightweight, roomy and highly breathable with moisture wicking fabric which helps to keep moisture away, Soft Lightweight Fabric with comfortable V-neck collar and a slimmer fit, delivers a sleek, more feminine silhouette and Added Comfort',
    category: 'women clothing',
    image: 'https://fakestoreapi.com/img/51eg55uWmdL._AC_UX679_.jpg'
  },
  {
    id: 20,
    title: 'DANVOUY Womens T Shirt Casual Cotton Short',
    price: 12.99,
    description:
      '95%Cotton,5%Spandex, Features: Casual, Short Sleeve, Letter Print,V-Neck,Fashion Tees, The fabric is soft and has some stretch., Occasion: Casual/Office/Beach/School/Home/Street. Season: Spring,Summer,Autumn,Winter.',
    category: 'women clothing',
    image: 'https://fakestoreapi.com/img/61pHAEJ4NML._AC_UX679_.jpg'
  }
]

// Write a function (arrow function) that accepts a product array, priceKey (optional)
// It will map over all the items in the array and find the price key
// return a new array of objects with the price converted to rupees

// const currencyConv = arrObj => {
//   return arrObj.map(item => {
//     return { ...item, price: item.price * 75 }
//   })
// }

// const currencyConv = arrObj =>
//   arrObj.map(item => ({ ...item, price: item.price * 75 }))

// console.log(currencyConv(data))

// const currencyConv = arr => {
//   const updatedArr = []
//   arr.forEach(obj => updatedArr.push({ ...obj, price: obj.price * 75 }))
//   return updatedArr
// }

// console.log(currencyConv(data))

const currencyConv = (arrObj, tarKey = 'price') => {
  return arrObj.map(item => {
    return { ...item, [tarKey]: item[tarKey] * 75 }
  })
}

console.log(currencyConv(data))

// Write a function that accepts a dataset, key, value
// return all the objects that have this value

customFilter(data, 'price', 12.99)
// const maths = {
//   add: function (x, y) {
//     return x + y
//   },
//   sub: function (x, y) {
//     return x - y
//   },
//   info: 'Maths function'
// }

// console.log(maths.add(10, 20))
// console.log(maths.info)

// const movieReviews = [4.5, 5.0, 3.2, 2.1, 4.7, 3.8, 3.1, 3.9, 4.4]

// const highest = Math.max(...movieReviews)
// const lowest = Math.min(...movieReviews)

// // let total = 0
// // movieReviews.forEach(rating => (total += rating))

// const total = movieReviews.reduce((acc, nextVal) => acc + nextVal)
// const average = total / movieReviews.length

// const movieReviewInfo = {
//   highest: highest,
//   lowest: lowest,
//   total: total,
//   average: average
// }

// const movieReviewInfo = {
//   highest,
//   lowest,
//   total,
//   average
// }

// const movieReviewInfo = { highest, lowest, total, average }

// console.log(movieReviewInfo)

// console.log(movieReviews)
// console.log(highest)
// console.log(lowest)
// console.log(total)
// console.log(average)

// const getReviewDetails = arr => {
//   const highest = Math.max(...arr)
//   const lowest = Math.min(...arr)
//   const total = arr.reduce((accumulator, nextVal) => accumulator + nextVal)
//   const average = total / arr.length

//   return {
//     highest,
//     lowest,
//     acc: total,
//     average
//   }
// }

// console.log(getReviewDetails([4.5, 5.0, 3.2]))

// const username = 'janedoe'
// const role = 'admin'

// const user1 = {
//   [role]: username,
//   [username.toUpperCase()]: username
// }

// console.log(user1)

// const addProperty = (obj, k, v) => {
//   return { ...obj, [k]: v }
// }

// const addProperty = (obj, k, v) => ({ ...obj, [k]: v })

// const user = {
//   firstName: 'John',
//   lastName: 'Doe'
// }

// console.log(addProperty(user, 'age', 25))
// console.log(addProperty(user, 'lastName', 'cool'))

// const math = {
//   multiply: function (x, y) {
//     return x * y
//   },
//   divide: function (x, y) {
//     return x / y
//   },
//   subtract: function (x) {
//     return x - x
//   },
//   info: 'The math object'
// }

// function square(x) {
//   return x * x
// }

// const power = {
//   square,
//   cube: function (x) {
//     return x * x * x
//   },
//   hypercube: function (x) {
//     return x * x * x * x
//   }
// }

// console.log(square(20))
// console.log(power.cube(20))
// console.log(power.hypercube(20))

// const math2 = {
//   multiply(x, y) {
//     return x * y
//   },
//   divide(x, y) {
//     return x / y
//   },
//   subtract(x, y) {
//     return x - y
//   }
// }

// console.log(math2.multiply())

// function greet() {
//   console.log('Hello World!')
//   // console.log(this)
// }

// // greet()

// // console.log(this)

// greet()
// this.greet()

// function greet() {
//   console.log(this)
// }

// const user = {
//   firstName: 'John',
//   lastName: 'Doe',
//   role: 'admin',
//   fullName() {
//     console.log(this)
//   }
// }

// // console.log(user.firstName)
// // console.log(user.lastName)
// // console.log(user.role)
// user.fullName()
// greet()

// const user = {
//   firstName: 'John',
//   lastName: 'Doe',
//   role: 'admin',
//   fullName() {
//     console.log(`${this.firstName} ${this.lastName} is ${this.role}`)
//   }
// }

// user.fullName()

// const user = {
//   firstName: 'John',
//   lastName: 'Doe',
//   role: 'admin',
//   fullName() {
//     const { firstName, lastName, role } = this // Object Destructuring
//     console.log(`${firstName} ${lastName} is an ${role}`)
//   }
// }

// user.fullName()

const user = {
  firstName: 'John',
  lastName: 'Doe',
  role: 'admin',
  greet() {
    console.log('hello world')
  },
  fullName() {
    return `${this.firstName} ${this.lastName} is an ${this.role}`
  },
  logDetails() {
    console.log(this)
    console.log(`${this.fullName()} and is cool!`)
  }
}

const coolUser = {
  firstName: 'Jane',
  lastName: 'Chan',
  role: 'superadmin',
  fullName: user.fullName,
  logDetails: user.logDetails
}

// user.logDetails()

// const outsideLogDetails = user.logDetails()
// console.log(outsideLogDetails)

// const outsideGreet = user.greet
// outsideGreet()

const logDetails = user.logDetails

// logDetails()
// user.logDetails()

// console.log(coolUser.fullName())
coolUser.logDetails()
// const hellos = {
//   messages: [
//     'hello world',
//     'hello universe',
//     'hello darkness',
//     'hello hello',
//     'heylo'
//   ],
//   pickMsg() {
//     console.log(this)
//     const index = Math.floor(Math.random() * this.messages.length)
//     return this.messages[index]
//   },
//   start() {
//     setInterval(() => console.log(this.pickMsg()), 1000)
//   }
// }

// // setInterval(function () {
// //   console.log('HELLO WORLD')
// // }, 500)

// hellos.start()

// const h1 = document.getElementById('pagetitle')
// console.dir(h1)

// const li = document.getElementsByTagName('li')
// console.log(li)

// const p = document.getElementsByTagName('p')
// console.log(p.length)

// const special = document.getElementsByClassName('special')
// console.log(special)

const someUl = document.getElementsByTagName('ul')[0]
// console.log(someUl[0])

const specials = someUl.getElementsByClassName('special')
console.log(specials)
// // const ul = document.querySelector('ul')
// // const allLis = ul.querySelectorAll('li')
// // allLis[0].innerText = 'This is the modified version.'

// // console.log(ul.innerText)

// const ul = document.querySelector('ul')
// const allLis = ul.querySelectorAll('li')

// // console.log(allLis)

// for (let li of allLis) {
//   li.innerHTML += '<b class="bold-text">Added to it via JS</b>'
// }

// const lis = document.querySelectorAll('li')
// const colors = ['red', 'yellow', 'green', 'orange', 'teal']

// for (li of lis) {
//   li.style.color = colors[Math.floor(Math.random() * colors.length)]
//   li.style.fontSize = '20'
//   li.style.fontWeight = 'bold'
//   // li.style.backgroundColor = 'black'
//   li.style.fontFamily = 'Helvetica, sans-serif'
// }

// const subtitle = document.createElement('h2')
// subtitle.innerText = 'This is a subtitle'
// subtitle.style.fontSize = '35px'

// const section = document.querySelector('section')
// section.appendChild(subtitle)

// const photo = document.createElement('img')
// photo.setAttribute('src', 'https://4.img-dpreview.com/files/ph1.jpeg')
// photo.style.width = '400px'

// const photoLink = document.createElement('a')
// photoLink.setAttribute('href', 'https://4.img-dpreview.com/files/ph1.jpeg')
// photoLink.setAttribute('target', '_blank')

// photoLink.appendChild(photo)
// section.appendChild(photolink)

// const todos = document.querySelector('#todos')
// const newTask = document.createElement('li')
// newTask.innerText = 'Brand new task to complete'
// // newTask.innerHTML = 'Brand new task to complete <button>X</button>'
// newTask.classList.add('todo')
// newTask.style.color = 'purple'
// newTask.style.fontWeight = 'bold'

// todos.appendChild(newTask) // append to the end

// const firstTask = todos.querySelector('li')
// todos.insertBefore(newTask, firstTask) // insert before a certain element

// const b = document.createElement('b')
// b.innerText = 'HELLO WORLD'
// const p = document.querySelector('p')

// p.insertAdjacentElement('beforebegin', b)
// p.insertAdjacentElement('afterbegin', b)
// p.insertAdjacentElement('beforeend', b)
// p.insertAdjacentElement('afterend', b)

// const b = document.createElement('b')
// b.innerText = 'HELLO WORLD'
// const i = document.createElement('i')
// i.innerText = 'GOODBYE GALAXY'

// const p = document.querySelector('p')

// p.append(b, i) // append both b and i to the end of p
// p.append(b) // just append b to the end of p
// p.prepend(i) // prepend i to the start of p
// const btn = document.querySelector('#btn1')

// btn.onclick = function () {
//   console.log('Incorrect EVENT')
// }

// btn.onclick = function () {
//   console.log('Log this as well')
// }

// btn.addEventListener('click', function () {
//   console.log('Button was clicked!')
// })

// // btn.addEventListener('click', function () {
// //   alert('This button was click and it trigged this!')
// // })

// btn.addEventListener('mouseover', function () {
//   btn.innerText = 'Button was hovered'
//   // console.log('The mouse was hovered over this button')
// })

// btn.addEventListener('mouseout', function () {
//   btn.innerText = 'Button 1'
//   // console.log('The mouse was hovered over this button')
// })

// window.addEventListener('scroll', function () {
//   console.log('Stop scrolling')
// })

// btn.addEventListener('mouseover', function () {
//   const height = Math.floor(Math.random() * window.innerHeight)
//   const width = Math.floor(Math.random() * window.innerWidth)
//   btn.style.top = `${height}px`
//   btn.style.left = `${width}px`
// })

// btn.addEventListener('click', function () {
//   btn.innerText = 'You won!'
//   document.body.style.backgroundColor = 'green'
// })

// const colors = [
//   'red',
//   'orange',
//   'yellow',
//   'green',
//   'blue',
//   'purple',
//   'indigo',
//   'violet',
//   'teal'
// ]

// const container = document.querySelector('#boxes')

// const printColor = function (e) {
//   console.log(this.style.backgroundColor)
// }

// const changeColor = function (e) {
//   console.log(e)
//   const h1 = document.querySelector('h1')
//   h1.innerText = this.style.backgroundColor + ' selected'
//   h1.style.color = this.style.backgroundColor
// }

// for (color of colors) {
//   const box = document.createElement('div')
//   box.style.backgroundColor = color
//   box.classList.add('box')
//   container.append(box)

//   box.addEventListener('click', printColor)
//   box.addEventListener('click', changeColor)
// }

// document.body.addEventListener('keypress', function (e) {
//   if (e.code === 'Space') {
//     console.log('You clicked the space bar')
//   }
// })

// const input = document.querySelector('#username')

// input.addEventListener('keydown', function (e) {
//   console.log('KEY DOWN')
// })

// input.addEventListener('keyup', function (e) {
//   console.log('KEY UP')
// })

// input.addEventListener('keypress', function (e) {
//   console.log('KEY PRESS')
// })
taskAdd.querySelector('#addtask')
const todos = document.querySelector('#todos')

taskAdd.addEventListener('keypress', function (event) {
  if (event.key === 'Enter') {
    const newTaskText = this.value
    const newTask = document.createElement('li')
    newTask.innerText = newTaskText
    todos.append(newTask)
    this.value = ''
  }
})
// // console.log('The first log')
// // alert('An interruption in between')
// // console.log('The last log')

// // console.log('The first log')
// // setTimeout(() => {
// //   console.log('The line that takes time to complete')
// // }, 3000)

// // console.log('The last log')

// const btn = document.querySelector('button')

// // setTimeout(() => {
// //   btn.style.transform = `translateX(100px)`
// //   setTimeout(() => {
// //     btn.style.transform = `translateX(200px)`
// //     setTimeout(() => {
// //       btn.style.transform = `translateX(300px)`
// //       setTimeout(() => {
// //         btn.style.transform = `translateX(400px)`
// //         setTimeout(() => {
// //           btn.style.transform = `translateX(500px)`
// //           setTimeout(() => {
// //             btn.style.transform = `translateX(600px)`
// //           }, 1000)
// //         }, 1000)
// //       }, 1000)
// //     }, 1000)
// //   }, 1000)
// // }, 1000)

// const moveX = (element, amount, delay, successCb, failureCb) => {
//   setTimeout(() => {
//     element.style.transform = `translateX(${amount}px)`
//     if (callback) {
//       successCb()
//     }
//   }, delay)
// }

// moveX(btn, 100, 500, () => {
//   // Success
//   console.log('Success!')
//   moveX(btn, 100, 500, () => {
//     // Success
//     console.log('Success!')
//       moveX(btn, 100, 500, () => {
//         // Success
//         console.log('Success!')
//           moveX(btn, 100, 500, () => {
//             // Success
//             console.log('Success!')
//               moveX(btn, 100, 500, () => {
//                 // Success
//                 console.log('Success!')
//               }, () => {
//                 // Failure
//                 alert('FAILED!')
//               })
//           }, () => {
//             // Failure
//             alert('FAILED!')
//           })
//       }, () => {
//         // Failure
//         alert('FAILED!')
//       })
//   }, () => {
//     // Failure
//     alert('FAILED!')
//   })
// }, () => {
//   // Failure
//   alert('FAILED!')
// })

// const willGetAPlayStation = new Promise((resolve, reject) => {
//   const rand = Math.random()

//   if (rand < 0.5) {
//     resolve()
//   } else {
//     reject()
//   }
// })

// // console.log(willGetAPlayStation)

// // on promise fulfillment
// willGetAPlayStation
//   .then(() => {
//     console.log('I got a playstation!')
//   })
//   .catch(() => {
//     console.log("$@#$% I didn't get anything!")
//   })

// const makePlayStationPromise = () => {
//   return new Promise((resolve, reject) => {
//     setTimeout(() => {
//       const rand = Math.random()
//       if (rand < 0.5) {
//         resolve()
//       } else {
//         reject()
//       }
//     }, 5000)
//   })
// }

// makePlayStationPromise()
//   .then(() => {
//     console.log('I got a playstation!')
//   })
//   .catch(() => {
//     console.log("$@#$% I didn't get anything!")
//   })

// const fakeRequest = url => {
//   return new Promise((resolve, reject) => {
//     setTimeout(() => {
//       const pages = {
//         '/users': [
//           { id: 1, username: 'john' },
//           { id: 2, username: 'jane' }
//         ],
//         '/about': 'This is the about page'
//       }
//       const data = pages[url]

//       if (data) {
//         resolve({ status: 200, data })
//       } else {
//         reject({ status: 404 })
//       }
//     }, 3000)
//   })
// }

// fakeRequest('/kaand')
//   .then(() => console.log('DONE SUCCESS'))
//   .catch(() => console.log('FAILED!'))

const fakeRequest = url => {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      const pages = {
        '/users': [
          { id: 1, username: 'john' },
          { id: 2, username: 'jane' }
        ],
        '/users/1': {
          id: 1,
          username: 'johndoe',
          topPostId: 53231,
          city: 'mumbai'
        },
        '/users/5': {
          id: 1,
          username: 'janedoe',
          topPostId: 32443,
          city: 'pune'
        },
        '/posts/53231': {
          id: 1,
          title: 'Really amazing post',
          slug: 'really-amazing-post'
        }
      }
      const data = pages[url]

      if (data) {
        resolve({ status: 200, data })
      } else {
        reject({ status: 404 })
      }
    }, 1000)
  })
}

// fakeRequest('/users')
//   .then(res => {
//     const id = res.data[0].id
//     fakeRequest(`/users/${id}`).then(res => {
//       const postId = res.data.topPostId
//       fakeRequest(`/posts/${postId}`).then(res => {
//         console.log(res)
//       })
//     })
//   })
//   .catch(err => console.log(err))

fakeRequest('/users')
  .then(res => {
    console.log(res)
    const id = res.data[0].id
    return fakeRequest(`/chubaka/${id}`)
  })
  .then(res => {
    console.log(res)
    const postId = res.data.topPostId
    return fakeRequest(`/posts/${postId}`)
  })
  .then(res => {
    console.log(res)
  })
  .catch(err => console.log(err))
<!-- HTML FILE -->
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>JavaScript Events</title>
    <link rel="stylesheet" href="style.css" />
  </head>
  <body>
    <!-- <h1>JavaScript Events</h1> -->

    <!-- <button onclick="console.log('Hello World')">Say Hello</button> -->

    <!-- <button id="btn1">Try to click me</button> -->

    <!-- DEMO BTN MOVE -->
    <button>Try to click this</button>

    <!-- MULTIPLE ITEM EVENTS -->
    <!-- ADD THIS H1 LATER -->
    <!-- <h1 style="text-align: center">Pick a color</h1>
    <section id="boxes"></section> -->

    <!-- KEY EVENTS -->
    <!-- <input type="text" id="username" placeholder="username" /> -->
    <!-- <input type="text" id="addtask" placeholder="Create a task" /> -->
    <!-- <ul id="todos"></ul> -->

    <!-- FORM EVENTS -->
    <!-- <form id="payment-form">
      <input name="cc" type="text" placeholder="credit card no." id="cc" />
      <label>
        <input
          name="terms"
          type="checkbox"
          placeholder="credit card no."
          id="terms"
        />
        I agree to terms and conditions
      </label>
      <select name="brand" id="brand">
        <option selected value="Rupay Card">Rupay Card</option>
        <option value="Visa Card">Visa Card</option>
        <option value="Master Card">Master Card</option>
      </select>
      <input type="submit" value="Submit Form" />
    </form> -->
    <script src="scratchpad_12.js"></script>
  </body>
</html>
// const request = new XMLHttpRequest()

// request.onload = function () {
//   console.log('DATA LOADED')
// }

// request.onerror = function () {
//   console.log('ERROR!')
// }

// request.open('GET', 'https://swapi.dev/api/planets')
// request.send()

// const req = new XMLHttpRequest()

// req.addEventListener('load', function () {
//   console.log('DATA LOADED')
//   const data = JSON.parse(this.responseText)
//   const planet = data.results[0]
//   const filmUrl = planet.films[0]

//   // Second request
//   const film = new XMLHttpRequest()
//   film.addEventListener('load', function () {
//     const filmData = JSON.parse(this.responseText)
//     console.log(filmData)
//   })
//   film.open('get', filmUrl, true)
//   film.send()
// })
// req.addEventListener('error', function () {
//   console.log('ERROR')
// })

// req.open('get', 'https://swapi.dev/api/planets', true)
// req.send()

// console.log(req)

const parseData = res => {
  if (res.status !== 200) {
    throw new Error(`Status HELLO code error: ${res.status}`)
  } else {
    return res.json()
  }
}

const printData = data => {
  // console.log(data)
  data.results.forEach(planet => {
    console.log(planet.name)
  })
  // return new Promise((resolve, reject) => {
  //   resolve(data.next)
  // })
  return Promise.resolve(data.next)
}

const fetchNext = url => {
  return fetch(url)
}

fetch('https://swapi.dev/api/plasanets')
  .then(parseData)
  .then(printData)
  .then(fetchNext)
  .then(parseData)
  .then(printData)
  // .then(parseData)
  // .then(data => {
  //   printData(data)
  //   return fetchNext(data.next)
  // })
  // .then(res => {
  //   return parseData(res)
  // })
  // .then(data => {
  //   printData(data)
  // })
  .catch(err => {
    console.log('SOMETHING WENT WRONG\n\n', err)
  })

console.log('HELLLLO WORLDDD!')

// SLIDE EXAMPLES

// Fetch basic
fetch('https://swapi.dev/api/planets', {
  headers: { Accept: 'application/json' }
})
  .then(response => {
    if (response.status !== 200) {
      console.log('Problem', response.status)
      return
    }
    // Have to use response.json as we get back a stream
    // and not the json directly.
    response.json().then(data => {
      // itself is a promise
      console.log(data)
    })
  })
  .catch(function (err) {
    console.log('Fetch err', err)
  })

//  -------------------------

// XHR example using fetch instead

fetch('https://swapi.dev/api/plannets')
  .then(response => {
    if (!response.ok) {
      console.log('Something went wrong!', response.status)
      // throw new Error(`Status code error: ${response.status}`)
    } else {
      response.json().then(data => {
        for (let planet of data.results) {
          console.log(planet.name)
        }
      })
    }
  })
  .catch(err => {
    console.log('ERROR!', err)
  })

// CHAINING FETCH
fetch('https://swapi.dev/api/planets')
  .then(response => {
    if (!response.ok) {
      throw new Error(`Status code error: ${response.status}`)
    }
    return response.json()
  })
  .then(data => {
    console.log('Fetched all planets')
    const filmUrl = data.results[0].films[0]
    return fetch(filmUrl)
  })
  .then(response => {
    if (!response.ok) {
      throw new Error(`Status code error: ${response.status}`)
    }
    return response.json()
  })
  .then(data => {
    console.log('Fetched first film')
    console.log(data.title)
  })
  .catch(err => {
    console.log('ERROR!', err)
  })

// Chaining FETCH -> function abstraction

// Custom function to extract checking and parsing logic
const checkStatusAndParse = res => {
  if (!res.ok) {
    throw new Error(`Status code error: ${res.status}`)
  }
  return res.json()
}

fetch('https://swapi.dev/api/planets')
  .then(response => {
    return checkStatusAndParse(response)
  })
  .then(data => {
    console.log('Fetched all planets')
    const filmUrl = data.results[0].films[0]
    return fetch(filmUrl)
  })
  .then(response => {
    return checkStatusAndParse(response)
  })
  .then(data => {
    console.log('Fetched first film')
    console.log(data.title)
  })
  .catch(err => {
    console.log('ERROR!', err)
  })

// Chaining FETCH -> function abstraction - cleanup

// Custom function to extract checking and parsing logic
const checkStatusAndParse = res => {
  if (!res.ok) {
    throw new Error(`Status code error: ${res.status}`)
  }
  return res.json()
}

fetch('https://swapi.dev/api/planets')
  .then(checkStatusAndParse)
  .then(data => {
    console.log('Fetched all planets')
    const filmUrl = data.results[0].films[0]
    return fetch(filmUrl)
  })
  .then(checkStatusAndParse)
  .then(data => {
    console.log('Fetched first film')
    console.log(data.title)
  })
  .catch(err => {
    console.log('ERROR!', err)
  })
// fetch('https://swapi.dev/api/planets')
//   .then(response => {
//     if (response.status !== 200) {
//       throw new Error('ERRORRRR!')
//     } else {
//       console.log(response)
//       // return response.json()
//     }
//   })
//   // .then(data => console.log(data.results))
//   .catch(err => console.log(err))

// axios
//   .get('https://swapi.dev/api/planets')
//   .then(({ data }) => {
//     // console.log(res.data.results)
//     const tatooine = data.results[0]
//     console.log('PLANET NAME: ', tatooine.name)
//     return axios.get(tatooine.residents[0])
//   })
//   .then(({ data }) => {
//     console.log('PILOT NAME: ', data.name)
//     return axios.get(data.starships[0])
//   })
//   .then(({ data }) => console.log('STARSHIP: ', data.name))
//   .catch(err => console.log('SOMETHING WENT WRONG', err))

// const user = {
//   name: 'John',
//   job: 'FullStack Dev',
//   age: 25,
//   details: {
//     father: 'Jack',
//     mother: 'Jane',
//     planet: {
//       name: 'Tatooine',
//       galaxy: 'Far far away',
//       boss: 'Lord Vader'
//     }
//   },
//   sayName() {
//     console.log(this.name)
//   }
// }

// const { details, age, sayName } = user

// console.log(details)
// console.log(age)

// sayName()

// Get a reference the planets div
const planets = document.querySelector('#planets')
const pageTitle = document.querySelector('#title')

const getPlanets = () => {
  axios.get('https://swapi.dev/api/planets').then(({ data }) => {
    pageTitle.innerHTML = `Total Planets in the galaxy: ${data.count}`
    data.results.forEach(planet => {
      const planetCard = document.createElement('div')
      const planetName = document.createElement('h2')
      const planetPop = document.createElement('span')
      const planetTerr = document.createElement('span')

      planetName.innerText = planet.name
      planetPop.innerHTML = `Population: <b>${planet.population}</b><br>`
      planetTerr.innerHTML = `Terrain: <b>${planet.terrain}</b>`

      planetCard.append(planetName, planetPop, planetTerr)
      planetName.classList.add('text-2xl')
      planetCard.classList.add('p-4')
      planetCard.classList.add('bg-yellow-200')
      planets.append(planetCard)
    })
  })
}

// getPlanets()