diff --git a/Codealong/controller.js b/Codealong/controller.js new file mode 100644 index 0000000..8b13789 --- /dev/null +++ b/Codealong/controller.js @@ -0,0 +1 @@ + diff --git a/Codealong/index.html b/Codealong/index.html deleted file mode 100644 index 12140c7..0000000 --- a/Codealong/index.html +++ /dev/null @@ -1,30 +0,0 @@ - - - - - - - Document - - - -
-
Tekst her
- - Vis dyr: -
-
- - - - \ No newline at end of file diff --git a/Codealong/modell.js b/Codealong/modell.js new file mode 100644 index 0000000..d7d85c7 --- /dev/null +++ b/Codealong/modell.js @@ -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, + }, + ] + }, +} \ No newline at end of file diff --git a/Codealong/sykkel.html b/Codealong/sykkel.html new file mode 100644 index 0000000..8c0f796 --- /dev/null +++ b/Codealong/sykkel.html @@ -0,0 +1,15 @@ + + + + + + Document + + +
+ + + + + + \ No newline at end of file diff --git a/Codealong/view.js b/Codealong/view.js new file mode 100644 index 0000000..cb3cd1b --- /dev/null +++ b/Codealong/view.js @@ -0,0 +1,31 @@ +updateView(); +function updateView() { + app.innerHTML = /*html*/ ` +

Bikes R Us

+
Alle sykkler:
+ ${bikeList()} + + `; +} +function bikeList() { + let bikeHtml = ''; + + for (i = 0; i < modell.data.bikes.length; i++) { + bikeHtml += /*html*/ ` + + `; + } + return bikeHtml; +} +function addBikeview(){ + let addBikeHtml = /*html*/ ` + + `; + +} \ No newline at end of file diff --git a/morse/view.js b/morse/view.js index 9f30e9d..755026c 100644 --- a/morse/view.js +++ b/morse/view.js @@ -1,7 +1,4 @@ function updateView(){ - app.innerHTML = /*html*/ ` - - `; - + app.innerHTML = ''; } \ No newline at end of file diff --git a/mostly/flock.js b/mostly/flock.js new file mode 100644 index 0000000..33270cb --- /dev/null +++ b/mostly/flock.js @@ -0,0 +1,38 @@ +// class Flock { +// constructor(n) { +// this.seagulls = n; + +// } +// cojoin(other) { +// this.seagulls += other.seagulls; +// return this; +// } +// breed(other) { +// this.seagulls = this.seagulls * other.seagulls; +// return this; +// } +// } + +// const FlockA = new Flock(4); +// const FlockB = new Flock(2); +// const FlockC = new Flock(0); +// const result = FlockA +// .cojoin(FlockC) +// .breed(FlockB) +// .cojoin(FlockA.breed(FlockB)) +// .seagulls; + +// const cojoin = (flockX, flockY) => flockX + flockY; +// const breed = (flockX, flockY) => flockX * flockY; + +const FlockA = 4; +const FlockB = 2; +const FlockC = 0; +// const result = cojoin(breed(FlockB, cojoin(FlockA, FlockC)), breed(FlockA, FlockB)) + +const add = (x, y) => x + y; +const multiply = (x, y) => x * y; + +const result = add(multiply(FlockB, add(FlockA, FlockC)), multiply(FlockA, FlockB)); + +console.log(result); diff --git a/package-lock.json b/package-lock.json index cc095c7..1b31365 100644 --- a/package-lock.json +++ b/package-lock.json @@ -5,6 +5,7 @@ "packages": { "": { "dependencies": { + "@mostly-adequate/support": "^2.0.1", "prompt": "^1.3.0", "react-router-dom": "^6.26.2" }, @@ -21,6 +22,12 @@ "node": ">=0.1.90" } }, + "node_modules/@mostly-adequate/support": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/@mostly-adequate/support/-/support-2.0.1.tgz", + "integrity": "sha512-+16tUURaxiGFGBiYcI4Xu82UsMLSxc2F5DVGimMVkkP/tO+wRNuDPUJTW9YMY7UlHW9KQ9XRHShDEubqliy7vA==", + "license": "MIT" + }, "node_modules/@remix-run/router": { "version": "1.19.2", "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.19.2.tgz", diff --git a/package.json b/package.json index 3bb46d4..536eb73 100644 --- a/package.json +++ b/package.json @@ -1,5 +1,6 @@ { "dependencies": { + "@mostly-adequate/support": "^2.0.1", "prompt": "^1.3.0", "react-router-dom": "^6.26.2" }, diff --git a/prosjekt/controller.js b/prosjekt/controller.js new file mode 100644 index 0000000..e69de29 diff --git a/prosjekt/helpers.js b/prosjekt/helpers.js new file mode 100644 index 0000000..9d9f2eb --- /dev/null +++ b/prosjekt/helpers.js @@ -0,0 +1,4 @@ +const app = document.getElementById('app'); +const headerHtml = document.getElementById('header'); +const mainHtml = document.getElementById('mainView'); +const footer = document.getElementById('footer'); \ No newline at end of file diff --git a/prosjekt/index.html b/prosjekt/index.html index 3dbbedb..9499e57 100644 --- a/prosjekt/index.html +++ b/prosjekt/index.html @@ -4,45 +4,23 @@ - Super cool project for homelabers + Book R Us - + + + + + - -
-
Header
-
Menu
-
MainContent
-
Footer
+ +
+ + +
MainContent
+
+ \ No newline at end of file diff --git a/prosjekt/modell.js b/prosjekt/modell.js new file mode 100644 index 0000000..446be07 --- /dev/null +++ b/prosjekt/modell.js @@ -0,0 +1,22 @@ + + +var model = { + app: { + pages: ['home','new'], + currentPage: "home", + }, + input:{ + search: '', + }, + data: { + books: [], + book:{ + id: 0, + title: '', + authorFirstName: '', + authorLastName: '', + file: '', + coverImg: '', + }, + } +} \ No newline at end of file diff --git a/prosjekt/style.css b/prosjekt/style.css new file mode 100644 index 0000000..6d9c907 --- /dev/null +++ b/prosjekt/style.css @@ -0,0 +1,43 @@ + +.app{ + height: 100vh; + display: grid; + grid-template-columns: 1fr 4fr; + grid-template-rows: 100px 10fr 20px; + grid-template-areas: + 'header header' + 'menu mainView' + 'footer footer'; ; +} +.header{ + background-color: rgb(78, 206, 163); + color: black; + height: auto; + grid-area: header; + /* justify-content: center; */ +} +.header li { + float: left; + display: inline; + list-style-type: none; +} +.header li:hover { + background-color: #b35959; + } +.header li input { + float: right; +} +.menu{ + background-color: grey; + color: black; + grid-area: menu; +} +.mainView{ + background-color: rgb(218, 131, 131); + color: black; + grid-area: mainView; +} +.footer{ + background-color: black; + grid-area: footer; +} \ No newline at end of file diff --git a/prosjekt/view.js b/prosjekt/view.js new file mode 100644 index 0000000..24cc4de --- /dev/null +++ b/prosjekt/view.js @@ -0,0 +1,45 @@ +const page = model.app.currentPage; + +function updateView(){ + if (page == "home"){ + viewhome(); + } else if (page == 'new'){ + viewNew(); + } +} +function viewhome(){ + navbar(); + document.getElementById('mainView').innerHTML = /*html*/ ` +

Hello from Home

+ + `; + // mainHtml.innerHTML += 'Hello' + +} + +function navbar(){ + document.getElementById('header').innerHTML = /*html*/ ` + `; +} +function viewNew(){ + navbar(); + document.getElementById('mainView').innerHTML = '

Hello from new

' +} +function goNew(){ + model.app.currentPage = 'new'; + updateView(); +} +function dialog() { + document.getElementById('mainView'),innerHTML += /*html*/ ` +
+ +

Ansewer the question

+ + + + + `; +} \ No newline at end of file