am-igdtuw · triptijaiswall · Aug 15, 2023 · Aug 25, 2023 · Aug 25, 2023 · Aug 25, 2023
diff --git a/LAB-2TRIPTI.html b/LAB-2TRIPTI.html
@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <link rel="stylesheet" href="style.css">
+  <title>Counter App</title>
+</head>
+<body>
+  <div class="counter">
+    <h1>Count: <span id="count">0</span></h1>
+    <button id="updateButton">Update Count</button>
+  </div>
+  <script src="increment.js"></script>
+</body>
+</html>
diff --git a/TASK2(1).html b/TASK2(1).html
@@ -0,0 +1,48 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" href="styles.css">
+    <title>Instagram-like Feed</title>
+</head>
+<body>
+    <header>
+        <div class="logo">Instagram</div>
+        <div class="search-bar">
+            <input type="text" placeholder="Search">
+        </div>
+        <div class="user-profile">
+            <img src="profile-picture.jpg" alt="Your Profile">
+            <span>Your Username</span>
+        </div>
+    </header>
+    <main>
+        <div class="feed">
+            <!-- Sample post -->
+            <div class="post">
+                <div class="post-header">
+                    <img src="user1-profile.jpg" alt="User 1">
+                    <span>User 1</span>
+                </div>
+                <img src="post1.jpg" alt="Post 1">
+                <div class="post-actions">
+                    <button class="like-btn">Like</button>
+                    <button class="comment-btn">Comment</button>
+                    <button class="share-btn">Share</button>
+                </div>
+                <div class="post-caption">
+                    <span><strong>User 1</strong> Enjoying a beautiful day! 🌞 #nature</span>
+                </div>
+                <div class="post-comments">
+                    <span><strong>User 2:</strong> Looks amazing!</span>
+                    <span><strong>User 3:</strong> Wish I could be there!</span>
+                </div>
+            </div>
+
+            <!-- More posts can be added here -->
+
+        </div>
+    </main>
+</body>
+</html>
diff --git a/TASK2(2).css b/TASK2(2).css
@@ -0,0 +1,92 @@
+/* Reset some default styles for consistency */
+body, h1, h2, h3, p, ul, li {
+    margin: 0;
+    padding: 0;
+}
+
+body {
+    font-family: Arial, sans-serif;
+}
+
+/* Header styles */
+header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 16px;
+    border-bottom: 1px solid #ccc;
+    background-color: white;
+}
+
+.logo {
+    font-size: 24px;
+    font-weight: bold;
+}
+
+.search-bar input {
+    padding: 8px;
+    border: 1px solid #ccc;
+    border-radius: 4px;
+}
+
+.user-profile {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+}
+
+.user-profile img {
+    width: 32px;
+    height: 32px;
+    border-radius: 50%;
+    object-fit: cover;
+}
+
+/* Main content styles */
+main {
+    padding: 16px;
+}
+
+.feed {
+    display: grid;
+    gap: 16px;
+}
+
+.post {
+    border: 1px solid #ccc;
+    border-radius: 4px;
+    padding: 16px;
+    background-color: white;
+    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+}
+
+.post-header {
+    display: flex;
+    align-items: center;
+    margin-bottom: 8px;
+}
+
+.post-header img {
+    width: 32px;
+    height: 32px;
+    border-radius: 50%;
+    object-fit: cover;
+    margin-right: 8px;
+}
+
+.post-actions button {
+    background-color: transparent;
+    border: none;
+    padding: 8px;
+    cursor: pointer;
+    margin-right: 16px;
+}
+
+.post-caption {
+    margin-bottom: 8px;
+}
+
+.post-comments span {
+    display: block;
+    margin-bottom: 4px;
+}
diff --git a/increment_tripti.js b/increment_tripti.js
@@ -0,0 +1,9 @@
+const countElement = document.getElementById('count');
+const updateButton = document.getElementById('updateButton');
+
+let count = 0;
+
+updateButton.addEventListener('click', () => {
+  count++;
+  countElement.textContent = count;
+});
diff --git a/library.js b/library.js
@@ -0,0 +1,149 @@
+//ASSIGNMENT: 1 -[EXPLORING HIGHER-ORDER FUNCTIONS IN JAVASCRIPT]
+const library = [
+    { 
+      title: "The Great Gatsby", 
+      author: "F. Scott Fitzgerald", 
+      year: 1925,
+      pages: 180 
+    },
+    {
+      title: "To Kill a Mockingbird",
+      author: "Harper Lee", 
+      year: 1960, 
+      pages: 281
+    },
+    {
+      title: "1984", 
+      author: "George Orwell", 
+      year: 1949, 
+      pages: 328 
+    },
+    {
+      title: "Pride and Prejudice", 
+      author: "Jane Austen", 
+      year: 1813,
+      pages: 432 
+    }
+  ];
+
+  // (3)-Function to calculate the total number of pages in the library
+  function getTotalPages(library) {
+    const total = library.reduce((accumulator, book) => accumulator + book.pages, 0);
+    return total;
+  }
+  const totalNumberOfPages = getTotalPages(library);
+  console.log("Total Number of Pages:", totalNumberOfPages); 
+
+
+  //(4)- Function to get an array containing only the titles of the books in the library
+function getBookTitles(library) {
+    const titles = library.map(book => book.title);
+    return titles;
+  }
+  const bookTitles = getBookTitles(library);
+  console.log("List of Book Titles:", bookTitles);
+
+
+  //(5)-Function to get an array of book titles published after a given year
+function getBooksPublishedAfterYear(library, year) {
+    const booksAfterYear = library.filter(book => book.year > year).map(book => book.title);
+    return booksAfterYear;
+  }
+  const year = 1950;
+  const booksPublishedAfterYear = getBooksPublishedAfterYear(library, year);
+  console.log(`Books Published After ${year}:`, booksPublishedAfterYear);
+
+
+  //(6)- Function to calculate the average number of pages across all books in the library
+function getAveragePages(library) {
+    const total = library.reduce((accumulator, book) => accumulator + book.pages, 0);
+    const average = total / library.length;
+
+    return average;
+  }
+  const averageNumberOfPages = getAveragePages(library);
+  console.log("Average Number of Pages:", averageNumberOfPages);
+
+
+  //(7)-Function to get the title of the book with the most pages
+function getLongestBook(library) {
+    const longestBook = library.reduce((maxBook, book) => (book.pages > maxBook.pages ? book : maxBook));
+    return longestBook.title;
+  }
+  const longestBookTitle = getLongestBook(library);
+  console.log("Longest Book:", longestBookTitle);
+
+
+  //(8)-Function to get an object where authors are keys and their books are values
+function getAuthorsAndBooks(library) {
+    const authorsAndBooks = library.reduce((accumulator, book) => {
+      if (!accumulator[book.author]) {
+        accumulator[book.author] = [];
+      }
+      accumulator[book.author].push(book.title);
+      return accumulator;
+    }, {});
+
+    return authorsAndBooks;
+  }
+  const authorsAndBooksObj = getAuthorsAndBooks(library);
+  console.log("Authors and Their Books:", authorsAndBooksObj);
+
+
+  //(9)-Function to get an object where authors are keys and total pages of their books are values
+function getTotalPagesByAuthor(library) {
+    const totalPagesByAuthor = library.reduce((accumulator, book) => {
+      if (!accumulator[book.author]) {
+        accumulator[book.author] = 0;
+      }
+      accumulator[book.author] += book.pages;
+      return accumulator;
+    }, {});
+
+    return totalPagesByAuthor;
+  }
+  const totalPagesByAuthorObj = getTotalPagesByAuthor(library);
+  console.log("Total Number of Pages by Author:", totalPagesByAuthorObj);
+
+
+  //(10)-Function to get an object where authors are keys and titles of their shortest books are values
+function getShortestBookByAuthor(library) {
+    const shortestBooks = {};
+    library.forEach(book => {
+      const author = book.author;
+      const title = book.title;
+      const currentShortestTitle = shortestBooks[author];
+
+      if (!currentShortestTitle || book.pages < library.find(b => b.title === currentShortestTitle).pages) {
+        shortestBooks[author] = title;
+      }
+    });
+
+    return shortestBooks;
+  }
+  const shortestBookByAuthorObj = getShortestBookByAuthor(library);
+  console.log("Shortest Book By Author:", shortestBookByAuthorObj);
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/style_tripti.css b/style_tripti.css
@@ -0,0 +1,27 @@
+body {
+    font-family: Arial, sans-serif;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    min-height: 100vh;
+    margin: 0;
+    background-color: #f4f4f4;
+  }
+
+  .counter {
+    text-align: center;
+    padding: 20px;
+    background-color: white;
+    border-radius: 5px;
+    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
+  }
+
+  button {
+    padding: 10px 20px;
+    background-color: red;
+    color: white;
+    border: none;
+    border-radius: 5px;
+    cursor: pointer;
+  }
+