team oppgave

This commit is contained in:
Geir Okkenhaug Jerstad 2024-08-14 14:52:08 +02:00
parent 79b0cd3da4
commit efb60f2471
9 changed files with 239 additions and 31 deletions

12
team/oppgave1/index.html Normal file
View file

@ -0,0 +1,12 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
</body>
</html>

91
team/oppgave1/index2.html Normal file
View file

@ -0,0 +1,91 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Inventory Oppgave2</title>
</head>
<style>
div.InvSelect {
color: white;
background-color: rgb(73, 162, 76);
border: 6px white;
text-align: center;
padding: 6px;
user-select: none;
}
div.Inv{
background-color:lightgrey;
background: rgb(182, 182, 182);
border: 1px solid black;
display: grid;
grid-template-columns: repeat(4, 1fr);
}
button.mana {
background-color: rgb(0, 119, 255);
font-size: medium;
color: white;
}
button.health {
background-color: rgba(255, 0, 0, 0.808);
font-size: medium;
color: white;
}
</style>
<body><h1>Gruppe Oppgave the Goats</h1>
<div><b>Klikk her for å legge til eller ta vekk</b></div>
<button class="health" onclick="addHealth()">Legg til helse flaske</button>
<button class="health" onclick="decreaseHealth()">Ta fra helse flaske</button>
<button class="mana" onclick="addMana()">Legg til magi flaske</button>
<button class="mana" onclick="decreaseMana()">Ta fra magi flaske</button>
<div>
<div class="InvSelect" onclick="openClose()">Inventory</div>
<div id="showInventory"></div>
</div>
</div>
<script>
var healthTotal = 0;
var manaTotal = 0;
blankAll()
function addHealth() {
healthTotal = healthTotal + 1
document.getElementById("health").innerHTML = healthTotal;
}
function addMana(){
manaTotal = manaTotal + 1
document.getElementById("mana").innerHTML = manaTotal;
}
function decreaseHealth(){
healthTotal = healthTotal - 1
document.getElementById("health").innerHTML = healthTotal;
}
function decreaseMana(){
manaTotal = manaTotal - 1
document.getElementById("mana").innerHTML = manaTotal;
}
function openClose(){
document.getElementById("showInventory").innerHTML = /*HTML*/ `
<div class="Inv">Total Helse</div>
<div class="Inv" id="health"></div>
<div class="Inv">Total mana</div>
<div class="Inv" id="mana"></div>
<button onclick="blankAll()">Close Inventory</button>
`;
}
function blankAll() {
document.getElementById("showInventory").innerHTML = ' ';
}
</script>
</body>
</html>

View file

@ -3,10 +3,30 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Hei på deg!</title>
<title>Health og Mana</title>
<style>
body {
margin: 0;
padding: 0;
}
.container {
border: 10px solid greenyellow;
display: grid;
grid-template-columns: repeat(4, 1fr);
height: 10vh;
}
.header{
border: 10px solid grey;
border-radius: 10px;
background-color: antiquewhite;
font-size: x-large;
}
</style>
</head>
<body>
<div>
<div class="header">Add or delete potions from inventory</div>
<div class="container">
<button onclick="addHealth()">add health potion</button>
<button onclick="delHealth()">delete health potion</button>
<button onclick="addMana()">add mana potion</button>
@ -14,7 +34,7 @@
</div>
<div>
<div onclick="showHideInventory()">
Inventory
<div class="header">Inventory</div>
</div>
<div id="inventory">
@ -43,7 +63,7 @@
function showHideInventory() {
if (inventoryOpen != true) {
document.getElementById('inventory').innerHTML = /*HTML*/ `
<div>Health<div id="healthTotal"></div>
<div class="container">Health<div id="healthTotal"></div>
Mana<div id="manaTotal"></div>
</div>`;
document.getElementById("manaTotal").innerHTML = manaTotal;