basic authentication
This commit is contained in:
sava
parent
8676f94dcc
commit
891f219379
@ -6,10 +6,10 @@
|
||||
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" crossorigin="anonymous">
|
||||
<link rel="stylesheet" href="/main.css">
|
||||
</head>
|
||||
<bod>
|
||||
<body>
|
||||
<div id="content">
|
||||
<h3>Noting to see here</h3>
|
||||
<p>You can check out work I did in IT1 (informasjons teknologi 1) a Norwegian optional vacational course <a href="/it1/index.html">here</a>.</p>
|
||||
<p>You can check out work I did in IT1 (informasjons teknologi 1) a Norwegian optional vacational course <a href="/it1/">here</a>.</p>
|
||||
</div>
|
||||
</bod>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,44 +1,60 @@
|
||||
|
||||
var firestore = firebase.firestore
|
||||
var db = firebase.firestore()
|
||||
|
||||
var list = function() {
|
||||
var list = function(user) {
|
||||
// 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 = ''
|
||||
html = '<br/>'
|
||||
query.forEach(function(doc) {
|
||||
book = doc.data()
|
||||
html += book.toHtml()
|
||||
html += book.toHtml(user)
|
||||
})
|
||||
$('#books').html(html)
|
||||
})
|
||||
.catch(function(error) {
|
||||
$('#books').html('<h3>Kunne ikke hente bøker!</h3><p>'+error+'</p>')
|
||||
}).catch(function(error) {
|
||||
$('#books').html('<h3>Kunne ikke hente bøker!</h3><br/><p>'+error+'</p>')
|
||||
$('#books').css('color', 'red')
|
||||
})
|
||||
}
|
||||
|
||||
var add = function() {
|
||||
let millis = Date.parse($('#published')[0].value)
|
||||
db.collection("bibliotek").add({ // withConverter ?
|
||||
tittel: $('#title')[0].value,
|
||||
forfatter: $('#author')[0].value,
|
||||
forlag: $('#publisher')[0].value,
|
||||
terningkast: $('#rating')[0].value,
|
||||
utgitt: new firestore.Timestamp(millis/1000, 0)
|
||||
}).then(function() {
|
||||
db.collection("bibliotek")
|
||||
.withConverter(bookConverter)
|
||||
.add(new Book(
|
||||
$('#title')[0].value,
|
||||
$('#author')[0].value,
|
||||
$('#publisher')[0].value,
|
||||
$('#rating')[0].value,
|
||||
$('#published')[0].value
|
||||
)).then(function() {
|
||||
$('#status').html('<p>La til bok '+$('#title')[0].value+'!</p>')
|
||||
$('#status').css('color', 'green')
|
||||
list(firebase.auth().currentUser)
|
||||
}).catch(function() {
|
||||
$('#status').html('<p>Problem med å legge til bok '+$('#title')[0].value+'!</p>')
|
||||
$('#status').css('color', 'red')
|
||||
})
|
||||
}
|
||||
|
||||
$(document).ready(function() {
|
||||
list()
|
||||
var remove = function(id) {
|
||||
db.collection("bibliotek").doc(id)
|
||||
.delete().then(function() {
|
||||
list(firebase.auth().currentUser)
|
||||
}).catch(function(error) {
|
||||
alert("Error removing document: ", error)
|
||||
})
|
||||
}
|
||||
|
||||
firebase.auth().onAuthStateChanged(function(user) {
|
||||
list(user)
|
||||
})
|
||||
|
||||
/*
|
||||
$(document).ready(function() {
|
||||
list(firebase.auth().currentUser)
|
||||
})
|
||||
*/
|
||||
|
||||
|
||||
@ -1,37 +1,47 @@
|
||||
|
||||
class Book {
|
||||
constructor(title, author, publisher, rating, published) {
|
||||
constructor(title, author, publisher, rating, published, id=0) {
|
||||
this.cfid = id
|
||||
this.title = title
|
||||
this.author = author
|
||||
this.publisher = publisher
|
||||
this.rating = rating
|
||||
this.published = published.toDate()
|
||||
this.published = published
|
||||
}
|
||||
toString() {
|
||||
return this.title+' av '+this.author+', ternignkast '+this.rating+', utgitt '+this.published.toString().slice(0,15)+', forlag; '+this.publisher
|
||||
return this.title+' av '+this.author+', terningkast '+this.rating+', utgitt '+this.published.toString().slice(0,15)+', forlag; '+this.publisher
|
||||
}
|
||||
toHtml() {
|
||||
toHtml(user=false) {
|
||||
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>'
|
||||
return '<p>'+span(this.title)+' av '+span(this.author)+', terningkast '+span(this.rating)+', utgitt '
|
||||
+span(this.published.toString().slice(0,15), 'green')+', forlag; '+span(this.publisher, 'yellow')
|
||||
+(user?' <a class="btn btn-primary" href="javascript: remove(\''+this.cfid+'\')">Slett</a>':'')+'</p>'
|
||||
}
|
||||
}
|
||||
|
||||
bookConverter = {
|
||||
toFirestore: function(book) {
|
||||
let millis = Date.parse(book.published)
|
||||
return {
|
||||
title: book.title,
|
||||
author: book.author,
|
||||
publisher: book.publisher,
|
||||
rating: book.rating,
|
||||
published: book.published
|
||||
tittel: book.title,
|
||||
forfatter: book.author,
|
||||
forlag: book.publisher,
|
||||
terningkast: book.rating,
|
||||
utgitt: new firebase.firestore.Timestamp(millis/1000, 0)
|
||||
}
|
||||
},
|
||||
fromFirestore: function(snapshot, options) {
|
||||
const data = snapshot.data(options)
|
||||
return new Book(data.tittel, data.forfatter, data.forlag, data.terningkast, data.utgitt)
|
||||
return new Book(
|
||||
data.tittel,
|
||||
data.forfatter,
|
||||
data.forlag,
|
||||
data.terningkast,
|
||||
data.utgitt.toDate(),
|
||||
snapshot.id
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -4,16 +4,18 @@
|
||||
<title>Firebase basert bibliotek</title>
|
||||
<meta charset="utf-8">
|
||||
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" crossorigin="anonymous">
|
||||
<link rel="stylesheet" href="/it1/bibliotek/bibliotek.css">
|
||||
<script src="https://www.gstatic.com/firebasejs/7.11.0/firebase-app.js"></script>
|
||||
<script src="https://www.gstatic.com/firebasejs/7.11.0/firebase-firestore.js"></script>
|
||||
<link rel="stylesheet" href="/it1/main.css">
|
||||
<link rel="stylesheet" href="/it1/css/form.css">
|
||||
<script src="https://www.gstatic.com/firebasejs/7.12.0/firebase-app.js"></script>
|
||||
<script src="https://www.gstatic.com/firebasejs/7.12.0/firebase-auth.js"></script>
|
||||
<script src="https://www.gstatic.com/firebasejs/7.12.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/js/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" class="middle">
|
||||
<script type="text/javascript" id="navbar" src="/it1/js/navbar.js"></script>
|
||||
<div id="content">
|
||||
<form action="#" method="POST" id="form" class="top">
|
||||
<div class="form-group">
|
||||
<div class="row">
|
||||
@ -37,7 +39,7 @@
|
||||
<div id="status">
|
||||
<p> </p>
|
||||
</div>
|
||||
<a type="submit" class="btn btn-primary" href="javascript: list()">Hent bøker</a>
|
||||
<a type="submit" class="btn btn-primary" href="javascript: list(firebase.auth().currentUser)">Hent bøker</a>
|
||||
<div id="books">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
30
it1/bruker/index.html
Normal file
30
it1/bruker/index.html
Normal file
@ -0,0 +1,30 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Firebase basert bibliotek</title>
|
||||
<meta charset="utf-8">
|
||||
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" crossorigin="anonymous">
|
||||
<link rel="stylesheet" href="/it1/main.css">
|
||||
<link rel="stylesheet" href="/it1/css/form.css">
|
||||
<script src="https://www.gstatic.com/firebasejs/7.11.0/firebase-app.js"></script>
|
||||
<script src="https://www.gstatic.com/firebasejs/7.12.0/firebase-auth.js"></script>
|
||||
<script type="text/javascript" src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
|
||||
<script type="text/javascript" src="/it1/js/init-firebase.js"></script>
|
||||
<script type="text/javascript" src="/it1/js/auth.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script type="text/javascript" id="navbar" src="/it1/js/navbar.js"></script>
|
||||
<div id="content">
|
||||
<form action="#" method="POST" id="form" class="top">
|
||||
<div class="form-group">
|
||||
<input type="name" class="form-control" id="mail" placeholder="Epost">
|
||||
<input type="password" class="form-control" id="password" placeholder="Passord">
|
||||
</div>
|
||||
<a type="submit" class="btn btn-primary" id="login" onclick="signin()">Logg inn</a>
|
||||
</form>
|
||||
<div id="status">
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript" src="/it1/js/auth.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,17 +1,14 @@
|
||||
|
||||
#content {
|
||||
margin: 2vh;
|
||||
margin-left: 13vw;
|
||||
margin-right: 42.0vw;
|
||||
}
|
||||
|
||||
.top {
|
||||
margin-top: 9vh;
|
||||
}
|
||||
|
||||
.middle {
|
||||
margin-left: 13vw;
|
||||
margin-right: 42.0vw;
|
||||
}
|
||||
|
||||
#status {
|
||||
margin-top: 1vh;
|
||||
}
|
||||
@ -24,3 +21,14 @@
|
||||
margin-bottom: 0.33vh;
|
||||
}
|
||||
|
||||
.form-control {
|
||||
background-color: #333;
|
||||
border-color: #222;
|
||||
color: lime;
|
||||
}
|
||||
.form-control:focus {
|
||||
background-color: #555;
|
||||
border-color: #333;
|
||||
color: lime;
|
||||
}
|
||||
|
||||
@ -1,20 +1,19 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Simple firebase logon</title>
|
||||
<title>Simple firebase stuff</title>
|
||||
<meta charset="utf-8">
|
||||
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" crossorigin="anonymous">
|
||||
<link rel="stylesheet" href="/it1/main.css">
|
||||
<!--
|
||||
<script defer src="https://www.gstatic.com/firebasejs/7.11.0/firebase-app.js"></script>
|
||||
<script defer src="https://www.gstatic.com/firebasejs/7.11.0/firebase-auth.js"></script>
|
||||
<script defer src="https://www.gstatic.com/firebasejs/7.11.0/firebase-firestore.js"></script>
|
||||
-->
|
||||
<script src="https://www.gstatic.com/firebasejs/7.11.0/firebase-app.js"></script>
|
||||
<script src="https://www.gstatic.com/firebasejs/7.11.0/firebase-auth.js"></script>
|
||||
<script type="text/javascript" src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
|
||||
<script type="text/javascript" src="/it1/js/init-firebase.js"></script>
|
||||
<script type="text/javascript" src="/it1/js/auth.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<!-- <iframe id="navbar" width="100%" height="60px" src="/it1/navbar/navbar.html" style="border: 0px"></iframe> -->
|
||||
<script type="text/javascript" id="navbar" src="/it1/navbar/navbar.js"></script>
|
||||
<script type="text/javascript" id="navbar" src="/it1/js/navbar.js"></script>
|
||||
<div id="content">
|
||||
<h3 style="margin: 3vh">Denne siden inneholder ting jeg har laget med firebase i IT1!</h3>
|
||||
<br />
|
||||
|
||||
18
it1/js/auth.js
Normal file
18
it1/js/auth.js
Normal file
@ -0,0 +1,18 @@
|
||||
|
||||
var signin = function() {
|
||||
firebase.auth()
|
||||
.signInWithEmailAndPassword($('#mail')[0].value, $('#password')[0].value)
|
||||
.then(function() {
|
||||
document.location.href = "/it1/"
|
||||
}).catch(function(error) {
|
||||
$('#status').html('<h3>Kunne ikke logge inn som '+$('#mail')[0].value+'!</h3><p>'+error.code+': '+error.message+'</p>')
|
||||
$('#status').css('color', 'red')
|
||||
})
|
||||
}
|
||||
|
||||
$(document).keydown(function(e) {
|
||||
if (e.which == 13){
|
||||
$("#login").click()
|
||||
}
|
||||
})
|
||||
|
||||
@ -8,5 +8,3 @@ firebase.initializeApp({
|
||||
messagingSenderId: "206703382262",
|
||||
appId: "1:206703382262:web:be48f32d11a15fa28f26d7"
|
||||
})
|
||||
var db = firebase.firestore()
|
||||
|
||||
43
it1/js/navbar.js
Normal file
43
it1/js/navbar.js
Normal file
@ -0,0 +1,43 @@
|
||||
|
||||
$('#navbar').parent().html(`
|
||||
<nav class="navbar navbar-expand-sm bg-dark navbar-dark" id="navbar">
|
||||
<a class="navbar-brand" href="/it1/">IT1 firebase stuff</a>
|
||||
<!-- <ul class="navbar-nav">
|
||||
<li class="nav-item right">
|
||||
<a class="nav-link" href="/it1/about.html">About</a>
|
||||
</li>
|
||||
</ul> -->
|
||||
<ul class="navbar-nav ml-auto">
|
||||
<!-- <li class="nav-item right" id="register-btn">
|
||||
<a class="nav-link" href="/register">Register</a>
|
||||
</li> -->
|
||||
<li class="nav-item right">
|
||||
<a class="nav-link" id="login-btn" href="/it1/bruker/"></a>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>`)
|
||||
|
||||
var signout = function() {
|
||||
firebase.auth()
|
||||
.signOut()
|
||||
.then(function() {
|
||||
document.location.href = '/it1/'
|
||||
}).catch(function(error) {
|
||||
alert('could not log out: '+error.message)
|
||||
})
|
||||
}
|
||||
|
||||
firebase.auth().onAuthStateChanged(function(user) {
|
||||
if (user) {
|
||||
$('#login-btn').attr('href', 'javascript: signout()')
|
||||
$('#login-btn').html('Logout')
|
||||
} else {
|
||||
$('#login-btn').attr('href', '/it1/bruker/login')
|
||||
$('#login-btn').html('Login')
|
||||
}
|
||||
})
|
||||
|
||||
for (var i = 0; i < $('#navbar').children().length; i++) {
|
||||
$('#navbar').children().css('color', 'springgreen')
|
||||
}
|
||||
|
||||
@ -1,4 +1,13 @@
|
||||
|
||||
body {
|
||||
background-color: rgb(24, 26, 27);
|
||||
color: rgb(218, 215, 210);
|
||||
}
|
||||
|
||||
li.right > ul { /* TODO: FIX! */
|
||||
align-content: right;
|
||||
}
|
||||
|
||||
#oppgaver {
|
||||
margin-left: 3vh;
|
||||
}
|
||||
|
||||
@ -1,28 +0,0 @@
|
||||
$('#navbar').parent().html(`
|
||||
<nav class="navbar navbar-expand-sm bg-dark navbar-dark" id="navbar">
|
||||
<a class="navbar-brand g" target="_top" href="/it1/index.html">IT1 firebase stuff</a> <!-- href="/it1/index.html" -->
|
||||
<!-- <ul class="navbar-nav">
|
||||
<li class="nav-item right">
|
||||
<a class="nav-link" target="_top" href="/it1/about.html">About</a>
|
||||
</li>
|
||||
</ul>
|
||||
<ul class="navbar-nav ml-auto">
|
||||
<li class="nav-item right">
|
||||
<a class="nav-link">Simple login here later</a>
|
||||
</li>
|
||||
<li class="nav-item right" style="visibility: hidden">
|
||||
<a class="nav-link" target="_top" href="/logout">Logout</a>
|
||||
</li>
|
||||
<li class="nav-item right" id="register-btn">
|
||||
<a class="nav-link" target="_top" href="/register">Register</a>
|
||||
</li>
|
||||
<li class="nav-item right" id="login-btn">
|
||||
<a class="nav-link" target="_top" href="/login">Login</a>
|
||||
</li>
|
||||
</ul> -->
|
||||
</nav>`)
|
||||
|
||||
for (var i = 0; i < $('#navbar').children().length; i++) {
|
||||
$('#navbar').children().css('color', 'green')
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user