Merge branch 'feature/clan-refresh' into feature/clan-scrape

Gruntfile.js

@@ -23,6 +23,7 @@ module.exports = function(grunt) {
   grunt.registerTask('prod', [
     'sass:dist',
     'concat:js',
-    'uglify:dist'
+    'uglify:dist',
+    'copy'
   ]);
 };

grunt/concurrent.js

@@ -1,6 +1,6 @@
 module.exports = {
 	dev: {
-		tasks: ['nodemon', 'concat', 'watch'],
+		tasks: ['nodemon', 'concat', 'watch', 'copy'],
 		options: {
 			logConcurrentOutput: true
 		}

grunt/copy.js

@@ -0,0 +1,24 @@
+module.exports = {
+    js: {
+        files:[
+            {
+                expand: true,
+                cwd: 'node_modules/simple-datatables/dist',
+                src: 'module.js',
+                dest: 'public/js/',
+                rename: function(dest, src) {
+                    return dest + 'simple-datatables.js'
+                }
+            },
+            {
+                expand: true,
+                cwd: 'node_modules/simple-datatables/dist',
+                src: 'style.css',
+                dest: 'public/styles/css/',
+                rename: function(dest, src) {
+                    return dest + 'simple-datatables.css'
+                }
+            }
+        ]
+    }
+}

lib/clan/ClanRepository.js

@@ -124,7 +124,7 @@ class ClanRepository {
             updateTime: clanRaw.updateTime,
             founder: null,
             leader: null,
-            memberships: [],
+            memberships: {},
         }
 
         let members = {};

lib/clan/ClanService.js

@@ -1,5 +1,5 @@
 const {MutexService} = require("../MutexService");
-const clanTTL = 60 * 60 
+const clanTTL = 60 * 5 
 
 class ClanService {
     constructor(cacheService, clanRepository, lockTimeout = 3000) {
@@ -14,7 +14,7 @@ class ClanService {
     }
 
     async getClan(id) {
-        return await this.clanRepository.fetchClan(id)
+        return this.clanRepository.fetchClan(id)
     }
 
     async getAll() {

package.json

@@ -11,6 +11,7 @@
     "express": "^4.18.1",
     "express-session": "^1.17.3",
     "express-validator": "7.0.1",
+    "grunt-contrib-copy": "^1.0.0",
     "moment": "^2.29.4",
     "node-cache": "^5.1.2",
     "node-fetch": "^2.6.7",
@@ -21,6 +22,7 @@
     "request": "2.88.2",
     "session-file-store": "^1.5.0",
     "showdown": "^2.1.0",
+    "simple-datatables": "^8.0.1",
     "supertest-session": "^5.0.1",
     "url-slug": "^4.0.1"
   },

public/js/app/clan.js

@@ -1,5 +1,5 @@
-(async() => {
-    new window.simpleDatatables.DataTable("#clan-members", {
+import('/js/simple-datatables.js').then(({DataTable}) => {
+    new DataTable("#clan-members", {
         perPageSelect: null
     })
-})()
+})

public/js/app/clans.js

@@ -1,12 +1,12 @@
-(async() => {
+import('/js/simple-datatables.js').then(({DataTable}) => {
     fetch('/data/clans.json')
         .then(response => response.json())
         .then(data => {
             if (!data || !data.length) {
                 return
             }
 
-            window.datatable = new window.simpleDatatables.DataTable("#clan-table", {
+            window.datatable = new DataTable("#clan-table", {
                 perPageSelect: null,
                 data: {
                     headings: [
@@ -30,7 +30,8 @@
         .catch((err) => {
             console.log(err, 'loading clans failed')
         })
-})()
+})
+
 
 
 

public/styles/site/clans.sass

@@ -33,195 +33,3 @@
     tbody
         td
             text-align: left
-// Background of the whole thing
-.clanBackground
-  padding: 7.5vw 11vw
-  background-image: url("/../../images/fafbgpattern0.5.jpg")
-  ul
-    list-style: none
-    li
-      padding: 0.5em 0
-
-// This is the searchbar input form
-input 
-  margin: 1em 1em 2px 1em
-  background-color: variables.$background-tertiary
-  color: variables.$color-active
-  font-size: var(--paragraph-font-size)
-  border: 0.5em solid variables.$background-secondary
-  border-radius: 10px
-  z-index: 2
-  position: relative
-
-
-
-// The main box with all the names, tags, ranks, etc.
-.mainClanContainer
-  @include mixins.gridMainContainer
-  padding: 0
-  p
-    padding: 0.2em
-
-.clanContainer
-  font-family: variables.$family-paragraph
-  padding: 0em
-  .clanItem
-
-    ul
-      font-size: var(--paragraph-font-size)
-      padding: 1em 0
-      font-weight: 700
-
-    // ACTUAL LISTS
-    // There is a double li element here because the js creates a li parent element and then puts another li child element (which the child is all the names you see like ANZ and so on)
-    li
-      list-style: none
-      font-weight: normal
-      padding: 0em 0
-      li
-        font-size: var(--paragraph-font-size)
-        padding: 1em 0
-
-.clanBorder
-  border: 1px solid variables.$color-active
-  padding: 0px
-  background-color: variables.$background-primary
-
-// Change background colors on items in the leaderboard
-.clanItem
-  li:nth-child(odd)
-    background-color: mix(variables.$background-tertiary, variables.$background-primary, 25%)
-  li:nth-child(even)
-    background-color: variables.$background-secondary
-
-// First page last page, etc
-.clanButton
-  padding: 1em 0.25em
-  display: inline-block
-  place-items: start
-  font-family: variables.$family-paragraph
-  font-size: var(--paragraph-font-size)
-  letter-spacing: 0em
-  ul
-    padding: 0.5em
-    font-weight: 900
-    li
-
-      display: inline-block
-      padding: 0.6em 1em
-      border: 0.05em solid variables.$color-inactive
-      background-color: variables.$background-tertiary
-      cursor: pointer
-      transition: 0.4s
-      &:hover
-        border: 0.05em solid variables.$color-active
-        filter: brightness(2)
-    .exhaustedButton
-      border: 0.05em solid variables.$color-inactive
-      background-color: variables.$background-secondary
-      color: variables.$color-inactive-plus
-      pointer-events: none
-      cursor: default
-
-#searchResults
-  margin: 1em 0 0 0
-.appearWhenSearching
-  display: none
-.centerYourself
-  display: grid
-  justify-items: center
-  position: relative
-
-.searchBar
-  ul
-    background-color: variables.$background-secondary
-    color: variables.$color-inactive
-    font-size: calc(var(--paragraph-font-size) * 0.9)
-    border-radius:  0  0 10px 10px
-    text-align: left
-    li
-      padding: 0.5em 1em
-
-.clearButton
-  li
-    cursor: pointer
-    margin: 1em 1em 0 1em
-    border-radius: 10px
-    background-color: variables.$background-tertiary
-    color: variables.$color-inactive
-    transition: 0.4s
-    &:hover
-      background-color: variables.$color-inactive-plus
-      color: variables.$color-active
-  .fa-trash-alt
-    padding: 0.5em
-
-@media (max-width: 800px)
-  .clanFilter
-    font-size: 10px
-  .clanContainer
-    ul
-      font-size: 10px
-      padding: 1em 0 0 0
-
-      li
-        text-overflow: ellipsis
-        font-size: 10px
-        padding: 1em 0
-
-  .clearButton
-    left: 90%
-    top: 68%
-  .clanBackground
-    padding: 1vw
-  .clanButton
-    padding: 1vw
-    font-size: var(--paragraph-font-size)
-    ul
-      li
-        padding: 0.65em
-  .clanDelete
-    font-size: 10px
-
-
-@media (max-width: 1600px)
-  .clanContainer
-    ul
-      font-size: 14px
-      li
-        font-size: 14px
-  .clanFilter
-    font-size: 14px
-
-
-
-// Below are classes that depend 
-.clanManagement
-  @include mixins.gridMainContainer
-  padding: 0vw 15vw
-  margin: 1em 0 
-  .clanManagementItem
-    padding: 1.5em 0
-    display: inline-block
-    justify-self: center
-    align-self: center
-
-    //clan Description
-    textarea
-      width: 40vw
-
-  .clanManagementTable
-    padding: 1.5em
-    display: inline-block
-    justify-self: center
-    align-self: center
-    th
-      padding: 4em
-
-@media (max-width: 800px)
-  .clanManagement
-    padding: 5px
-.bigButton
-  font-size: 1.25em
-
-

routes/views/clanRouter.js

@@ -2,6 +2,16 @@ const express = require('express')
 const router = express.Router()
 const middlewares = require('../middleware')
 
+router.get('/', middlewares.isAuthenticated(), (req, res) => res.render('clans/clans'))
+router.get('/view/:id', middlewares.isAuthenticated(), async (req, res) => {
+    const clanId = parseInt(req.params.id || null)
+    if (!clanId) {
+        return res.redirect('/clans')
+    }
+
+    return res.render('clans/clan', {clan: await req.services.clanService.getClan(clanId)})
+})
+
 // router.get('/create', middlewares.isAuthenticated(), require('./clans/get/create'))
 // router.get('/manage', middlewares.isAuthenticated(), require('./clans/get/manage'))
 // router.get('/accept_invite', middlewares.isAuthenticated(), require('./clans/get/accept_invite'))
@@ -14,7 +24,6 @@ const middlewares = require('../middleware')
 // router.post('/leave', middlewares.isAuthenticated(), require('./clans/post/leave'))
 // router.post('/join', middlewares.isAuthenticated(), require('./clans/post/join'))
 
-router.get('/', middlewares.isAuthenticated(), (req, res) => res.render('clans/clans'))
-router.get('/view/:id', middlewares.isAuthenticated(), require('./clans/get/clan'))
 router.get('*',  (req, res) =>  res.status(503).render('errors/503-known-issue'));
+
 module.exports = router

templates/views/clans/clan.pug

@@ -1,14 +1,11 @@
 extends ../../layouts/default
-block bannerMixin
 block head
-    link(rel='stylesheet' href='https://cdn.jsdelivr.net/npm/simple-datatables@latest/dist/style.css')
+    link(rel='stylesheet' href='/styles/css/simple-datatables.css')
 block content
-
     #clan-view
         a(href="/clans") <- OVERVIEW
         <br />
         <br />
-        <br />
         .gridMainContainer
             .column4
                 table#clan-info
@@ -48,5 +45,4 @@ block content
                                 td #{member.name}
                                 td #{member.joinedAt}
 block js
-    script( src="https://cdn.jsdelivr.net/npm/simple-datatables@latest")
-    script( src="../../js/app/clan.js")
+    script( src="../../js/app/clan.js" type="module")

templates/views/clans/clans.pug

@@ -1,15 +1,9 @@
 extends ../../layouts/default
-include ../../mixins/new-flash-messages
-block bannerMixin
 
 block head
-    link(rel='stylesheet' href='https://cdn.jsdelivr.net/npm/simple-datatables@latest/dist/style.css')
+    link(rel='stylesheet' href='/styles/css/simple-datatables.css')
 block content
     h1 Clans
     table#clan-table
-
 block js
-
-  script( src="https://cdn.jsdelivr.net/npm/simple-datatables@latest")
-  script( src="../../js/app/clans.js")
-
+  script( src="../../js/app/clans.js" type="module")