From 0eaccae8addeaa15b1907d9310fa3bc62bb33708 Mon Sep 17 00:00:00 2001
From: Sofja <sofja.portnova@tptlive.ee>
Date: Mon, 24 Mar 2025 23:01:44 +0200
Subject: [PATCH 1/3] Adding new features

---
 src/pages/CookieClicker.vue | 182 +++++++++++++++++++++++++++++++-----
 1 file changed, 160 insertions(+), 22 deletions(-)

diff --git a/src/pages/CookieClicker.vue b/src/pages/CookieClicker.vue
index 0727f08..2c5899a 100644
--- a/src/pages/CookieClicker.vue
+++ b/src/pages/CookieClicker.vue
@@ -2,48 +2,186 @@
 import { computed, ref } from 'vue';
 
 const cookies = ref(0);
+
 const buildings = ref([
-    { name: 'Cursor', price: 15, cps: 0.1, count: 0},
-    { name: 'Grandma', price: 100, cps: 1, count: 0},
-    { name: 'Farm', price: 1000, cps: 10, count: 0},
-    { name: 'Factory', price: 10_000, cps: 100, count: 0},
+    { name: 'Cursor', price: 15, cps: 0.1, count: 0 },
+    { name: 'Grandma', price: 100, cps: 1, count: 0 },
+    { name: 'Farm', price: 1000, cps: 10, count: 0 },
+    { name: 'Factory', price: 10_000, cps: 100, count: 0 },
 ]);
 
-function buyBuilding(building){
-    cookies.value -= building.price;
-    building.price += Math.ceil(building.price / 100 * 15);
-    building.count++;
+
+const upgrades = ref([
+    { name: 'Better Ovens', effect: () => multiplyCps(2), price: 500, bought: false },
+    { name: 'Fertilized Fields', effect: () => multiplyCps(2), price: 5000, bought: false },
+]);
+
+// Achievements list
+const achievements = ref([]);
+const achieved = ref([]);
+
+// Shiny cookie state
+const shinyCookie = ref({ visible: false, x: 0, y: 0 });
+
+// Function to buy a building
+function buyBuilding(building) {
+    if (cookies.value >= building.price) {
+        cookies.value -= building.price;
+        building.price = Math.ceil(building.price * 1.15);
+        building.count++;
+        checkAchievements();
+    }
+}
+
+// Function to buy an upgrade
+function buyUpgrade(upgrade) {
+    if (cookies.value >= upgrade.price && !upgrade.bought) {
+        cookies.value -= upgrade.price;
+        upgrade.effect();
+        upgrade.bought = true;
+    }
 }
+
+// Function to multiply CPS (used for upgrades)
+function multiplyCps(factor) {
+    buildings.value.forEach(building => {
+        building.cps *= factor;
+    });
+}
+
+// Computed total CPS
 let cps = computed(() => {
-    let cps = 0;
+    let totalCps = 0;
     buildings.value.forEach(building => {
-       cps+=building.cps*building.count;
+        totalCps += building.cps * building.count;
     });
-    return cps;
+    return totalCps;
 });
-setInterval(()=>{
-   cookies.value+=cps.value;
 
-   document.title ='🍪' + +cookies.value.toFixed(1) + ' Cookies!';
-},1000);
+// Auto-generate cookies based on CPS every second
+setInterval(() => {
+    cookies.value += cps.value;
+    document.title = '🍪 ' + cookies.value.toFixed(1) + ' Cookies!';
+}, 1000);
 
+// Function to check achievements
+function checkAchievements() {
+    const newAchievements = [
+        { name: "100 Cookies!", condition: () => cookies.value >= 100 },
+        { name: "10,000 Cookies!", condition: () => cookies.value >= 10_000 },
+        { name: "1 Million Cookies!", condition: () => cookies.value >= 1_000_000 },
+        { name: "First Cursor!", condition: () => buildings.value[0].count >= 1 },
+        { name: "10 Grandmas!", condition: () => buildings.value[1].count >= 10 },
+        { name: "25 Farms!", condition: () => buildings.value[2].count >= 25 },
+        { name: "50 Factories!", condition: () => buildings.value[3].count >= 50 }
+    ];
+
+    newAchievements.forEach(achievement => {
+        if (achievement.condition() && !achieved.value.includes(achievement.name)) {
+            achieved.value.push(achievement.name);
+        }
+    });
+}
+
+// Function to spawn a shiny cookie randomly
+function spawnShinyCookie() {
+    shinyCookie.value.x = Math.random() * 80 + 10; // Random X position (10% to 90% of screen)
+    shinyCookie.value.y = Math.random() * 80 + 10; // Random Y position (10% to 90% of screen)
+    shinyCookie.value.visible = true;
+
+    setTimeout(() => {
+        shinyCookie.value.visible = false; // Hide after 5 seconds if not clicked
+        spawnNextShiny(); // Schedule next shiny spawn
+    }, 5000);
+}
+
+// Function to collect shiny cookie
+function collectShinyCookie() {
+    cookies.value += cps.value * 10; // Reward 10x CPS in cookies
+    shinyCookie.value.visible = false;
+    spawnNextShiny(); // Schedule next shiny spawn
+}
+
+// Function to schedule the next shiny cookie spawn
+function spawnNextShiny() {
+    const delay = Math.random() * 20000 + 10000; // Random delay between 10-30 seconds
+    setTimeout(spawnShinyCookie, delay);
+}
+
+// Start first shiny cookie spawn
+spawnNextShiny();
 </script>
+
 <template>
     <div class="columns">
+        <!-- Main cookie counter -->
         <div class="column is-4 has-background-primary has-text-centered">
-            <h1 class="is-size-1">{{ +cookies.toFixed(1) }} cookies</h1>
-            <h3 class="is-size-3">{{ +cps.toFixed(1) }} cps</h3>
+            <h1 class="is-size-1">{{ cookies.toFixed(1) }} cookies</h1>
+            <h3 class="is-size-3">{{ cps.toFixed(1) }} cps</h3>
             <figure class="image is-square" @click="cookies++">
                 <img src="https://sweetlorens.com/cdn/shop/products/Copy-of-Chocolate-Chunk-Full-Cookie-transparent-background.png?v=1687811511" />
             </figure>
         </div>
-        <div class="column is-6 has-background-link">
-            asdas
+
+        <!-- Upgrades and Achievements section -->
+        <div class="column is-4 has-background-info">
+            <h2 class="is-size-2">Upgrades</h2>
+            <button v-for="upgrade in upgrades" 
+                    :disabled="cookies < upgrade.price || upgrade.bought" 
+                    @click="buyUpgrade(upgrade)" 
+                    class="button is-success is-fullwidth">
+                {{ upgrade.name }} 🍪{{ upgrade.price }} 
+                <span v-if="upgrade.bought">✅</span>
+            </button>
+
+            <h2 class="is-size-2">Achievements</h2>
+            <ul>
+                <li v-for="achievement in achieved" class="has-text-white">
+                    🎉 {{ achievement }}
+                </li>
+            </ul>
         </div>
-        <div class="column is-2 has-background-warning">
-            <button v-for="building in buildings" :disabled="cookies<building.price" @click="buyBuilding(building)" class="button is-primary is-large is-fullwidth">
+
+        <!-- Buildings section -->
+        <div class="column is-4 has-background-warning">
+            <h2 class="is-size-2">Buildings</h2>
+            <button v-for="building in buildings" 
+                    :disabled="cookies < building.price" 
+                    @click="buyBuilding(building)" 
+                    class="button is-primary is-fullwidth">
                 {{ building.name }} 🍪{{ building.price }} #{{ building.count }}
             </button>
         </div>
     </div>
-</template>
\ No newline at end of file
+
+    <!-- Shiny Cookie -->
+    <div v-if="shinyCookie.visible"
+         class="shiny-cookie"
+         :style="{ top: shinyCookie.y + 'vh', left: shinyCookie.x + 'vw' }"
+         @click="collectShinyCookie">
+        ✨🍪✨
+    </div>
+</template>
+
+<style>
+.columns {
+    margin: 20px;
+}
+
+/* Shiny cookie styles */
+.shiny-cookie {
+    position: fixed;
+    font-size: 40px;
+    cursor: pointer;
+    animation: glow 1s infinite alternate;
+}
+
+@keyframes glow {
+    from {
+        text-shadow: 0 0 10px gold;
+    }
+    to {
+        text-shadow: 0 0 20px orange, 0 0 30px yellow;
+    }
+}
+</style>

From 9c54e40c03daf801802d2f2bcea418f1666f9056 Mon Sep 17 00:00:00 2001
From: Sofja <sofja.portnova@tptlive.ee>
Date: Tue, 25 Mar 2025 12:53:34 +0200
Subject: [PATCH 2/3] improving issues

---
 src/pages/CookieClicker.vue | 58 ++++++++++++++++++-------------------
 1 file changed, 29 insertions(+), 29 deletions(-)

diff --git a/src/pages/CookieClicker.vue b/src/pages/CookieClicker.vue
index 2c5899a..2df8042 100644
--- a/src/pages/CookieClicker.vue
+++ b/src/pages/CookieClicker.vue
@@ -10,7 +10,6 @@ const buildings = ref([
     { name: 'Factory', price: 10_000, cps: 100, count: 0 },
 ]);
 
-
 const upgrades = ref([
     { name: 'Better Ovens', effect: () => multiplyCps(2), price: 500, bought: false },
     { name: 'Fertilized Fields', effect: () => multiplyCps(2), price: 5000, bought: false },
@@ -29,7 +28,7 @@ function buyBuilding(building) {
         cookies.value -= building.price;
         building.price = Math.ceil(building.price * 1.15);
         building.count++;
-        checkAchievements();
+        checkAchievements();  // Check achievements after purchasing
     }
 }
 
@@ -58,12 +57,6 @@ let cps = computed(() => {
     return totalCps;
 });
 
-// Auto-generate cookies based on CPS every second
-setInterval(() => {
-    cookies.value += cps.value;
-    document.title = '🍪 ' + cookies.value.toFixed(1) + ' Cookies!';
-}, 1000);
-
 // Function to check achievements
 function checkAchievements() {
     const newAchievements = [
@@ -83,6 +76,13 @@ function checkAchievements() {
     });
 }
 
+// Auto-generate cookies based on CPS every second
+setInterval(() => {
+    cookies.value += cps.value;
+    document.title = '🍪 ' + cookies.value.toFixed(1) + ' Cookies!';
+    checkAchievements();  // Check achievements regularly as cookies accumulate
+}, 1000);
+
 // Function to spawn a shiny cookie randomly
 function spawnShinyCookie() {
     shinyCookie.value.x = Math.random() * 80 + 10; // Random X position (10% to 90% of screen)
@@ -90,16 +90,16 @@ function spawnShinyCookie() {
     shinyCookie.value.visible = true;
 
     setTimeout(() => {
-        shinyCookie.value.visible = false; // Hide after 5 seconds if not clicked
-        spawnNextShiny(); // Schedule next shiny spawn
+        shinyCookie.value.visible = false;
+        spawnNextShiny();
     }, 5000);
 }
 
 // Function to collect shiny cookie
 function collectShinyCookie() {
-    cookies.value += cps.value * 10; // Reward 10x CPS in cookies
+    cookies.value += cps.value * 10;
     shinyCookie.value.visible = false;
-    spawnNextShiny(); // Schedule next shiny spawn
+    spawnNextShiny();
 }
 
 // Function to schedule the next shiny cookie spawn
@@ -123,7 +123,7 @@ spawnNextShiny();
             </figure>
         </div>
 
-        <!-- Upgrades and Achievements section -->
+        <!-- Upgrades and Buildings section -->
         <div class="column is-4 has-background-info">
             <h2 class="is-size-2">Upgrades</h2>
             <button v-for="upgrade in upgrades" 
@@ -134,16 +134,6 @@ spawnNextShiny();
                 <span v-if="upgrade.bought">✅</span>
             </button>
 
-            <h2 class="is-size-2">Achievements</h2>
-            <ul>
-                <li v-for="achievement in achieved" class="has-text-white">
-                    🎉 {{ achievement }}
-                </li>
-            </ul>
-        </div>
-
-        <!-- Buildings section -->
-        <div class="column is-4 has-background-warning">
             <h2 class="is-size-2">Buildings</h2>
             <button v-for="building in buildings" 
                     :disabled="cookies < building.price" 
@@ -152,6 +142,16 @@ spawnNextShiny();
                 {{ building.name }} 🍪{{ building.price }} #{{ building.count }}
             </button>
         </div>
+
+        <!-- Achievements section moved to the bottom -->
+        <div class="column is-4 has-background-warning">
+            <h2 class="is-size-2">Achievements</h2>
+            <ul>
+                <li v-for="achievement in achieved" class="has-text-white">
+                    🎉 {{ achievement }}
+                </li>
+            </ul>
+        </div>
     </div>
 
     <!-- Shiny Cookie -->
@@ -163,25 +163,25 @@ spawnNextShiny();
     </div>
 </template>
 
-<style>
+<style scoped>
 .columns {
-    margin: 20px;
+    margin: 1.5rem;
 }
 
 /* Shiny cookie styles */
 .shiny-cookie {
     position: fixed;
-    font-size: 40px;
+    font-size: 2.5rem;
     cursor: pointer;
     animation: glow 1s infinite alternate;
 }
 
 @keyframes glow {
     from {
-        text-shadow: 0 0 10px gold;
+        text-shadow: 0 0 0.625rem gold;
     }
     to {
-        text-shadow: 0 0 20px orange, 0 0 30px yellow;
+        text-shadow: 0 0 1.25rem orange, 0 0 1.875rem yellow;
     }
 }
-</style>
+</style>
\ No newline at end of file

From 380779c134a475d4cbb9587e1a3cdd0ec42643ab Mon Sep 17 00:00:00 2001
From: Sofja <sofja.portnova@tptlive.ee>
Date: Tue, 25 Mar 2025 13:02:14 +0200
Subject: [PATCH 3/3] improving golden cookie

---
 src/pages/CookieClicker.vue | 21 +++++++++++++--------
 1 file changed, 13 insertions(+), 8 deletions(-)

diff --git a/src/pages/CookieClicker.vue b/src/pages/CookieClicker.vue
index 2df8042..23d64d7 100644
--- a/src/pages/CookieClicker.vue
+++ b/src/pages/CookieClicker.vue
@@ -85,31 +85,36 @@ setInterval(() => {
 
 // Function to spawn a shiny cookie randomly
 function spawnShinyCookie() {
-    shinyCookie.value.x = Math.random() * 80 + 10; // Random X position (10% to 90% of screen)
-    shinyCookie.value.y = Math.random() * 80 + 10; // Random Y position (10% to 90% of screen)
+    // Random X and Y position (20% to 80% of screen for better positioning)
+    shinyCookie.value.x = Math.random() * 60 + 20; // X between 20% and 80% of the screen width
+    shinyCookie.value.y = Math.random() * 60 + 20; // Y between 20% and 80% of the screen height
     shinyCookie.value.visible = true;
+    
+    console.log("Shiny Cookie Spawned at:", shinyCookie.value.x, shinyCookie.value.y); // Debugging output
 
     setTimeout(() => {
-        shinyCookie.value.visible = false;
-        spawnNextShiny();
-    }, 5000);
+        shinyCookie.value.visible = false; // Hide after 5 seconds if not clicked
+        spawnNextShiny(); // Schedule next shiny spawn
+    }, 5000); // Adjust the time as needed
 }
 
 // Function to collect shiny cookie
 function collectShinyCookie() {
-    cookies.value += cps.value * 10;
+    console.log("Shiny Cookie Collected!");
+    cookies.value += cps.value * 20;
     shinyCookie.value.visible = false;
     spawnNextShiny();
 }
 
 // Function to schedule the next shiny cookie spawn
 function spawnNextShiny() {
-    const delay = Math.random() * 20000 + 10000; // Random delay between 10-30 seconds
+    const delay = Math.random() * 20000 + 10000;
+    console.log("Next Shiny Cookie Spawn in:", delay / 1000, "seconds");
     setTimeout(spawnShinyCookie, delay);
 }
 
-// Start first shiny cookie spawn
 spawnNextShiny();
+
 </script>
 
 <template>