dom.js

// let mydiv = document.querySelector("#mydiv");

// let parent = document.querySelector("#mydiv");
// let child = document.querySelector("#fpara");

// parent.removeChild(child);


// let newElement = document.createElement("span");
// newElement.textContent = "Love Babbar";

// mydiv.insertAdjacentElement("beforebegin",newElement);

// let fpara = document.getElementById("fpara");
// fpara.addEventListener('click',changeText,true);
// // fpara.removeEventListener('click',changeText,true);

// function changeText() {
//     console.log(event);
//     let fpara = document.getElementById("fpara");
//     fpara.textContent = "Hii Antarikshya";
// }

// let anchorElement = document.getElementById("fanchor");

// anchorElement.addEventListener("click",function(event)
// {
//     event.preventDefault();
//     anchorElement.textContent = "Click Done Bhai!!";
// });

// let paras = document.querySelectorAll("p");

// for(let i = 0;i<paras.length;i++) {
//     let para = paras[i];
//     para.addEventListener('click',() => {
//         console.log("You have clicked on Para-",i+1);
//     });
// }
// 4 Instances

// function alertPara(event) {
//     alert("You have Clicked on para:" + event.target.textContent);
// }

// for(let i = 0;i<paras.length;i++)
// {
//     let para = paras[i];
//     console.log("eventListener Added");
//     para.addEventListener('click',alertPara);
// }

// let mydiv = document.getElementById("wrapper");
// mydiv.addEventListener("click",alertPara);

// let fpara = document.querySelector("#fpara");
// fpara.addEventListener('click',(event)=> {
//     alert("The Event Occured is", event);
//     alert("You have clicked on " + event.target.textContent);
// });

// function func(event)
// {
//     alert("You have Clicked on - " + event.target.textContent);
//     let pos = event.target;
//     pos.textContent = "Antarikshya";
//     if(event.target.id === "tpara"){
//         let tpara = document.querySelector("#tpara");
//         let new_para = document.createElement("h1");
//         new_para.textContent = "Hii How are You?";
//         tpara.insertAdjacentElement('afterbegin',new_para);
//     }
// }

// let mydiv = document.getElementById("wrapper");
// mydiv.addEventListener('click',func);
// // mydiv.removeEventListener('click',func);
// let anchor = document.getElementById("anch");
// anchor.addEventListener('click',(event) => {
//     event.preventDefault();
// })




// Lecture Part

// Code 1
// const t1 = performance.now();

// for(let i = 1;i<=100;i++)
// {
//     let elem = document.createElement("p");
//     elem.textContent = `${i} Para`;
//    document.body.appendChild(elem);
// }

// const t2 = performance.now();

// console.log(t2-t1 + "Is the time taken");

// // Code 2
// const t3 = performance.now();
// let mydiv = document.createElement("div");

// for(let i=1;i<=100;i++) {
//     let elem = document.createElement("p");
//     elem.textContent = `${i} Para`;
//     mydiv.appendChild(elem);
// }

// document.body.appendChild(mydiv);

// const t4 = performance.now();
// console.log(t4-t3 + "Is the time taken");



// Best Code
// let fragment = document.createDocumentFragment();

// for(let i=1;i<=100;i++)
// {
//     let para = document.createElement("p");
//     para.textContent = "This is Para-" + i;
//     fragment.appendChild(para); // No Reflow and Repaint
// }
// document.body.appendChild(fragment);
// only 1 Reflow and Repaint


// Promises

// let firstPromise = new Promise((resolve,reject)=> {
//     console.log("Love");
//     resolve(1001);
// })
// let firstPromise = new Promise((resolve,reject)=> {
//     console.log("Love");
//     reject(new Error("Internal Server Error"));    
// })


// function sayMyName() {
//     console.log("My Name is Antaikshya");
// }


// setTimeout(sayMyName,10000);

// let firstPromise = new Promise((resolve,reject) => {
//     setTimeout(sayMyName,2000);
//     resolve(1);
//     reject(new Error("Not Done"));
// });

// let Promise1 = new Promise((resolve,reject) => {
//     let success = false;
//     if(success) {
//         resolve("Promise Fullfilled");
//     }
//     else {
//         reject("Promise Rejected, Internal Server Error");
//     }
// });

// // Promise1.then((message) => {
// //     console.log("Message = " + message);
// // }).catch((error)=> {
// //     console.log("Error: " + error);
// // })

// //Promise Chaining

// Promise1.then((message) => {
//     console.log("First Msg:" + message);
//     return "Promise Fullfilled Second Message";
// }).then((message) => {
//     console.log(message);
//     return "Promise Fullfilled Third Message";
// }).then((message) => {
//     console.log("Third Message : " + message);
// }).catch((msg) => {
//     console.error("The Error is-" + msg);
// }).finally(() => {
//     console.log("You have reached Finally Block");
// });


// let Promise1 = new Promise((resolve,reject) => {
//     setTimeout(reject,1000,"First");
// });
// let Promise2 = new Promise((resolve,reject) => {
//     setTimeout(resolve,2000,"Second");
// });
// let Promise3 = new Promise((resolve,reject) => {
//     setTimeout(resolve,4000,"Third");
// });

// Promise.all([Promise1,Promise2,Promise3]).then((values) => {
//     console.log(values);
// }).catch((err)=> {
//     console.error("error: "+ err);
// });

// Lecture Ends

// Lecture--> Async Await and Fetch API

// async function getData() {
//     setTimeout(function() {
//         console.log("I am inside set Timeout Block");
//     },3000);
// }

// console.log(getData());


// Fetch API

// async function getData() {
    
//     // get request
//     let response = await fetch('https://jsonplaceholder.typicode.com/posts/1/comments');
//     // Parse response
//     let data  = await response.json(); // -> Async Operation
//     console.log(data);
// }
// getData();
// //

// const myHeaders = new Headers();
// myHeaders.append("Content-Type", "application/json");

// const url = "https://jsonplaceholder.typicode.com/posts";

// const options = {
//     method: "POST",
//     body: JSON.stringify({ username: "example" }),
//     headers: myHeaders,
// };

// async function getData() {
//     const response = await fetch(url);
//     const data = await response.json();
//     console.log("GET Data Response:", data);
// }

// async function postData() {
//     const response = await fetch(url, options);
//     const data = await response.json();
//     console.log("POST Data Response:", data);
// }

// async function run() {
//     await postData();  // waits
//     await getData();   // runs after postData finishes
// }

// run();

// Do some Ghata Ghati with these
// let name = "Babbar";
// function outerfunction() {
//   let name = "Mozilla"; // let --> Block Scoped
//   function innerfunction() {
//     let name = "Antarikshya";
//     console.log(name); // use variable declared in the parent function
//   }
//   innerfunction();
// }
// outerfunction();

// function outerfunction() {
//     let name = "Antarikshya";
//     function innerfunction() {
//         console.log(name);
//     }
//     return innerfunction;
// }
// let inner = outerfunction();
// inner();


// let name = "Antarikshya";
// function innner() {
//     console.log(name); // --> Does not Work here
// }

// let out = innner();
// out();


// async function getData() {
//     // Get Request
//     let data = await fetch("https://jsonplaceholder.typicode.com/posts",options);
//     // Parse
//     let parse = await data.json();
//     console.log("POST DATA RESPONSE:",parse);
// }

// let promisenew = getData();
// promisenew.then(() => {
//     console.log("It's Working");
// }).catch(() => {
//     console.log("Error");
// }).finally(()=> {
//     console.log("Reached Finally Block");
// })



// const url = "https://icanhazdadjoke.com/";

// async function getJokes() {
//     try {
//         const config = {"headers" : {"Accept" : "application/json"}};
//         let res = await fetch(url,config);
//         let data = await res.json();
//         console.log("The ID of Joke is :" + data.id);
//         console.log("Joke - " + data.joke);
//     }
//     catch (err) {
//         console.log("The Error is -" + err);
//     }
// }

// getJokes();