difficulties update

cool B.1.1

Author: python-nerd-3

index.html

@@ -19,4 +19,31 @@ <h2>Enemy HP: <span id="enemy-hp">140</span></h2>
         <button id="button-3" onclick="belittle.useMove('player')" disabled="true">Belittle haha vocab word</button>
         <button id="button-4" onclick="tickle.useMove('player')" disabled="true">Tickle</button>
     </div>
+    <br>
+    <div id="difficulties">
+        <a href="index.html?hp=120&boost=1">
+            <button class="difficulty" id="d-easy">
+                Easy
+            </button>
+        </a>
+        <br>
+        <a href="index.html?hp=140&boost=1.1">
+            <button class="difficulty" id="d-normal">
+                Normal
+            </button>
+        </a>
+        <br>
+        <a href="index.html?hp=160&boost=1.2">
+            <button class="difficulty" id="d-hard">
+                Hard
+            </button>
+        </a>
+        <br>
+        <a href="index.html?hp=200&boost=2">
+            <img id="wawa" src="https://i1.sndcdn.com/avatars-1utUXjzJDp44NImm-Qy1TUg-t500x500.jpg"></img>
+        </a>
+        <span id="warning">warning: glitchy</span>
+    </div>
+    <p>You can make your own custom difficulty by changing the URL</p>
+    <p>Change boost value for enemy attack multiplier and hp value for enemy HP</p>
 </body>

index.js

@@ -4,6 +4,24 @@ let playerExtraDmg = 1;
 let enemyExtraDmg = 1.1;
 let moveNames = []
 
+let params = window.location.search;
+params = new URLSearchParams(params);
+let newHp = params.get("hp");
+let newDmg = params.get("boost");
+newHp = Number(newHp)
+newDmg = Number(newDmg)
+if (newHp) {
+    enemyHp = newHp;
+    $("#enemy-hp").html(newHp);
+} if (newDmg) {
+    enemyExtraDmg = newDmg;
+};
+
+$('#button-1').prop("disabled", true);
+$('#button-2').prop("disabled", true);
+$('#button-3').prop("disabled", true);
+$('#button-4').prop("disabled", true);
+
 function sleep(ms) {
     return new Promise(resolve => setTimeout(resolve, ms));
 }
@@ -13,7 +31,6 @@ function toggleButtons() {
     $('#button-2').prop('disabled', (i, v) => !v);
     $('#button-3').prop('disabled', (i, v) => !v);
     $('#button-4').prop('disabled', (i, v) => !v);
-
 }
 
 function roundAndUpdate() {
@@ -67,7 +84,7 @@ function handleWin() {
     if (playerHp >= enemyHp) {
         display("You win!", "Good job!")
     } else {
-        display("You lose.", "You had to have done that deliberately.")
+        display("You lost.", "sad")
     }
 }
 

styles.css

@@ -22,34 +22,44 @@ body {
     border-top-right-radius: 0px;
 }
 
-button {
+button:not(.difficulty) {
     border: 0;
     width: 47.5vw;
     height: 50px;
 }
 
-#button-1 {
-    background-color: rgb(255, 120, 100); 
-}
+#button-1 {background-color: rgb(255, 120, 100); }
 
 #button-2 {
     background-color: rgb(100, 120, 255);
     float: right;
 }
 
-#button-3 {
-    background-color: rgb(255, 255, 120); 
-}
+#button-3 {background-color: rgb(255, 255, 120); }
 
 #button-4 {
     background-color: rgb(100, 255, 120);
     float: right;
 }
 
+#wawa {
+    width: 10vw;
+    height: 10vw;
+}
+
 button:disabled {
-    background-color: rgb(120, 120, 120)
+    background-color: rgb(120, 120, 120) !important;
+    color: white;
+}
+
+.difficulty {
+    border: 0;
+    width: 10vw;
+    height: 10vw;
 }
 
-.dead {
-    color: rgb(255, 120, 100);
-}
+.dead {color: rgb(255, 120, 100);}
+#warning {color: darkred;}
+#d-easy {background-color: rgb(100, 255, 120)}
+#d-normal {background-color:rgb(255, 255, 120)}
+#d-hard {background-color:rgb(255, 120, 100)}