cubstart · Sannahk · Mar 11, 2025 · Mar 14, 2025 · Apr 30, 2025 · Apr 30, 2025
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -0,0 +1,5 @@
+{
+  "dependencies": {
+    "express": "^4.21.2"
+  }
+}
diff --git a/week3/sannah_kumar/index.html b/week3/sannah_kumar/index.html
@@ -0,0 +1,164 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <link rel="stylesheet" href="style.css" />
+    <script src="/week3/sannah_kumar/script.js"></script>
+    <title>Sannah Kumar loves COOOKKIEEEESSSS</title>
+    <script src="https://cdn.jsdelivr.net/npm/canvas-confetti@1.5.1/dist/confetti.browser.min.js"></script>
+    <style>
+        body {
+            background-color: pink;
+            text-align: center;
+        }
+
+        h1 {
+            color: black;
+            font-size: 50px;
+            font-family: 'Times New Roman', Times, serif;
+        }
+
+        p {
+            color: brown;
+            font-size: 40px;
+            font-family: 'Times New Roman', Times, serif;
+        }
+
+        h3 {
+            font-size: 20px;
+            text-align: center;
+            font-family: 'Times New Roman', Times, serif;
+        }
+
+        #counter {
+            font-size: 80px;
+            font-weight: bold;
+            color: darkred;
+        }
+
+        #message {
+            font-size: 30px;
+            font-weight: bold;
+            margin-top: 20px;
+            color: brown;
+        }
+
+        #timer {
+            font-size: 24px;
+            font-weight: bold;
+            color: red;
+        }
+
+        button {
+            font-size: 20px;
+            padding: 10px 15px;
+            background-color: #ffcc00;
+            border: none;
+            cursor: pointer;
+            border-radius: 10px;
+            margin: 10px;
+        }
+
+        button:hover {
+            background-color: #ff9900;
+        }
+
+        img {
+            width: 300px;
+            cursor: pointer;
+            margin-top: 20px;
+            transition: transform 0.1s;
+        }
+
+        img:active {
+            transform: scale(0.9);
+        }
+
+        .disabled {
+            opacity: 0.5;
+            pointer-events: none;
+        }
+    </style>
+</head>
+
+<body>
+
+    <h1>Sannah Kumar Eating Cookies Challenge 🍪</h1>
+    <p>Time Left: <span id="timer">30</span> seconds</p>
+    <button id="startButton" onclick="startGame()">Start Timer</button>
+
+    <h1><span id="counter">0</span> cookies</h1>
+    <p id="message">Press start to begin!</p>
+
+    <h3>Every time you CLICK on the cookie below, the counter increases by ONE. 
+        You have thirty seconds to eat as many as you can! 
+        (If you get above 200, contact 646-596-2889 for a free cookie 😉)
+    </h3>
+
+    <img id="cookieImage" src="https://img.freepik.com/free-photo/chocolate-chip-cookies-isolated-white-background-ai-generative_123827-24070.jpg" 
+        onclick="addOneToCounter()" class="disabled" />
+
+    <script>
+        let timer;
+        let timeLeft = 30;
+        let gameActive = false;
+
+        function startGame() {
+            if (gameActive) return;
+
+            gameActive = true;
+            document.getElementById("cookieImage").classList.remove("disabled");
+            document.getElementById("startButton").disabled = true;
+
+            timer = setInterval(() => {
+                timeLeft--;
+                document.getElementById("timer").innerText = timeLeft;
+
+                if (timeLeft <= 0) {
+                    clearInterval(timer);
+                    endGame();
+                }
+            }, 1000);
+        }
+
+        function addOneToCounter() {
+            if (!gameActive) return;
+
+            let counterElement = document.getElementById("counter");
+            let messageElement = document.getElementById("message");
+
+            let newValue = parseInt(counterElement.innerText) + 1;
+            counterElement.innerText = newValue;
+
+            let messages = {
+                10: "5 cookies! EASY WORK 🎉",
+                50: "Amazing! DAMNN she ate 50 cookies! 🍪",
+                100: "GGOOODDDMANNN She is a cookie master! 100 cookies! 🏆"
+            };
+
+            if (messages[newValue]) {
+                messageElement.innerText = messages[newValue]; 
+                confettiEffect();
+
+                setTimeout(() => {
+                    messageElement.innerText = "eat eat eat eat eat ";
+                }, 3000);
+            }
+        }
+
+        function endGame() {
+            gameActive = false;
+            document.getElementById("cookieImage").classList.add("disabled");
+            document.getElementById("message").innerText = "Time's up! 🍪";
+        }
+
+        function confettiEffect() {
+            confetti({
+                particleCount: 100,
+                spread: 70,
+                origin: { y: 0.6 }
+            });
+        }
+    </script>
+
+</body>
+</html>
diff --git a/week3/sannah_kumar/script.js b/week3/sannah_kumar/script.js
@@ -0,0 +1,22 @@
+function addOneToCounter(){
+    document.getElementById("counter").innerText = parseInt(document.getElementById("counter").innerText) + 1
+    let newValue = parseInt(document.getElementById("counter").innerText);
+    let messageElement = document.getElementById("message");
+
+    let messages = {
+        10: "5 cookies! EASY WORK 🎉",
+        50: "Amazing! DAMNN she ate 50 cookies! 🍪",
+        100: "GGOOODDDMANNN She is a cookie master! 100 cookies! 🏆"
+    };
+
+    if (messages[newValue]) {
+        messageElement.innerText = messages[newValue]; 
+        confetti();
+
+
+        setTimeout(() => {
+            messageElement.innerText = "eat eat eat eat eat ";
+        }, 3000);
+    }
+}
+
diff --git a/week3/sannah_kumar/style.css b/week3/sannah_kumar/style.css
@@ -0,0 +1,13 @@
+style.css
+body {
+    background-color: lightblue;
+  }
+
+  h1 {
+    color: white;
+    text-align: center;
+  }
+
+  p {
+    font-family: verdana;
+  }
diff --git a/week5/index.html b/week5/index.html
@@ -0,0 +1,99 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <title>Socket.IO chat</title>
+    <style>
+      body {
+        margin: 0;
+        padding-bottom: 3rem;
+        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
+      }
+
+      #form {
+        background: rgba(0, 0, 0, 0.15);
+        padding: 0.25rem;
+        position: fixed;
+        bottom: 0;
+        left: 0;
+        right: 0;
+        display: flex;
+        height: 3rem;
+        box-sizing: border-box;
+        backdrop-filter: blur(10px);
+      }
+
+      #input {
+        border: none;
+        padding: 0 1rem;
+        flex-grow: 1;
+        border-radius: 2rem;
+        margin: 0.25rem;
+      }
+
+      #input:focus {
+        outline: none;
+      }
+
+      #form > button {
+        background: #333;
+        border: none;
+        padding: 0 1rem;
+        margin: 0.25rem;
+        border-radius: 3px;
+        outline: none;
+        color: #fff;
+      }
+
+      #messages {
+        list-style-type: none;
+        margin: 0;
+        padding: 0;
+      }
+
+      #messages > li {
+        padding: 0.5rem 1rem;
+      }
+
+      #messages > li:nth-child(odd) {
+        background: #efefef;
+      }
+    </style>
+  </head>
+  <body>
+    <ul id="messages"></ul>
+    <form id="form" action="">
+      <input id="input" autocomplete="off" /><button>Send</button>
+    </form>
+
+    <script src="/socket.io/socket.io.js"></script>
+    <script>
+      const socket = io();
+      const messages = document.getElementById('messages');
+      const form = document.getElementById('form');
+      const input = document.getElementById('input');
+
+      let nickname = prompt("Enter your nickname:");
+      if (nickname) {
+        socket.emit('set nickname', nickname);
+      } else {
+        nickname = 'Anonymous';
+        socket.emit('set nickname', nickname);
+      }
+
+      form.addEventListener('submit', function (e) {
+        e.preventDefault();
+        if (input.value) {
+          socket.emit('chat message', input.value);
+          input.value = '';
+        }
+      });
+
+      socket.on('chat message', function (data) {
+        const item = document.createElement('li');
+        item.textContent = `${data.nickname}: ${data.message}`;
+        messages.appendChild(item);
+        window.scrollTo(0, document.body.scrollHeight);
+      });
+    </script>
+  </body>
+</html>
diff --git a/week5/index.js b/week5/index.js
@@ -0,0 +1,44 @@
+const express = require('express');
+const app = express();
+const http = require('http');
+const server = http.createServer(app);
+const { Server } = require('socket.io');
+const io = new Server(server);
+const mongoose = require('mongoose');
+const messageModel = require('./models/message');
+
+mongoose.connect('mongodb://localhost:27017/chatapp')  // or Atlas string
+  .then(() => console.log('MongoDB connected'))
+  .catch((err) => console.error('MongoDB connection error:', err));
+
+
+// Serve index.html
+app.get('/', (req, res) => {
+  res.sendFile(__dirname + '/index.html');
+});
+
+// Socket.io setup
+io.on('connection', (socket) => {
+  console.log('a user connected');
+
+  socket.on('chat message', (msg) => {
+    console.log('message: ' + msg);
+    io.emit('chat message', msg); 
+  });
+
+  socket.on('disconnect', () => {
+    console.log('user disconnected');
+  });
+});
+
+// Start the server
+server.listen(3000, () => {
+  console.log('listening on *:3000');
+});
+
+
+
+app.get('/messages', async (req, res) => {
+  const messages = await messageModel.find();
+  res.json(messages);
+});
diff --git a/week5/models/message.js b/week5/models/message.js
@@ -0,0 +1,9 @@
+const mongoose = require('mongoose');
+
+const messageSchema = new mongoose.Schema({
+  nickname: String,
+  msg: String,
+  timestamp: { type: Date, default: Date.now }
+});
+
+module.exports = mongoose.model('Message', messageSchema);