feat: add cursor upgrade, fix emoji upgrade

assets/css/upgrades.css

@@ -15,10 +15,9 @@
   text-decoration: underline;
 }
 
-#upg-emojis {
+.upg-emojis {
-  display: none;
   position: absolute;
-  font-size: 2em;
+  font-size: 2.5em;
   animation: 5s emojis linear infinite;
 }
 @keyframes emojis {
@@ -89,6 +88,7 @@
   top: 0;
   left: 0;
   overflow: hidden;
+  text-align: center;
 }
 .upg-credits-inner {
   display: flex;

index.html

@@ -53,7 +53,7 @@
     <span id="upg-saves-reset" onclick="onResetProgressClick()">Reset progress</span>
   </div>
 
-  <div id="upg-emojis">😆</div>
+  <div id="upg-emojis"></div>
 
   <div id="upg-mixer">
     <b>Mixer</b>

js/game.js

@@ -160,15 +160,26 @@ function onResetProgressClick() {
 
 // emojis
 
-function enableEmojis() {
+function getRandomEmoji() {
   const emojis = ['😎', '😆', '😛', '😏', '😔', '🥲', '😔', '😒', '😍', '😃', '🤓', '😊', '😁', '😄'];
+  return emojis[Math.floor(Math.random() * emojis.length)];
+}
+
+function addEmoji() {
   const upgEmojis = document.getElementById('upg-emojis');
   upgEmojis.style.display = 'block';
+  
+  const emoji = document.createElement('span');
+  emoji.innerText = getRandomEmoji();
+   emoji.className = 'upg-emojis';
+
+  setTimeout(() => {
+    upgEmojis.append(emoji);
+  }, Math.random() * 1000);
 
   setInterval(() => {
-    mood += 200;
+    mood += Math.floor(Math.random() * 1000);
-    const randomEmoji = emojis[Math.floor(Math.random() * emojis.length)];
+    emoji.innerText = getRandomEmoji();
-    upgEmojis.innerText = randomEmoji;
     updateMoodCounter();
   }, 5000);
 }
@@ -231,6 +242,15 @@ function showCredits() {
   credits.style.display = 'block';
 }
 
+// cursor
+
+function enableCursor() {
+  var allElements = document.querySelectorAll('body, .btn, .click-btn');
+  for (var i = 0; i < allElements.length; i++) {
+    allElements[i].style.cursor = 'url("./assets/img/cursors/cursor.png"), auto';
+  }
+}
+
 
 let upgrades = [
   {
@@ -252,10 +272,10 @@ let upgrades = [
   {
     id: 'emojis',
     name: 'Emoji Thruster',
-    description: 'Flying emoji +200mood/5s',
+    description: 'Flying emoji. Gives some amount of mood every 5 seconds.',
     image: '../assets/img/upgrades/emojis.png',
     cost: 500,
-    onPurchase: enableEmojis,
+    onPurchase: addEmoji,
   },
   {
     id: 'rain',
@@ -265,36 +285,44 @@ let upgrades = [
     cost: 1000,
     onPurchase: enableRain,
   },
+  {
+    id: 'emojis2',
+    name: 'More Emoji Thrusters',
+    description: 'Let the emojis flyyyyyyy-- and get some more mood',
+    image: '../assets/img/upgrades/emojis2.png',
+    cost: 1500,
+    onPurchase: addEmoji,
+  },
   {
     id: 'calm_music',
     name: 'Old Radio',
     description: 'Listen to the hand-made music',
     image: '../assets/img/upgrades/calm_music.png',
-    cost: 1500,
+    cost: 3000,
     onPurchase: enableMusic,
   },
+  {
+    id: 'cursor',
+    name: 'Cursor',
+    description: 'Click Clack. +400 mood/click',
+    image: '../assets/img/upgrades/cursor.png',
+    cost: 4000,
+    onPurchase: enableCursor,
+  },
   {
     id: 'mixer',
     name: 'Mixer',
     description: 'Control the sounds',
     image: '../assets/img/upgrades/mixer.png',
-    cost: 3000,
+    cost: 4500,
     onPurchase: enableMixer,
   },
-  {
-    id: 'emojis2',
-    name: 'More Emoji Thrusters',
-    description: 'Let the emojis flyyyyyyy +200mood/5s',
-    image: '../assets/img/upgrades/emojis2.png',
-    cost: 4000,
-    onPurchase: enableEmojis,
-  },
   {
     id: 'cuteface',
     name: 'Cuteface',
     description: 'A little bit... unusual background... no?..',
     image: '../assets/img/upgrades/cuteface.png',
-    cost: 15000,
+    cost: 8000,
     onPurchase: showCuteface,
   },
   {