From 0e757acf3b837305ab1af3014da3c6ba8ef56474 Mon Sep 17 00:00:00 2001
From: Gal <mail@velouria.dev>
Date: Wed, 25 Sep 2024 18:12:06 +0200
Subject: [PATCH] Initial commit

---
 index.html | 110 +++++++++++++++++++++++++++++++++++++++++++++++++++++
 map.html   |  73 +++++++++++++++++++++++++++++++++++
 2 files changed, 183 insertions(+)
 create mode 100644 index.html
 create mode 100644 map.html
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..9c4f877
--- /dev/null
+++ b/index.html
@@ -0,0 +1,110 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>HAPPY BIRTHDAYAYAYAY DYLAN</title>
+    <style>
+        body {
+            font-family: Arial, sans-serif;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            min-height: 100vh;
+            margin: 0;
+            background-color: #f0f0f0;
+        }
+        .container {
+            text-align: center;
+            background-color: white;
+            padding: 2rem;
+            border-radius: 10px;
+            box-shadow: 0 0 10px rgba(0,0,0,0.1);
+            max-width: 500px;
+            width: 100%;
+        }
+        h1 {
+            color: #e91e63;
+        }
+        #clue {
+            font-size: 1.2rem;
+            margin-bottom: 1rem;
+        }
+        input[type="text"] {
+            width: 100%;
+            padding: 0.5rem;
+            font-size: 1rem;
+            margin-bottom: 1rem;
+        }
+        button {
+            padding: 0.5rem 1rem;
+            font-size: 1rem;
+            background-color: #e91e63;
+            color: white;
+            border: none;
+            border-radius: 5px;
+            cursor: pointer;
+        }
+        button:hover {
+            background-color: #c2185b;
+        }
+        #message {
+            margin-top: 1rem;
+            font-weight: bold;
+            color: #e91e63;
+        }
+    </style>
+</head>
+<body>
+    <div class="container">
+        <h1>Happy birthday Dylan!!!!!</h1>
+        <p id="clue"></p>
+        <input type="text" id="answer" placeholder="Your answer plz">
+        <button onclick="checkAnswer()">Submit</button>
+        <p id="message"></p>
+    </div>
+
+    <script>
+        const clues = [
+            "Spicy Seoul-mate (5)",
+            "Where a curious fox lives (9)",
+            "American rock band, known for covering Gloria Gaynor's I Will Survive (4)"
+        ];
+        const answers = ["kimchi", "bookstore", "cake"];
+        let currentClue = 0;
+
+        function displayClue() {
+            document.getElementById('clue').textContent = clues[currentClue];
+            document.getElementById('answer').value = '';
+            document.getElementById('message').textContent = '';
+        }
+
+        function checkAnswer() {
+            const userAnswer = document.getElementById('answer').value.toLowerCase().trim();
+            const messageElement = document.getElementById('message');
+            
+            if (userAnswer === answers[currentClue]) {
+                messageElement.textContent = "Correct! Well done!";
+                currentClue++;
+                
+                if (currentClue < clues.length) {
+                    setTimeout(() => {
+                        displayClue();
+                    }, 1500);
+                } else {
+                    setTimeout(() => {
+                        messageElement.textContent = "WOWOWOWO congrats :-) too easy huh??? Okay come get your presents you deserve it";
+                        setTimeout(() => {
+                            window.location.href = "map.html";
+                        }, 3000);
+                    }, 1500);
+                }
+            } else {
+                messageElement.textContent = "Oops! Try again maybe?";
+            }
+        }
+
+        displayClue();
+    </script>
+</body>
+</html>
\ No newline at end of file
diff --git a/map.html b/map.html
new file mode 100644
index 0000000..593e348
--- /dev/null
+++ b/map.html
@@ -0,0 +1,73 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Birthday map!!</title>
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.7.1/leaflet.css" />
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.7.1/leaflet.js"></script>
+    <style>
+        body {
+            font-family: Arial, sans-serif;
+            margin: 0;
+            padding: 0;
+            background-color: #f0f0f0;
+        }
+        .container {
+            max-width: 800px;
+            margin: 0 auto;
+            padding: 20px;
+        }
+        h1 {
+            text-align: center;
+            color: #e91e63;
+        }
+        #map {
+            height: 400px;
+            border-radius: 10px;
+            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+        }
+        .gift-info {
+            margin-top: 20px;
+            padding: 15px;
+            background-color: #fff;
+            border-radius: 10px;
+            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+        }
+        .gift-info h2 {
+            color: #e91e63;
+        }
+    </style>
+</head>
+<body>
+    <div class="container">
+        <h1>Happy Birthday, Dylan!!</h1>
+        <div id="map"></div>
+        <div class="gift-info">
+            <p>I've got surprises at these three locations on the map! Just text me where you'd like to go first :))</p>
+            <p>Enjoy ❤️❤️</p>
+
+            <iframe width="560" height="315" src="https://www.youtube.com/embed/d2Mq6wxwCQA?si=rv-Iw1srmfOV_d6K" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
+        </div>
+    </div>
+
+    <script>
+        var map = L.map('map').setView([52.52, 13.405], 12);
+
+        L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
+            attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
+        }).addTo(map);
+
+        var locations = [
+            {name: "Dussmann (I know Curious Fox would have been cuter but they close at 19:()", lat: 52.5183385, lon: 13.3840262},
+            {name: "Moim Restaurant", lat: 52.4972435, lon: 13.2886007},
+            {name: "Wullenweberstr. 9", lat: 52.5187725, lon: 13.3292697}
+        ];
+
+        locations.forEach(function(loc) {
+            L.marker([loc.lat, loc.lon]).addTo(map)
+                .bindPopup(loc.name);
+        });
+    </script>
+</body>
+</html>
\ No newline at end of file
