geir/startit
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

some stuff

Browse source
This commit is contained in:
Geir Okkenhaug Jerstad 2024-10-31 09:07:48 +01:00
parent 4ae480551b
commit cf77bca4e0
15 changed files with 257 additions and 69 deletions
Download patch file Download diff file Expand all files Collapse all files

1
Codealong/controller.js Normal file
View file

@ -0,0 +1 @@

30
Codealong/index.html
View file

@ -1,30 +0,0 @@
<!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>
<div>
<div id="text">Tekst her</div>
<button onclick="change()">Trykk her</button>
Vis dyr: <input id="showAnimal" onchange="show()"></button>
<div id="show"></div>
</div>
<script>
function change() {
let animalList = ["hund", "katt", "esel"];
let animal = animalList[Math.floor(Math.random() * animalList.length)];
document.getElementById('text').innerHTML = `${animal}`;
}
function show(){
let animal = document.getElementById('showAnimal').value;
document.getElementById('show').innerHTML = `${animal}`;
}
</script>
</body>
</html>

36
Codealong/modell.js Normal file
View file

@ -0,0 +1,36 @@
// Sykkelutleie
// Kunden ønsker en applikasjon som skal kunne liste opp syklene den har så andre kan leie dem. Det skal også være mulig å legge til nye sykler etterhvert.
// Lag en modell som kan fungere til teksten ovenfor
// Lag viewfunksjon for å vise frem alle syklene våre
// Lag en controllerfunksjon og et view til for å kunne legge til nye sykler
const app = document.getElementById('app');
const modell = {
app: {
},
input: {
},
data: {
bikes: [
{
id: 1,
modell: 'DBS',
gears: 5,
description: '',
state: 'works',
isAvilable: true,
},
{
id: 2,
modell: 'DBS',
gears: 7,
description: '',
state: 'refurbished',
isAvilable: true,
},
]
},
}

15
Codealong/sykkel.html Normal file
View file

@ -0,0 +1,15 @@
<!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>
<div id="app"></div>
<script src="modell.js"></script>
<script src="controller.js"></script>
<script src="view.js"></script>
</body>
</html>

31
Codealong/view.js Normal file
View file

@ -0,0 +1,31 @@
updateView();
function updateView() {
app.innerHTML = /*html*/ `
<h1>Bikes R Us</h1>
<div>Alle sykkler:</div>
${bikeList()}
`;
}
function bikeList() {
let bikeHtml = '';
for (i = 0; i < modell.data.bikes.length; i++) {
bikeHtml += /*html*/ `
<ul>
<li>Merke: ${modell.data.bikes[i].modell}</li>
<li>Gir: ${modell.data.bikes[i].gears}</li>
<li>Beskrivelse: ${modell.data.bikes[i].description}</li>
<li>Tilgjengelig: ${modell.data.bikes[i].isAvilable}</li>
<li>Tilstand: ${modell.data.bikes[i].state}</li>
</ul>`;
}
return bikeHtml;
}
function addBikeview(){
let addBikeHtml = /*html*/ `
`;
}