From 5620419d0508bdbd727178a238e700125f938910 Mon Sep 17 00:00:00 2001
From: Nicolas Giard <github@ngpixel.com>
Date: Sun, 5 Aug 2018 23:03:46 -0400
Subject: [PATCH] feat: view page layout (wip) + footer component + fixes

---
 client/app.js                           |  1 +
 client/components/admin.vue             | 24 +--------
 client/components/common/nav-footer.vue | 35 +++++++++++++
 client/components/profile.vue           | 20 +-------
 client/store/site.js                    |  1 +
 server/controllers/common.js            | 14 +++++-
 server/core/config.js                   | 11 ++++-
 server/core/kernel.js                   |  7 ++-
 server/setup.js                         |  6 +++
 server/views/main/admin.pug             |  5 +-
 themes/default/views/page.pug           | 65 +++++++++++++++++++++++++
 11 files changed, 139 insertions(+), 50 deletions(-)
 create mode 100644 client/components/common/nav-footer.vue
 create mode 100644 themes/default/views/page.pug

diff --git a/client/app.js b/client/app.js
index e2984492..e81002bc 100644
--- a/client/app.js
+++ b/client/app.js
@@ -110,6 +110,7 @@ Vue.prototype.Velocity = Velocity
 Vue.component('admin', () => import(/* webpackChunkName: "admin" */ './components/admin.vue'))
 Vue.component('editor', () => import(/* webpackChunkName: "editor" */ './components/editor.vue'))
 Vue.component('login', () => import(/* webpackMode: "eager" */ './components/login.vue'))
+Vue.component('nav-footer', () => import(/* webpackMode: "eager" */ './components/common/nav-footer.vue'))
 Vue.component('nav-header', () => import(/* webpackMode: "eager" */ './components/common/nav-header.vue'))
 Vue.component('profile', () => import(/* webpackChunkName: "profile" */ './components/profile.vue'))
 Vue.component('setup', () => import(/* webpackChunkName: "setup" */ './components/setup.vue'))
diff --git a/client/components/admin.vue b/client/components/admin.vue
index cc4dea76..d8ccea6d 100644
--- a/client/components/admin.vue
+++ b/client/components/admin.vue
@@ -75,26 +75,11 @@
       transition(name='admin-router')
         router-view
 
-    v-footer.py-2.justify-center(app, absolute, :color='darkMode ? "" : "grey lighten-3"', inset, height='auto')
-      .caption.grey--text.text--darken-1
-        span(v-if='company && company.length > 0') {{ $t('common:footer.copyright', { company: company, year: currentYear }) }} |&nbsp;
-        span {{ $t('common:footer.poweredBy') }} Wiki.js
-
-    v-snackbar(
-      :color='notification.style'
-      bottom,
-      right,
-      multi-line,
-      v-model='notificationState'
-    )
-      .text-xs-left
-        v-icon.mr-3(dark) {{ notification.icon }}
-        span {{ notification.message }}
+    nav-footer
 </template>
 
 <script>
 import VueRouter from 'vue-router'
-import { get, sync } from 'vuex-pathify'
 
 import adminStore from '@/store/admin'
 
@@ -133,16 +118,9 @@ export default {
   i18nOptions: { namespaces: 'admin' },
   data() {
     return {
-      currentYear: (new Date()).getFullYear(),
       adminDrawerShown: true
     }
   },
-  computed: {
-    company: get('site/company'),
-    notification: get('notification'),
-    darkMode: get('admin/theme@dark'),
-    notificationState: sync('notification@isActive')
-  },
   router
 }
 </script>
diff --git a/client/components/common/nav-footer.vue b/client/components/common/nav-footer.vue
new file mode 100644
index 00000000..4cd41032
--- /dev/null
+++ b/client/components/common/nav-footer.vue
@@ -0,0 +1,35 @@
+<template lang="pug">
+  v-footer.py-2.justify-center(app, absolute, :color='darkMode ? "" : "grey lighten-3"', inset, height='auto')
+    .caption.grey--text.text--darken-1
+      span(v-if='company && company.length > 0') {{ $t('common:footer.copyright', { company: company, year: currentYear }) }} |&nbsp;
+      span {{ $t('common:footer.poweredBy') }} Wiki.js
+
+    v-snackbar(
+      :color='notification.style'
+      bottom,
+      right,
+      multi-line,
+      v-model='notificationState'
+    )
+      .text-xs-left
+        v-icon.mr-3(dark) {{ notification.icon }}
+        span {{ notification.message }}
+</template>
+
+<script>
+import { get, sync } from 'vuex-pathify'
+
+export default {
+  data() {
+    return {
+      currentYear: (new Date()).getFullYear()
+    }
+  },
+  computed: {
+    company: get('site/company'),
+    notification: get('notification'),
+    darkMode: get('site/dark'),
+    notificationState: sync('notification@isActive')
+  }
+}
+</script>
diff --git a/client/components/profile.vue b/client/components/profile.vue
index adf5be53..0ac591e5 100644
--- a/client/components/profile.vue
+++ b/client/components/profile.vue
@@ -22,24 +22,11 @@
       transition(name='profile-router')
         router-view
 
-    v-footer.py-2.justify-center(app, absolute, :color='darkMode ? "" : "grey lighten-3"', inset, height='auto')
-      .caption.grey--text.text--darken-1 Powered by Wiki.js
-
-    v-snackbar(
-      :color='notification.style'
-      bottom,
-      right,
-      multi-line,
-      v-model='notificationState'
-    )
-      .text-xs-left
-        v-icon.mr-3(dark) {{ notification.icon }}
-        span {{ notification.message }}
+    nav-footer
 </template>
 
 <script>
 import VueRouter from 'vue-router'
-import { mapState } from 'vuex'
 
 /* global WIKI, siteConfig */
 
@@ -71,11 +58,6 @@ export default {
     }
   },
   computed: {
-    ...mapState(['notification']),
-    notificationState: {
-      get() { return this.notification.isActive },
-      set(newState) { this.$store.commit('updateNotificationState', newState) }
-    },
     darkMode() { return siteConfig.darkMode }
   },
   router
diff --git a/client/store/site.js b/client/store/site.js
index 12b536f3..f670d6b4 100644
--- a/client/store/site.js
+++ b/client/store/site.js
@@ -4,6 +4,7 @@ import { make } from 'vuex-pathify'
 
 const state = {
   company: '',
+  dark: false,
   mascot: true,
   title: siteConfig.title
 }
diff --git a/server/controllers/common.js b/server/controllers/common.js
index c941cd9b..a207cea6 100644
--- a/server/controllers/common.js
+++ b/server/controllers/common.js
@@ -1,5 +1,8 @@
 const express = require('express')
 const router = express.Router()
+const path = require('path')
+
+/* global WIKI */
 
 /**
  * Create/Edit document
@@ -25,8 +28,17 @@ router.get(['/p', '/p/*'], (req, res, next) => {
 /**
  * View document
  */
-router.get('/*', (req, res, next) => {
+router.get('/', (req, res, next) => {
   res.render('main/welcome')
 })
 
+/**
+ * View document
+ */
+router.get('/*', (req, res, next) => {
+  res.render(path.join(WIKI.ROOTPATH, 'themes/default/views/page'), {
+    basedir: path.join(WIKI.SERVERPATH, 'views')
+  })
+})
+
 module.exports = router
diff --git a/server/core/config.js b/server/core/config.js
index 29640392..3aeb4b87 100644
--- a/server/core/config.js
+++ b/server/core/config.js
@@ -1,4 +1,5 @@
 const _ = require('lodash')
+const chalk = require('chalk')
 const cfgHelper = require('../helpers/config')
 const fs = require('fs')
 const path = require('path')
@@ -17,6 +18,8 @@ module.exports = {
       dataRegex: path.join(WIKI.SERVERPATH, 'app/regex.js')
     }
 
+    process.stdout.write(chalk.blue(`Loading configuration from ${confPaths.config}... `))
+
     let appconfig = {}
     let appdata = {}
 
@@ -28,8 +31,12 @@ module.exports = {
       )
       appdata = yaml.safeLoad(fs.readFileSync(confPaths.data, 'utf8'))
       appdata.regex = require(confPaths.dataRegex)
-    } catch (ex) {
-      console.error(ex)
+      console.info(chalk.green.bold(`OK`))
+    } catch (err) {
+      console.error(chalk.red.bold(`FAILED`))
+      console.error(err.message)
+
+      console.error(chalk.red.bold(`>>> Unable to read configuration file! Did you create the config.yml file?`))
       process.exit(1)
     }
 
diff --git a/server/core/kernel.js b/server/core/kernel.js
index 31d36ee1..e3d55a42 100644
--- a/server/core/kernel.js
+++ b/server/core/kernel.js
@@ -1,9 +1,11 @@
+const _ = require('lodash')
+
 /* global WIKI */
 
 module.exports = {
   async init() {
     WIKI.logger.info('=======================================')
-    WIKI.logger.info('= Wiki.js =============================')
+    WIKI.logger.info(`= Wiki.js ${_.padEnd(WIKI.version + ' ', 29, '=')}`)
     WIKI.logger.info('=======================================')
 
     WIKI.models = require('./db').init()
@@ -48,8 +50,9 @@ module.exports = {
    */
   async postBootMaster() {
     await WIKI.models.authentication.refreshStrategiesFromDisk()
-    await WIKI.auth.activateStrategies()
     await WIKI.models.storage.refreshTargetsFromDisk()
+
+    await WIKI.auth.activateStrategies()
     await WIKI.queue.start()
   }
 }
diff --git a/server/setup.js b/server/setup.js
index 79133dd7..a6709fd1 100644
--- a/server/setup.js
+++ b/server/setup.js
@@ -270,6 +270,12 @@ module.exports = () => {
       confRaw = yaml.safeDump(conf)
       await fs.writeFileAsync(path.join(WIKI.ROOTPATH, 'config.yml'), confRaw)
 
+      // Create directory structure
+      await fs.ensureDir(conf.paths.data)
+      await fs.ensureDir(path.join(conf.paths.data, 'cache'))
+      await fs.ensureDir(path.join(conf.paths.data, 'temp-upload'))
+      await fs.ensureDir(conf.paths.content)
+
       // Set config
       _.set(WIKI.config, 'defaultEditor', 'markdown')
       _.set(WIKI.config, 'graphEndpoint', 'https://graph.requarks.io')
diff --git a/server/views/main/admin.pug b/server/views/main/admin.pug
index 2ec208d3..a927c27f 100644
--- a/server/views/main/admin.pug
+++ b/server/views/main/admin.pug
@@ -1,6 +1,5 @@
 extends ../master.pug
 
 block body
-  body
-    #app
-      admin
+  #app
+    admin
diff --git a/themes/default/views/page.pug b/themes/default/views/page.pug
new file mode 100644
index 00000000..f58536fd
--- /dev/null
+++ b/themes/default/views/page.pug
@@ -0,0 +1,65 @@
+extends /master.pug
+
+block head
+
+block body
+  #app
+    v-app
+      nav-header
+      v-navigation-drawer.pb-0.primary(dark, app, fixed, clipped, left, permanent)
+        v-list(dense)
+          v-list-tile.pt-2
+            v-list-tile-avatar: v-icon home
+            v-list-tile-title Home
+          v-divider.my-2
+          v-subheader.pl-4 Navigation
+          v-list-tile
+            v-list-tile-avatar: v-icon stars
+            v-list-tile-title The Universe
+
+      v-content
+        v-toolbar(color='grey lighten-3', flat, dense)
+          v-breadcrumbs.pl-0(divider='/')
+            v-breadcrumbs-item Universe
+            v-breadcrumbs-item Galaxy
+            v-breadcrumbs-item Solar System
+            v-breadcrumbs-item Planet Earth
+        
+        v-divider
+        v-layout(row)
+          v-flex(xs10)
+            v-toolbar(color='grey lighten-4', flat, :height='90')
+              div
+                .headline.grey--text.text--darken-3 Planet Earth
+                .caption.grey--text.text--darken-1 The 3rd planet of the solar system
+              v-spacer
+              v-icon public
+
+            .pa-3 Earth is the third planet from the Sun and the only astronomical object known to harbor life. According to radiometric dating and other sources of evidence, Earth formed over 4.5 billion years ago.[24][25][26] Earth's gravity interacts with other objects in space, especially the Sun and the Moon, Earth's only natural satellite. Earth revolves around the Sun in 365.26 days, a period known as an Earth year. During this time, Earth rotates about its axis about 366.26 times.[n 5]
+            .pa-3 Earth's axis of rotation is tilted with respect to its orbital plane, producing seasons on Earth.[27] The gravitational interaction between Earth and the Moon causes ocean tides, stabilizes Earth's orientation on its axis, and gradually slows its rotation.[28] Earth is the densest planet in the Solar System and the largest of the four terrestrial planets.
+            .pa-3 Earth's lithosphere is divided into several rigid tectonic plates that migrate across the surface over periods of many millions of years. About 71% of Earth's surface is covered with water, mostly by oceans.[29] The remaining 29% is land consisting of continents and islands that together have many lakes, rivers and other sources of water that contribute to the hydrosphere. The majority of Earth's polar regions are covered in ice, including the Antarctic ice sheet and the sea ice of the Arctic ice pack. Earth's interior remains active with a solid iron inner core, a liquid outer core that generates the Earth's magnetic field, and a convecting mantle that drives plate tectonics.
+            .pa-3 Within the first billion years of Earth's history, life appeared in the oceans and began to affect the Earth's atmosphere and surface, leading to the proliferation of aerobic and anaerobic organisms. Some geological evidence indicates that life may have arisen as much as 4.1 billion years ago. Since then, the combination of Earth's distance from the Sun, physical properties, and geological history have allowed life to evolve and thrive.[30][31] In the history of the Earth, biodiversity has gone through long periods of expansion, occasionally punctuated by mass extinction events. Over 99% of all species[32] that ever lived on Earth are extinct.[33][34] Estimates of the number of species on Earth today vary widely;[35][36][37] most species have not been described.[38] Over 7.6 billion humans live on Earth and depend on its biosphere and natural resources for their survival.[39] Humans have developed diverse societies and cultures; politically, the world has about 200 sovereign states.
+          v-flex(xs2, fill-height)
+            v-list.grey.lighten-3(dense)
+              v-subheader.pl-4 Table of contents
+              v-list-tile
+                v-list-tile-avatar: v-icon chevron_right
+                v-list-tile-title Test
+              v-list-tile
+                v-list-tile-avatar: v-icon chevron_right
+                v-list-tile-title Test
+              v-list-tile
+                v-list-tile-avatar: v-icon chevron_right
+                v-list-tile-title Test
+              v-divider.my-2
+              v-subheader.pl-4 Metadata
+              v-list-tile
+                v-list-tile-avatar: v-icon chevron_right
+                v-list-tile-title Test
+              v-list-tile
+                v-list-tile-avatar: v-icon chevron_right
+                v-list-tile-title Test
+              v-list-tile
+                v-list-tile-avatar: v-icon chevron_right
+                v-list-tile-title Test
+      nav-footer