GrelaPrzepisaneLab4

const Joi = require('joi');
const express = require('express');
const session = require('express-session');
const path = require('path');
// const EJS = require('ejs');
const cookieParser = require('cookie-parser');
const app = express();

app.set('view engine', 'ejs');
// app.set('views', './views');
app.set('views', path.join(__dirname, 'views'));

app.use(session({
    resave: true,
    saveUninitialized: true,
    secret: 'tajnyKlucz'
}));

app.use(cookieParser('tajnyKlucz'));
app.use(express.urlencoded({extended: true}));

app.use(express.static(path.join(__dirname, 'static')));

app.use(express.json());

const lista = [
    {
        id:1,
        nazwa: 'ALFA ROMEO'
    },
    {
        id:2,
        nazwa: 'AUDI'
    },
    {
        id:3,
        nazwa: 'BMW'
    },
    {
        id:4,
        nazwa: 'CITROEN'
    },
];

app.get('/', (req, res) => {
    var uzytkownikCiasteczko = req.signedCookies.uzytkownik;
    res.render('index', {
        username: 'testowy',
        uzytkownik: uzytkownikCiasteczko
    });
});

app.get('/wyloguj', (req, res) => {
   res.cookie('uzytkownik', '', {maxAge: -1});
   res.redirect('/');
});

app.get('/zaloguj', (req, res) => {
   res.render('zaloguj');
});

function authorize(req, res, next) {
    if(req.signedCookies.uzytkownik) {
        req.uzytkownik = req.signedCookies.uzytkownik;
        next();
    } else {
        res.redirect('/zaloguj?returnUrl='+req.url);
    }
}

app.post('zaloguj', (req, res) => {
    var username = req.body.txtUser;
    var password = req.body.txtPwd;

    if(username == password) {
        // ustawiamy ciasteczko
        res.cookie('uzytkownik', username, {signed: true});

        // ewentualne przekierowanie
        var returnUrl = req.query.returnUrl;
        if(returnUrl) {
            res.redirect(returnUrl);
        } else {
            res.redirect('/');
        }
    } else {
        res.render('zaloguj', {wiadomosc: 'Niepoprawna nazwa uzytkownika lub haslo'});
    }
});

app.get('/lista', authorize, (req, res) => {
    res.render('lista', {lista: lista});
});

app.get('/ciastko', (req, res) => {
    var cookieValue;
    if(!req.cookies.ciasteczko) {
        cookieValue = new Date().toString();
        res.cookie('ciasteczko', cookieValue);
    } else {
        cookieValue = req.cookies.ciasteczko;
    }
    res.render('ciastko', {cookieValue: cookieValue});
});

app.use('/podpisaneCiastko', (req, res) => {
    var cookieValue;
    if(!req.signedCookies.podpisaneCiastko) {
        cookieValue = "Podpisana Wiadomosc" + new Date().toString();
        res.cookie('signedCookies', cookieValue, {signed: true});
    } else {
        cookieValue = req.signedCookies.podpisaneCiastko;
    }
    res.render('ciastko', {cookieValue: cookieValue});
})

app.use('/sesja',(req, res) => {
    var sessionValue;
    if(!req.session.sessionValue) {
        sessionValue = `data w sesji: ${new Date()}`;
        res.session.sessionValue = sessionValue;
    } else {
        sessionValue = req.session.sessionValue;
    }
    res.render('sesja', {sessionValue: sessionValue});
})

app.get('api/lista', (req, res) => {
    res.send(lista);
})

app.get('api/lista/:id(\\d+)', (req, res) => {
    let element = lista.find(l => l.id === parseInt(req.params.id));
    if(!element) {
        res.status(404).send('Element o takim id nie istnieje');
    } else {
        res.send(element);
    }
})

app.post('api/lista',(req, res) => {
    const { error } = sprawdzElement(req.body);
    if(error) {
        res.status(400).send(error.details[0].message);
        return;
    }

    let element = {
        id: lista.length + 1,
        nazwa: req.body.nazwa
    }

    lista.push(element);
    res.send(element);
})

app.put('api/lista/:id',(req, res) => {
    let element = lista.find(l => l.id === parseInt(req.params.id));
    if(!element) {
        return res.status(404).send('Element o takim id nie istnieje');
    }
    const wynik = sprawdzElement(req.body);
    if(wynik.error) {
        return res.status(400).send(error.details[0].message);
    }

    element.nazwa = req.body.nazwa;
    res.send(element);
})

app.delete('api/lista/:id',(req, res) => {
    let element = lista.find(l => l.id === parseInt(req.params.id));
    if(!element) {
        return res.status(404).send('Element o takim id nie istnieje');
    }
    const index = lista.indexOf(element);
    lista.splice(index, 1);

    res.send(element);
})

function sprawdzElement(element) {
    const schemat = {
        nazwa: Joi.string().min(2).required()
    };
    return Joi.validate(element, schemat);
}

app.use((req, res, next) => {
    res.render('404.ejs', {url: req.url});
});

const port = process.env.PORT || 3000;
app.listen(port, ()=> console.log(`Oczekuje na porcie ${port}`));

//////////////////////////// static/style.css
body {
    padding: 20px;
    font: 14px sans-serif;
    background: aliceblue;
}
a {
    color: #00B7FF;
}
.user {
    color: blue;
}
form {
    display: flex;
    justify-content: center;
    align-items: center;
}
#login {
    padding: 20px;
    border: 1px solid black;
}
#login div {
    overflow: auto;
}
#login input {
    float: right;
}
button {
    clear: both;
}
.wiadomosc {
    color: red;
}

//////////////////////////// views/index.ejs
<!DOCTYPE html>
<html lang="pl">
<head>
    <meta charset="UTF-8">
    <title>Strona glowna</title>
</head>
<body>
    Witaj w index.ejs <br/>
    Username: <%=username %> <br/>
    <br/>
    <% if(uzytkownik) { %>
        Witaj, jestes zalogowany jako  <%=uzytkownik%>.
        <a href="/wyloguj">Wyloguj</a>
    <% } else { %>
        Kliknij <a href="/zaloguj">tutaj</a> aby sie zalogowac.
    <% } %>

    <br/>
    <br/>
    <% var zmienna = 'abc' %>
    <% for(var i=0; i<5; i++) { %>
        <div>
        Element <%= i %>
        </div>
    <% } %>
    Zmienna: <%= zmienna %>
</body>
</html>

////////////////////////////  views/lista.ejs
<!DOCTYPE html>
<html lang="pl">
<head>
    <meta charset="UTF-8">
    <title> Lista </title>
    <link rel="stylesheet" href="" />
</head>
<body>
    <table>
        <tr>
            <th> ID </th>
            <th> Nazwa </th>
            <th> Szczegoly </th>
        </tr>
        <% lista.forEach( element => { %>
        <tr>
            <td> <%= element.id %> </td>
            <td> <%= element.nazwa %> </td>
            <td><a href='/api/lista/<%= element.id %>'> Info </a></td>
        </tr>
         <% }) %>
    </table>
</body>
</html>

//////////////////////////// views/ciastko.ejs
<!DOCTYPE html>
<html lang="pl">
<head>
    <meta charset="UTF-8">
    <title>Ciastko</title>
    <link rel="stylesheet" href="" />
</head>
<body>
    Wartosc z ciastka: <br/>
    <b> <%= cookieValue %> </b><br/>
</body>
</html>

//////////////////////////// views/404.ejs
<!DOCTYPE html>
<html lang="pl">
<head>
    <meta charset="UTF-8">
    <title>Blad 404</title>
    <link rel="stylesheet" href="" />
</head>
<body>
    Strona <%= url %> nie zostala odnaleziona
</body>
</html>

//////////////////////////// views/sesja.ejs
<!DOCTYPE html>
<html lang="pl">
<head>
    <meta charset="UTF-8">
    <title>Sesja</title>
    <link rel="stylesheet" href="" />
</head>
<body>
    Wartosc z sesji: <br/>
    <b> <%= sessionValue %> </b><br/>
</body>
</html>

//////////////////////////// views/zaloguj.ejs
<!DOCTYPE html>
<html lang="pl">
<head>
    <meta charset="UTF-8">
    <title>Logowanie</title>
    <link rel="stylesheet" href="" />
</head>
<body>
    <form method="POST">
        <div id='login'>
            <div>
                <h4>Logowanie</h4>
            </div>
            <div>
                <input type="text" name="txtUser" />
                <label>Nazwa uzytkownika: </label>
            </div>
            <div>
                <input type="text" name="txtPwd" />
                <label>Haslo: </label>
            </div>
            <div>
                <button>zaloguj</button>
            </div>
            <% if(locals.wiadomosc){ %>
            <div>
                <%= locals.wiadomosc %>
            </div>
            <% } %>
        </div>
    </form>
</body>
</html>