chris/main_web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

MTG localstorage everything

Browse Source
This commit is contained in:
HearMeWhisper 2021-11-08 13:58:03 -05:00
parent 74d6a4fa69
commit b35b190a04
3 changed files with 31 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
MTG/index.html
View File

@ -17,7 +17,7 @@
<body> <body>
<main> <main>
<div id="player1" class="player"> <div id="player1" class="player">
<div id="name" contenteditable="true"> <div class="name" id="name1" contenteditable="true">
Player 1</div> Player 1</div>
<div class="life"> <div class="life">
<div onclick="lifeIncrease1()" id="lifeUp">▲</div> <div onclick="lifeIncrease1()" id="lifeUp">▲</div>
@ -27,7 +27,7 @@
</div> </div>
<div id="player2" class="player"> <div id="player2" class="player">
<div id="name" contenteditable="true"> <div class="name" id="name2" contenteditable="true">
Player 2</div> Player 2</div>
<div class="life"> <div class="life">
<div onclick="lifeIncrease2()" id="lifeUp">▲</div> <div onclick="lifeIncrease2()" id="lifeUp">▲</div>
@ -36,7 +36,7 @@
</div> </div>
</div> </div>
<div id="player3" class="player"> <div id="player3" class="player">
<div id="name" contenteditable="true"> <div class="name" id="name3" contenteditable="true">
Player 3</div> Player 3</div>
<div class="life"> <div class="life">
<div onclick="lifeIncrease3()" id="lifeUp">▲</div> <div onclick="lifeIncrease3()" id="lifeUp">▲</div>
@ -45,7 +45,7 @@
</div> </div>
</div> </div>
<div id="player4" class="player"> <div id="player4" class="player">
<div id="name" contenteditable="true"> <div class="name" id="name4" contenteditable="true">
Player 4</div> Player 4</div>
<div class="life"> <div class="life">
<div onclick="lifeIncrease4()" id="lifeUp">▲</div> <div onclick="lifeIncrease4()" id="lifeUp">▲</div>
@ -54,7 +54,7 @@
</div> </div>
</div> </div>
<div id="player5" class="player"> <div id="player5" class="player">
<div id="name" contenteditable="true"> <div class="name" id="name5" contenteditable="true">
Player 5</div> Player 5</div>
<div class="life"> <div class="life">
<div onclick="lifeIncrease5()" id="lifeUp">▲</div> <div onclick="lifeIncrease5()" id="lifeUp">▲</div>
@ -63,7 +63,7 @@
</div> </div>
</div> </div>
<div id="player6" class="player"> <div id="player6" class="player">
<div id="name" contenteditable="true"> <div class="name" id="name6" contenteditable="true">
Player 6</div> Player 6</div>
<div class="life"> <div class="life">
<div onclick="lifeIncrease6()" id="lifeUp">▲</div> <div onclick="lifeIncrease6()" id="lifeUp">▲</div>
@ -72,7 +72,7 @@
</div> </div>
</div> </div>
<div id="player7" class="player"> <div id="player7" class="player">
<div id="name" contenteditable="true"> <div class="name" id="name7" contenteditable="true">
Player 7</div> Player 7</div>
<div class="life"> <div class="life">
<div onclick="lifeIncrease7()" id="lifeUp">▲</div> <div onclick="lifeIncrease7()" id="lifeUp">▲</div>
@ -81,7 +81,7 @@
</div> </div>
</div> </div>
<div id="player8" class="player"> <div id="player8" class="player">
<div id="name" contenteditable="true"> <div class="name" id="name8" contenteditable="true">
Player 8</div> Player 8</div>
<div class="life"> <div class="life">
<div onclick="lifeIncrease8()" id="lifeUp">▲</div> <div onclick="lifeIncrease8()" id="lifeUp">▲</div>

16
MTG/script.js
View File

@ -1,8 +1,20 @@
window.onunload = function(){ window.onunload = function(){
localStorage.setItem('playerCount', playerCount) localStorage.setItem('playerCount', playerCount);
for (i=1; i<9; i++){
localStorage.setItem('playerName'+i, document.getElementById('name'+i).innerHTML);
localStorage.setItem('lifeCount'+i, document.getElementById('lifeCount'+i).innerHTML)
}
}; };
window.onload = function(){ window.onload = function(){
localStorage.getItem('playerCount') localStorage.getItem('playerCount');
for (i=1; i<9; i++){
document.getElementById('name'+i).innerHTML = localStorage.getItem('playerName'+i);
document.getElementById('lifeCount'+i).innerHTML = 20
if (document.getElementById('lifeCount'+i).innerHTML != ""){
document.getElementById('lifeCount'+i).innerHTML = localStorage.getItem('lifeCount'+i)
}
}
}; };

18
MTG/style.css
View File

@ -5,16 +5,15 @@
} }
body{ body{
background-color: darkslategray; background-color: darkslategray;
width:100vw; height: 100%;
height: 100vhs;
} }
main{ main{
display: flex; display: flex;
justify-content: space-evenly; justify-content: space-evenly;
font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif; font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
flex-wrap: wrap; flex-wrap: wrap;
} }
#name{ .name{
font-size: xx-large; font-size: xx-large;
display: flex; display: flex;
margin: 0 0 20px; margin: 0 0 20px;
@ -57,7 +56,7 @@
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
min-height: 50%; height: 200px;
font-size: 5rem; font-size: 5rem;
user-select: none; user-select: none;
} }
@ -130,10 +129,11 @@
#buttonWrapper{ #buttonWrapper{
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: space-around; justify-content: space-evenly;
position: fixed; position: fixed;
bottom: 0; bottom: 0;
width: 100%; width: 100%;
margin-top: auto;
} }
#lifeCount{ #lifeCount{
padding: 10px; padding: 10px;