From 6ebed5886363296bffc64275eef847ae44bcded2 Mon Sep 17 00:00:00 2001 From: HearMeWhisper Date: Wed, 24 Nov 2021 21:02:48 -0500 Subject: [PATCH] MTG added sweet alert --- MTG/index.html | 8 ++++---- MTG/script.js | 29 ++++++++++++++++++++++++++++- MTG/style.css | 23 ++++++++++++++++++----- 3 files changed, 50 insertions(+), 10 deletions(-) diff --git a/MTG/index.html b/MTG/index.html index 34fda7e..d4fb875 100644 --- a/MTG/index.html +++ b/MTG/index.html @@ -30,7 +30,7 @@
Player 2
-
+
20
@@ -91,8 +91,8 @@
-
life
-
name
+
+
+
@@ -100,7 +100,7 @@ - + \ No newline at end of file diff --git a/MTG/script.js b/MTG/script.js index c515d4c..e700b1f 100644 --- a/MTG/script.js +++ b/MTG/script.js @@ -30,13 +30,20 @@ playerCount = localStorage.getItem('playerCount'); let playerCount1 = Number(playerCount)+1; for (i=playerCount1; i<9; i++){document.getElementById("player"+i).style.display = "none" } -let lifeIncrease1 = () => { + let lifeIncrease1 = () => { let counter = Number(this.document.getElementById("lifeCount1").innerHTML); counter++; if (counter > 0) document.getElementById("lifeCount1").style.color = "black"; document.getElementById("lifeCount1").innerHTML = counter; }; + // let fiveIncreaseLife1 = () => { + // let counter = Number(this.document.getElementById("lifeCount1").innerHTML); + // counter +=5; + // if (counter > 0) document.getElementById("lifeCount1").style.color = "black"; + // document.getElementById("lifeCount1").innerHTML = counter; + // } + let lifeDecrease1 = () => { let counter = Number(document.getElementById("lifeCount1").innerHTML); counter--; @@ -142,6 +149,26 @@ let lifeIncrease1 = () => { document.getElementById("lifeCount8").innerHTML = counter; }; + + let reset = () => { + Swal.fire({ + title: 'What would you like to reset?', + showDenyButton: true, + showCancelButton: true, + confirmButtonText: 'Life', + denyButtonText: `Names`, + }).then((result) => { + /* Read more about isConfirmed, isDenied below */ + if (result.isConfirmed) { + Swal.fire('Life reset', '', 'success'); + resetLife(); + } else if (result.isDenied) { + Swal.fire('All player names reset', '', 'success'); + resetName(); + } + }) + + } let resetLife = () => { for (i=1; i<9; i++){ document.getElementById("lifeCount"+i).innerHTML = 20 diff --git a/MTG/style.css b/MTG/style.css index 3393422..89dfca9 100644 --- a/MTG/style.css +++ b/MTG/style.css @@ -3,6 +3,10 @@ -moz-box-sizing: border-box; box-sizing: border-box; } + html{ + height:100%; + width: 100% + } body{ background-color: darkslategray; height: 100vh; @@ -15,7 +19,7 @@ font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif; flex-wrap: wrap; align-items: center; - height: 100% + } .name{ font-size: xx-large; @@ -37,6 +41,7 @@ background-color: #EEE; width: auto; justify-content: center; + align-content: center; } .life{ opacity: 0.9; @@ -56,13 +61,17 @@ display: flex; justify-content: center; align-items: center; - height:200px; + height:250px; + width: 250px; font-size: 4.5rem; user-select: none; } .player{ padding: 20px; + display: flex; + flex-direction: column; + } .buttons{ @@ -85,14 +94,18 @@ flex-direction: row; justify-content:space-evenly; width: 100%; - position: relative; - bottom: 0px; + position: fixed; + bottom: 0; } .buttonText{ - font-size: .6rem; + font-size: .6rem; } #lifeCount{ padding: 10px; + } + + .fiveLifeUp{ +color:greenyellow } \ No newline at end of file