2024-08-27 13:11:59 +02:00
|
|
|
// Model Variabler
|
|
|
|
let sentence = ""
|
|
|
|
let words = ["Green", "Red", "Cat", "Man", "Started", "Jumped", "Pool", "Wall"];
|
|
|
|
|
|
|
|
// View
|
|
|
|
// HTML, onclick CSS
|
|
|
|
updateView();
|
|
|
|
function updateView() {
|
2024-08-27 13:16:43 +02:00
|
|
|
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;
|
|
|
|
|
2024-08-27 13:11:59 +02:00
|
|
|
};
|
|
|
|
|
|
|
|
// Controller endrer modellen
|
2024-08-27 13:16:43 +02:00
|
|
|
function insertWords(word) {
|
|
|
|
document.getElementById('sentence').innerHTML = `annet ${word}`;
|
2024-08-27 13:11:59 +02:00
|
|
|
|
|
|
|
}
|