var express = require('express')
var router = express.Router()
var settings = require('../settings')
var session = require('express-session')
const MongoStore = require('connect-mongo')
require('dotenv').config()

router.use(session({
  secret: process.env.SECRET_KEY,
  resave: false,
  saveUninitialized: false,
  store: MongoStore.create({ mongoUrl: process.env.DATABASE_URI })
}))
  
router.get('/', async function(req, res, next) {
  settings.dLogo = 'ទំព័រ​គ្រប់គ្រង'
  settings.message = ''

  if(req.session.user){
    res.render('users/index', settings)
  }else{
    res.render('login', settings)
  }
})

router.post('/', async function(req, res, next){
  const checkUser = require('../controllers/users/checkUser')
  const result = await checkUser(req)
  settings.message = result.message

  if(result.success){
    res.render('users/index', settings)
  }else{
    res.render('login', settings)
  }

})

router.get('/logout', async function(req, res, next) {
  req.session.destroy(function(err) {
      console.log('Session was destroyed')
   })
  res.redirect('/')
})

router.get('/post', async function(req, res, next) {
  settings.dLogo = 'ទំព័រ​ការផ្សាយ'

  if(req.session.user){
    res.render('users/post', settings)
  }else{
    res.redirect('/login')
  }
})

router.get('/category', async function(req, res, next) {
  if(req.session.user){
    settings.dLogo = 'ទំព័រ​ជំពូក'

    const today = new Date()
    const date = today.toLocaleDateString('fr-CA')
    const time = today.toLocaleTimeString('it-IT')
    settings.datetime = date + 'T' +  time

    const count = await require('../controllers/categories/count')()
    settings.message = `ចំនួន​ជំពូក​សរុបៈ ${count}`
    settings.route = 'category'
    settings.items = await require('../controllers/categories/read')(settings.dItemLimit)

    res.render('users/category', settings)
  }else{
    res.redirect('/login')
  }
}) 

router.post('/category', async function(req, res, next){
  if(req.session.user){
    if(req.session.user.role === 'Admin'){
      await require('../controllers/categories/create')(req)
    }

    res.redirect('/users/category')

  }else{
    res.redirect('/login')
  }
})

module.exports = router

<link href="/styles/users/partials/listing.css" rel="stylesheet"></link>

<section class='List region'>
    <div class='info'><%= message %></div>

    <div class='item-wrapper'>
        <% for(let v in items){ %>
        <div class='item'>
            <div class='thumb'>
                <a href='/<%= route %>/<%= items[v].id %>'><img src='<%- items[v].thumb %>' /></a>
            </div>

            <div class='title-date'>
                <a class='title' href='/<%= route %>/<%= items[v].id %>'><%= items[v].label %></a>
                <div><%= items[v].date.toLocaleDateString() %></div>
            </div>

            <div class='edit-delete'>
                <a href='/users/<%= route %>/edit/<%= items[v].id %>'>
                    <img src='/images/edit.png' />
                </a>
                <a href='/users/<%= route %>/delete/<%= items[v].id %>'>
                    <img src='/images/delete.png' />
                </a>
            </div>
        </div> 
        <% } %>
    </div>
 
</section>

.List{
    margin-top: 30px;
}

.List .info{
    text-align: center;
    background: var(--background-light);
    padding: 10px;
    color: black;
    margin-bottom: 10px;
}

.List .item-wrapper{
    display: grid;
    grid-template-columns: calc(50% - 5px) calc(50% - 5px);
    grid-gap: 10px;
}

.List .item{
    display: grid;
    grid-template-columns: 20% auto 20%;
    grid-gap: 10px;
    align-items: center;
    background: var(--background-light);
}

.List .item .thumb{
    position: relative;
    padding-top: 56.25%
}

.List .item .thumb img{
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

.List .item .title-date, .List .item .title-date a{
    color: black;
}

.List .item .edit-delete{
    text-align: right;
    padding-right: 10px;
    visibility: hidden;
}

.List .item .edit-delete img{
    width: 35px;
}

.List .item:hover .edit-delete{
    visibility: visible;
}

GitHub: https://github.com/Sokhavuth/tv

Vercel: https://tv-neon.vercel.app

Responsive: http://www.responsinator.com