<link href="/styles/users/partials/listing.css" rel="stylesheet"></link>
<script src='/scripts/users/paginate.js'></script>

<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>

    <div class='paginate'>
        <a onClick='paginate("<%= route %>")'><img src='/images/load-more.png' /></div></a>
    </div>
 
</section>

var page = 0

function paginate(route){
    $('.paginate img').attr('src', '/images/loading.gif')
    page += 1

    $.post(`/users/${route}/paginate`, {page: page}, function(data, status){
        appendItem(data.items, route)
    })
}

function appendItem(items, route){
    var html = ''

    for(let v in items){
        html += `<div class='item'>`
        html += `<div class='thumb'>`
        html += `<a href='/${ route }/${ items[v].id }'><img src='${ items[v].thumb }' /></a>`
        html += `</div>`

        html += `<div class='title-date'>`
        html += `<a class='title' href='/${ route }/${ items[v].id }'>${ items[v].label }</a>`
        html += `<div>${ (new Date(items[v].date)).toLocaleDateString() }</div>`
        html += `</div>`

        html += `<div class='edit-delete'>`
        html += `<a href='/users/${ route }/edit/${ items[v].id }'>`
        html += `<img src='/images/edit.png' />`
        html += `</a>`
        html += `<a href='/users/${ route }/delete/${ items[v].id }'>`
        html += `<img src='/images/delete.png' />`
        html += `</a>`
        html += `</div>`
        html += `</div>` 
    }
    
    $('.paginate img').attr('src', '/images/load-more.png')
    $('.item-wrapper').append(html)

}

var express = require('express')
var router = express.Router()
var settings = require('../../settings')



router.get('/', 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('/users')
  }
}) 

router.post('/', 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('/users')
  }
})

router.get('/edit/:id', async function(req, res, next){
  if(req.session.user){
    if(req.session.user.role === 'Admin'){
      settings.dLogo = 'ទំព័រ​កែប្រែ​ជំពូក'
      
      const category = await require('../../controllers/categories/read')(false, req.params.id)

      const date = category.date.toLocaleDateString('fr-CA')
      const time = category.date.toLocaleTimeString('it-IT')
      settings.datetime = date + 'T' +  time
      settings.category = category
      settings.route = 'category'
    }

    res.render('users/edit_category', settings)

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

router.post('/edit/:id', async function(req, res, next){
  if(req.session.user){
    if(req.session.user.role === 'Admin'){
      settings.dLogo = 'ទំព័រ​កែប្រែ​ជំពូក'
      
      const category = await require('../../controllers/categories/update')(req)

      const date = category.date.toLocaleDateString('fr-CA')
      const time = category.date.toLocaleTimeString('it-IT')
      settings.datetime = date + 'T' +  time
      settings.category = category
      settings.route = 'category'
    }

    res.render('users/edit_category', settings)

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

router.get('/delete/:id', async function(req, res, next){
  if(req.session.user){
    if(req.session.user.role === 'Admin'){
      await require('../../controllers/categories/delete')(req)
    }

    res.redirect('/users/category')

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

router.post('/paginate', async function(req, res, next){
  if(req.session.user){
    const read = await require('../../controllers/categories/read')
    const categories = await read(settings.dItemLimit, false, req.body.page)
    console.log(categories)
    res.json({items: categories})
  }else{
    res.redirect('/users')
  }
})



module.exports = router

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

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

Responsive: http://www.responsinator.com