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

little more from the mvc chapter

Browse source
This commit is contained in:
Geir Okkenhaug Jerstad 2024-08-27 13:16:43 +02:00
parent cafa3b8957
commit 12dc3057b6
6 changed files with 74 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

0
Codealong/index.html Normal file
View file

14
MVC/MVC_quizz.html
View file

@ -1,5 +1,6 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
@ -8,6 +9,7 @@
</style>
</head>
<body>
<div id="app"></div>
<script>
@ -17,16 +19,24 @@
// view
updateView();
function updateView(){
function updateView() {
let question;
if (questionIndex == 0) question = "Hva er 2 + 2 ?"
else if (questionIndex == 1) question = "Hva er hovedstaden i Sverige ?"
document.getElementById('app').innerHTML = /*HTML*/ `
<h1></h1>
<h1>${question}</h1>
Poeng: ${points}<br>
<input type="text">
<button onclick="next()">Next</button>
`;
};
// controller
function next() {
questionIndex++;
updateView();
}
</script>
</body>
</html>

2
oppgaver/uke4/adjektichistorie/adjektivhistorie.html
View file

@ -9,7 +9,7 @@
</head>
<body>
<div id="app"></div>
<div id="app" class="app"></div>
<script src="script.js"></script>
</body>

20
oppgaver/uke4/adjektichistorie/script.js
View file

@ -6,16 +6,20 @@ let words = ["Green", "Red", "Cat", "Man", "Started", "Jumped", "Pool", "Wall"];
// HTML, onclick CSS
updateView();
function updateView() {
document.getElementById('app').innerHTML = 'Dette er ____';
document.getElementById('app').innerHTML = /*HTML*/ `
<button>${words[0]}</button><button>${words[1]}</button>
<button>${words[2]}</button><button>${words[3]}</button>
<button>${words[4]}</button><button>${words[5]}</button>
<button>${words[6]}</button><button>${words[7]}</button>
`;
let html = `
<div id="sentence" class="sentence">Her er __ noe<br></div>
<div id="buttons" class="buttons">
<div onclick="insertWords(words[0])">${words[0]}</div><button onclick="insertWords(words[0])">${words[1]}</button>
<button onclick="insertWords(words[0])">${words[2]}</button><button onclick="insertWords(words[0])">${words[3]}</button>
<button onclick="insertWords(words[0])">${words[4]}</button><button onclick="insertWords(words[0])">${words[5]}</button>
<button onclick="insertWords(words[0])">${words[6]}</button><button onclick="insertWords(words[0])">${words[7]}</button>
</div>`;
document.getElementById('app').innerHTML = html;
};
// Controller endrer modellen
function insertWords() {
function insertWords(word) {
document.getElementById('sentence').innerHTML = `annet ${word}`;
}

12
oppgaver/uke4/adjektichistorie/style.css
View file

@ -0,0 +1,12 @@
.app{
background-color: blue;
}
.buttons{
display: grid;
grid-template-columns: 1fr 1fr;
margin-right: 20px;
color: aqua;
}
.sentence{
padding: 20px;
}

36
team/oppgave1/uke4/plan.md
View file

@ -0,0 +1,36 @@
# Gruppeoppgave klasse b team 1 uke 4
## Oppgavetekst
Dere skal lage et virtuelt kjæledyr som trenger
f.eks:
mat
å lekes med
vaskes/gjøre rent etter
Eller noe helt annet som trenger noen helt andre ting! (en bil som må på EU kontroll med jevne mellomrom, dykker som jevnlig må fylle o2 tanken, en programmerer som trenger kaffe - bare fantasien setter grenser! 😀 )
Lag knapper eller andre måter å gi dyret/etc det som trengs når det spør etter det
Dersom dyret ikke får det det trenger etter en viss tid reiser det bort for å finne en bedre eier
Bruk det dere har lært til nå for å løse oppgaven på en så god måte som mulig.
Planlegg, Tegn og fordel oppgaver - få Thumbs Up på planen fra kodelærer før dere går i gang.
HUSK!
Ikke bruk mer enn 4 timer på oppgaven - det er ikke farlig å ikke bli ferdig. Det er derimot viktig å samarbeide, lære og å øve på å legge en plan.
Vi går igjennom resultatene på Fredag
Gleder oss til å høre hvordan det har gått!
Viktig punkter å huske ved teamarbeid:
De som har kodeerfaring fra tidligere bør ta en laidback rolle feks ansvar for CSS
Pass på å inkluder alle, gi rom for innspill og lytt
Det er ikke viktig å bli ferdig med oppgave - vi ser etter ferdigheter innenfor samarbeid først og fremst
Legg koden på et nivå som alle kan ha et forhold til
Ikke bruk elementer som ikke har blitt gjennomgått i undervisningstimene
## Løsningsplan
Drawing
Buttons