codealong og oppgave
This commit is contained in:
parent
cf77bca4e0
commit
1e04ea8aa3
|
@ -1 +1,34 @@
|
|||
|
||||
function addBike() {
|
||||
let newBike = model.input.newBike;
|
||||
let myBike = {
|
||||
id: addNewId(),
|
||||
brand: newBike.brand,
|
||||
gears: newBike.gears,
|
||||
state: newBike.state,
|
||||
isAvilable: newBike.isAvilable,
|
||||
description: newBike.description,
|
||||
};
|
||||
model.data.bikes.push(myBike);
|
||||
newBike.id = "";
|
||||
newBike.brand = "";
|
||||
newBike.gears = "";
|
||||
newBike.state = "";
|
||||
newBike.description = "";
|
||||
console.log(model.data.bikes)
|
||||
updateView();
|
||||
}
|
||||
|
||||
function addNewId(){
|
||||
let newId = Math.floor(Math.random()*9999)
|
||||
for(let i = 0; i < model.data.bikes.length; i++){
|
||||
|
||||
if(newId === model.data.bikes[i].id){
|
||||
addNewId();
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
return newId;
|
||||
}
|
||||
|
|
@ -1,36 +0,0 @@
|
|||
// 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,
|
||||
},
|
||||
]
|
||||
},
|
||||
}
|
|
@ -3,11 +3,16 @@
|
|||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Document</title>
|
||||
<title>Sykkelutleie</title>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
<script src="modell.js"></script>
|
||||
<div id="header" class="header"></div>
|
||||
<div id="main" class="main"></div>
|
||||
<div id="input" class="input"></div>
|
||||
</div>
|
||||
<script src="model.js"></script>
|
||||
<script src="controller.js"></script>
|
||||
<script src="view.js"></script>
|
||||
|
||||
|
|
|
@ -1,31 +1,53 @@
|
|||
updateView();
|
||||
function updateView() {
|
||||
app.innerHTML = /*html*/ `
|
||||
<h1>Bikes R Us</h1>
|
||||
header.innerHTML = '<h1 class="header">Lån en sykkel</h1>';
|
||||
main.innerHTML = /*html*/ `
|
||||
<div>Alle sykkler:</div>
|
||||
${bikeList()}
|
||||
|
||||
${bikeList()}`;
|
||||
input.innerHTML = /*html*/ `
|
||||
<h1> Legg til en sykkel:</h1>
|
||||
${addBikeview()}
|
||||
`;
|
||||
}
|
||||
|
||||
function bikeList() {
|
||||
let bikeHtml = '';
|
||||
|
||||
for (i = 0; i < modell.data.bikes.length; i++) {
|
||||
let bikes = model.data.bikes
|
||||
for (i = 0; i < model.data.bikes.length; i++) {
|
||||
bikeHtml += /*html*/ `
|
||||
|
||||
<div class="list">
|
||||
<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>`;
|
||||
<li>Merke: ${bikes[i].brand}</li>
|
||||
<li>Gir: ${bikes[i].gears}</li>
|
||||
<li>Beskrivelse: ${bikes[i].description}</li>
|
||||
<li>Tilgjengelig: ${bikes[i].isAvilable}</li>
|
||||
<li>Tilstand: ${bikes[i].state}</li>
|
||||
</ul>
|
||||
</div>`;
|
||||
}
|
||||
return bikeHtml;
|
||||
}
|
||||
function addBikeview(){
|
||||
function addBikeview() {
|
||||
let addBikeHtml = /*html*/ `
|
||||
<div>
|
||||
<label class="labels">Merke:</label>
|
||||
<input type="text" onchange="model.input.newBike.brand = this.value">
|
||||
</div>
|
||||
<div>
|
||||
<label class="labels">Gir:</label>
|
||||
<input type="number" onchange="model.input.newBike.gears = this.value">
|
||||
</div>
|
||||
<div>
|
||||
Er sykkelen tigjengelig<input type="checkbox" checked="checked" onclick="model.input.newBike.isAvailable = this.value">Ja</button>
|
||||
<input type="checkbox" checked="" onclick="model.input.newBike.isAvailable = this.value">Nei</button>
|
||||
</div>
|
||||
<div>
|
||||
<label class="labels">Beskrivelse:</label>
|
||||
<textarea onchange="model.input.newBike.comment = this.value"></textarea>
|
||||
</div>
|
||||
|
||||
<button onclick="addBike()">Legg til sykkel</button>
|
||||
`;
|
||||
return addBikeHtml
|
||||
|
||||
}
|
22
oppgaver/checkLetters.js
Normal file
22
oppgaver/checkLetters.js
Normal file
|
@ -0,0 +1,22 @@
|
|||
const letters = "abcdefghijklmnopqrstuvwxzy ";
|
||||
let string = "Not a pangram";
|
||||
let string2 = "The quick brown fox jumps over the lazy dog"
|
||||
|
||||
// console.log(letters, string,letterArray, stringArray,test)
|
||||
|
||||
|
||||
|
||||
function isPangram(str) {
|
||||
const lowerStr = str.toLowerCase();
|
||||
|
||||
if (letters.split('').every(char => lowerStr.includes(char))){
|
||||
console.log('ja')
|
||||
return true;
|
||||
|
||||
} else {
|
||||
console.log('nei')
|
||||
return false
|
||||
};
|
||||
}
|
||||
|
||||
isPangram(string2);
|
Loading…
Reference in a new issue