siv/github.io
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

enkelt firestore bibliotek

Browse Source
This commit is contained in:
sava 2020-03-27 15:48:13 +01:00
parent e8209c511f
commit 34d57e848c
4 changed files with 80 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
it1/bibliotek/bibliotek.css
View File

@ -3,8 +3,11 @@
margin: 2vh;
}
#content > * {
.top {
margin-top: 9vh;
}
.middle {
margin-left: 13vw;
margin-right: 42.0vw;
}
@ -13,10 +16,6 @@
margin-top: 1vh;
}
#form {
width: 25%;
}
#form > div > * {
margin-bottom: 1vh;
}

36
it1/bibliotek/bibliotek.js
View File

@ -1,16 +1,44 @@
var firestore = firebase.firestore
var list = function() {
// db.collection('bibliotek').doc("8ZBX5gmIaRwQBCjgLLg0").get().then(function(doc){console.log(doc.data())})
// db.collection('bibliotek').get().then(function(query){query.forEach(function(doc){console.log(doc.data())})})
db.collection('bibliotek')
.withConverter(bookConverter)
.get()
.then(function(query) {
html = ''
query.forEach(function(doc) {
book = doc.data()
html += book.toHtml()
})
$('#books').html(html)
})
.catch(function(error) {
$('#books').html('<h3>Kunne ikke hente bøker!</h3><p>'+error+'</p>')
$('#books').css('color', 'red')
})
}
var add = function() {
let millis = Date.parse($('#published')[0].value)
db.collection("bibliotek").add({
db.collection("bibliotek").add({ // withConverter ?
tittel: $('#title')[0].value,
forfatter: $('#author')[0].value,
forlag: $('#publisher')[0].value,
terningkast: $('#rating')[0].value,
utgitt: new firebase.firestore.Timestamp(millis/1000, 0)
utgitt: new firestore.Timestamp(millis/1000, 0)
}).then(function() {
$('#status').html('<p style="color: green;">La til bok '+$('#title')[0].value+'!</p>')
$('#status').html('<p>La til bok '+$('#title')[0].value+'!</p>')
$('#status').css('color', 'green')
}).catch(function() {
$('#status').html('<p style="color: red;">Problem med å legge til bok '+$('#title')[0].value+'!</p>')
$('#status').html('<p>Problem med å legge til bok '+$('#title')[0].value+'!</p>')
$('#status').css('color', 'red')
})
}
$(document).ready(function() {
list()
})

37
it1/bibliotek/bok.js Normal file
View File

@ -0,0 +1,37 @@
class Book {
constructor(title, author, publisher, rating, published) {
this.title = title
this.author = author
this.publisher = publisher
this.rating = rating
this.published = published.toDate()
}
toString() {
return this.title+' av '+this.author+', ternignkast '+this.rating+', utgitt '+this.published.toString().slice(0,15)+', forlag; '+this.publisher
}
toHtml() {
let span = function(string, color='red') {
return '<span style="color: '+color+'">'+string+'</span>'
}
return '<p>'+span(this.title)+' av '+span(this.author)+', ternignkast '+span(this.rating)+
', utgitt '+span(this.published.toString().slice(0,15), 'green')+', forlag; '+span(this.publisher, 'yellow')+'</p>'
}
}
bookConverter = {
toFirestore: function(book) {
return {
title: book.title,
author: book.author,
publisher: book.publisher,
rating: book.rating,
published: book.published
}
},
fromFirestore: function(snapshot, options) {
const data = snapshot.data(options)
return new Book(data.tittel, data.forfatter, data.forlag, data.terningkast, data.utgitt)
}
}

10
it1/bibliotek/index.html
View File

@ -9,11 +9,12 @@
<script src="https://www.gstatic.com/firebasejs/7.11.0/firebase-firestore.js"></script>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script type="text/javascript" src="/it1/init-firebase.js"></script>
<script type="text/javascript" src="/it1/bibliotek/bok.js"></script>
</head>
<body>
<script type="text/javascript" id="navbar" src="/it1/navbar/navbar.js"></script>
<div id="content">
<form action="#" method="POST" id="form">
<div id="content" class="middle">
<form action="#" method="POST" id="form" class="top">
<div class="form-group">
<div class="row">
<div class="col"><input type="name" class="form-control" id="title" placeholder="Tittel"></div>
@ -34,7 +35,10 @@
<a type="submit" class="btn btn-primary" href="javascript: add()">Legg til</a>
</form>
<div id="status">
<p></p>
<p>&nbsp;</p>
</div>
<a type="submit" class="btn btn-primary" href="javascript: list()">Hent bøker</a>
<div id="books">
</div>
</div>
<script type="text/javascript" src="/it1/bibliotek/bibliotek.js"></script>