feat: admin rendering UI + contribute i18n

client/components/admin/admin-contribute.vue

@@ -1,52 +1,43 @@
 <template lang='pug'>
   v-card(flat)
     v-card(flat, tile, :color='$vuetify.dark ? "grey darken-4" : "grey lighten-5"').pa-3.pt-4
-      .headline.primary--text Contribute
-      .subheading.grey--text Help support Wiki.js development and operations
+      .headline.primary--text {{ $t('admin:contribute.title') }}
+      .subheading.grey--text {{ $t('admin:contribute.subtitle') }}
     v-card.pa-3
-      .body-1.pl-3 Wiki.js is a #[strong free and open-source software] brought to you with #[v-icon(color='red') favorite] by #[a(href='https://requarks.io', target='_blank') requarks.io] and #[a(href='https://github.com/Requarks/wiki/graphs/contributors', target='_blank') contributors].
-      .body-1.pt-3.pl-3 We need your help to keep improving the software and run the various associated services (e.g. hosting and networking).
+      i18next.body-1.pl-3(path='admin:contribute.openSource', tag='div')
+        v-icon(color='red') favorite
+        a(href='https://requarks.io', target='_blank') requarks.io
+        a(href='https://github.com/Requarks/wiki/graphs/contributors', target='_blank') {{ $t('admin:contribute.openSourceContributors') }}
+      .body-1.pt-3.pl-3 {{ $t('admin:contribute.needYourHelp') }}
       v-divider
-      v-subheader Fund our work
-      .body-1.pl-3 Wiki.js is part of the Open Collective initiative. You can contribute financially by making a monthly or one-time donation:
+      v-subheader {{ $t('admin:contribute.fundOurWork') }}
+      .body-1.pl-3 {{ $t('admin:contribute.openCollective') }}
       v-card-actions.mt-3.ml-2
         v-btn(depressed, color='primary', href='https://opencollective.com/wikijs')
           v-icon(left) local_atm
-          | Make a donation
+          span {{ $t('admin:contribute.makeADonation') }}
       v-divider
-      v-subheader Contribute
+      v-subheader {{ $t('admin:contribute.contribute') }}
       .body-1.pl-3
         ul
-          li Submit an idea or vote on a proposed one on the #[a(href='https://requests.requarks.io/wiki', target='_blank') feature requests board].
-          li Found a bug? Submit an issue on #[a(href='https://github.com/Requarks/wiki/issues', target='_blank') Github].
-          li Help translate Wiki.js in your language. Let us know on #[a(href='https://gitter.im/Requarks/wiki', target='_blank') Gitter].
+          i18next(path='admin:contribute.submitAnIdea', tag='li')
+            a(href='https://requests.requarks.io/wiki', target='_blank') {{ $t('admin:contribute.submitAnIdeaLink') }}
+          i18next(path='admin:contribute.foundABug', tag='li')
+            a(href='https://github.com/Requarks/wiki/issues', target='_blank') Github
+          i18next(path='admin:contribute.helpTranslate', tag='li')
+            a(href='https://gitter.im/Requarks/wiki', target='_blank') Gitter
       v-divider
-      v-subheader Spread the word
+      v-subheader {{ $t('admin:contribute.spreadTheWord') }}
       .body-1.pl-3
         ul
-          li Talk to your friends and colleagues about how awesome Wiki.js is!
-          li Follow us on #[a(href='https://twitter.com/requarks', target='_blank') Twitter].
+          li {{ $t('admin:contribute.talkToFriends') }}
+          i18next(path='admin:contribute.followUsOnTwitter', tag='li')
+            a(href='https://twitter.com/requarks', target='_blank') Twitter
 
 </template>
 
 <script>
-import IconGithubCircle from 'mdi/github-circle'
-
 export default {
-  components: {
-    IconGithubCircle
-  },
-  data() {
-    return {
-      tab: '0',
-      telemetry: true
-    }
-  },
-  methods: {
-    resetClientID() {
-
-    }
-  }
 }
 </script>
 

client/components/admin/admin-rendering.vue

@@ -1,15 +1,212 @@
 <template lang='pug'>
-  v-container(fluid, fill-height)
+  v-container(fluid, fill-height, grid-list-lg)
     v-layout(row wrap)
       v-flex(xs12)
         .headline.primary--text Rendering
         .subheading.grey--text Configure how content is rendered
+        v-layout.mt-3(row wrap)
+          v-flex(lg3 xs12)
+            v-card
+              v-toolbar(
+                color='primary'
+                dense
+                flat
+                dark
+                )
+                v-icon.mr-2 line_weight
+                .subheading Pipeline
+              v-toolbar(
+                color='blue'
+                dense
+                dark
+                )
+                v-icon.mr-2 arrow_downward
+                .body-2 Markdown
+                v-spacer
+                v-btn(
+                  icon
+                  @click=''
+                  )
+                  v-icon add
+              v-list(two-line, dense)
+                v-list-tile(avatar)
+                  v-list-tile-avatar
+                    v-icon(color='grey') crop_free
+                  v-list-tile-content
+                    v-list-tile-title Core
+                    v-list-tile-sub-title Basic Markdown parser
+                  v-list-tile-avatar
+                    v-icon(color='green', small) lens
+                v-divider.my-0
+                v-list-tile(avatar)
+                  v-list-tile-avatar
+                    v-icon(color='grey') tag_faces
+                  v-list-tile-content
+                    v-list-tile-title Emoji
+                    v-list-tile-sub-title Convert tags to emojis
+                  v-list-tile-avatar
+                    v-icon(color='green', small) lens
+                v-divider.my-0
+                v-list-tile(avatar)
+                  v-list-tile-avatar
+                    v-icon(color='grey') list
+                  v-list-tile-content
+                    v-list-tile-title Task Lists
+                    v-list-tile-sub-title Parse task lists to checkboxes
+                  v-list-tile-avatar
+                    v-icon(color='green', small) lens
+                v-divider.my-0
+                v-list-tile(avatar)
+                  v-list-tile-avatar
+                    v-icon(color='grey') multiline_chart
+                  v-list-tile-content
+                    v-list-tile-title PlantUML
+                    v-list-tile-sub-title Generate diagrams from PlantUML syntax
+                  v-list-tile-avatar
+                    v-icon(color='green', small) lens
+                v-divider.my-0
+                v-list-tile(avatar)
+                  v-list-tile-avatar
+                    v-icon(color='grey') merge_type
+                  v-list-tile-content
+                    v-list-tile-title Mermaid
+                    v-list-tile-sub-title Generate flowcharts from Mermaid syntax
+                  v-list-tile-avatar
+                    v-icon(color='green', small) lens
+                v-divider.my-0
+                v-list-tile(avatar)
+                  v-list-tile-avatar
+                    v-icon(color='grey') functions
+                  v-list-tile-content
+                    v-list-tile-title Mathjax Pre-Processor
+                    v-list-tile-sub-title Parse Mathjax content from Markdown
+                  v-list-tile-avatar
+                    v-icon(color='red', small) trip_origin
+
+              v-toolbar(
+                color='blue'
+                dense
+                dark
+                )
+                v-icon.mr-2 arrow_downward
+                .body-2 HTML
+                v-spacer
+                v-btn(
+                  icon
+                  @click=''
+                  )
+                  v-icon add
+              v-list(two-line, dense)
+                v-list-tile(avatar)
+                  v-list-tile-avatar
+                    v-icon(color='grey') subscriptions
+                  v-list-tile-content
+                    v-list-tile-title Video Players
+                    v-list-tile-sub-title Embed video players such as Youtube, Vimeo, etc.
+                  v-list-tile-avatar
+                    v-icon(color='green', small) lens
+                v-divider.my-0
+                v-list-tile(avatar)
+                  v-list-tile-avatar
+                    v-icon(color='grey') subtitles
+                  v-list-tile-content
+                    v-list-tile-title Asciinema
+                    v-list-tile-sub-title Embed asciinema players from compatible links
+                  v-list-tile-avatar
+                    v-icon(color='green', small) lens
+                v-divider.my-0
+                v-list-tile(avatar)
+                  v-list-tile-avatar
+                    v-icon(color='grey') volume_up
+                  v-list-tile-content
+                    v-list-tile-title Audio Players
+                    v-list-tile-sub-title Embed audio players for audio content
+                  v-list-tile-avatar
+                    v-icon(color='green', small) lens
+                v-divider.my-0
+                v-list-tile(avatar)
+                  v-list-tile-avatar
+                    v-icon(color='grey') insert_comment
+                  v-list-tile-content
+                    v-list-tile-title Blockquotes
+                    v-list-tile-sub-title Process styled blockquotes
+                  v-list-tile-avatar
+                    v-icon(color='green', small) lens
+                v-divider.my-0
+                v-list-tile(avatar)
+                  v-list-tile-avatar
+                    v-icon(color='grey') functions
+                  v-list-tile-content
+                    v-list-tile-title Mathjax Processor
+                    v-list-tile-sub-title TeX/MathML Math Equations Parser
+                  v-list-tile-avatar
+                    v-icon(color='red', small) trip_origin
+
+          v-flex(lg9 xs12)
+            v-card
+              v-toolbar(
+                color='grey darken-1'
+                dark
+                flat
+                dense
+                )
+                v-icon.mr-2 settings_applications
+                .subheading Markdown
+                v-icon chevron_right
+                .subheading Core
+                v-spacer
+                v-btn(flat, disabled)
+                  v-icon(left) wrap_text
+                  span Bypass
+                v-btn(flat, disabled)
+                  v-icon(left) clear
+                  span Remove
+              v-card-text
+                v-switch(
+                  v-model='linkify'
+                  label='Automatically convert links'
+                  color='primary'
+                  persistent-hint
+                  hint='Links will automatically be converted to clickable links.'
+                  )
+                v-divider
+                v-switch(
+                  v-model='linkify'
+                  label='Automatically convert line breaks'
+                  color='primary'
+                  persistent-hint
+                  hint='Add linebreaks within paragraphs.'
+                  )
+                v-divider
+                v-switch(
+                  v-model='linkify'
+                  label='Highlight code blocks'
+                  color='primary'
+                  persistent-hint
+                  hint='Add syntax coloring to code blocks.'
+                  )
+                v-select.mt-3(
+                  :items='["Light", "Dark"]'
+                  v-model='codeTheme'
+                  label='Code Color Theme'
+                  outline
+                  background-color='grey lighten-2'
+                )
+              v-card-chin
+                v-btn(
+                  color='primary'
+                  )
+                  v-icon(left) check
+                  span Apply Configuration
 </template>
 
 <script>
 export default {
   data() {
-    return {}
+    return {
+      linkify: true,
+      codeTheme: 'Light'
+    }
   }
 }
 </script>

client/components/login.vue

@@ -13,15 +13,16 @@
         .login-frame(v-show='screen === "login"')
           h1.text-xs-center.display-1 {{ siteTitle }}
           h2.text-xs-center.subheading {{ $t('auth:loginRequired') }}
-          v-text-field(solo, ref='iptEmail', v-model='username', :placeholder='$t("auth:fields.emailUser")')
+          v-text-field(solo, hide-details, ref='iptEmail', v-model='username', :placeholder='$t("auth:fields.emailUser")')
           v-text-field.mt-2(
-            solo,
-            ref='iptPassword',
-            v-model='password',
-            :append-icon='hidePassword ? "visibility" : "visibility_off"',
-            :append-icon-cb='() => (hidePassword = !hidePassword)',
-            :type='hidePassword ? "password" : "text"',
-            :placeholder='$t("auth:fields.password")',
+            solo
+            hide-details
+            ref='iptPassword'
+            v-model='password'
+            :append-icon='hidePassword ? "visibility" : "visibility_off"'
+            :append-icon-cb='() => (hidePassword = !hidePassword)'
+            :type='hidePassword ? "password" : "text"'
+            :placeholder='$t("auth:fields.password")'
             @keyup.enter='login'
           )
           v-btn.mt-3(block, large, color='primary', @click='login') {{ $t('auth:actions.login') }}

package.json

@@ -234,6 +234,7 @@
     "vue-router": "3.0.1",
     "vue-simple-breakpoints": "1.0.3",
     "vue-template-compiler": "2.5.16",
+    "vuedraggable": "2.16.0",
     "vuetify": "1.1.1",
     "vuex": "3.0.1",
     "vuex-persistedstate": "2.5.4",

server/modules/storage/azure.js

@@ -6,10 +6,13 @@ module.exports = {
     accountKey: String,
     container: String
   },
-  activate() {
+  activated(opts) {
 
   },
-  deactivate() {
+  deactivated(opts) {
+
+  },
+  init(opts) {
 
   },
   created(opts) {

server/modules/storage/digitalocean.js

@@ -10,10 +10,13 @@ module.exports = {
     },
     bucket: String
   },
-  activate() {
+  activated(opts) {
 
   },
-  deactivate() {
+  deactivated(opts) {
+
+  },
+  init(opts) {
 
   },
   created(opts) {

server/modules/storage/disk.js

@@ -4,10 +4,13 @@ module.exports = {
   props: {
     path: String
   },
-  activate() {
+  activated(opts) {
 
   },
-  deactivate() {
+  deactivated(opts) {
+
+  },
+  init(opts) {
 
   },
   created(opts) {

server/modules/storage/dropbox.js

@@ -5,10 +5,13 @@ module.exports = {
     appKey: String,
     appSecret: String
   },
-  activate() {
+  activated(opts) {
 
   },
-  deactivate() {
+  deactivated(opts) {
+
+  },
+  init(opts) {
 
   },
   created(opts) {

server/modules/storage/gdrive.js

@@ -5,10 +5,13 @@ module.exports = {
     clientId: String,
     clientSecret: String
   },
-  activate() {
+  activated(opts) {
 
   },
-  deactivate() {
+  deactivated(opts) {
+
+  },
+  init(opts) {
 
   },
   created(opts) {

server/modules/storage/git.js

@@ -20,10 +20,13 @@ module.exports = {
     basicUsername: String,
     basicPassword: String
   },
-  activate() {
+  activated(opts) {
 
   },
-  deactivate() {
+  deactivated(opts) {
+
+  },
+  init(opts) {
 
   },
   created(opts) {

server/modules/storage/onedrive.js

@@ -5,10 +5,13 @@ module.exports = {
     clientId: String,
     clientSecret: String
   },
-  activate() {
+  activated(opts) {
 
   },
-  deactivate() {
+  deactivated(opts) {
+
+  },
+  init(opts) {
 
   },
   created(opts) {

server/modules/storage/s3.js

@@ -7,10 +7,13 @@ module.exports = {
     region: String,
     bucket: String
   },
-  activate() {
+  activated(opts) {
 
   },
-  deactivate() {
+  deactivated(opts) {
+
+  },
+  init(opts) {
 
   },
   created(opts) {

server/modules/storage/scp.js

@@ -14,10 +14,13 @@ module.exports = {
       default: '~'
     }
   },
-  activate() {
+  activated(opts) {
 
   },
-  deactivate() {
+  deactivated(opts) {
+
+  },
+  init(opts) {
 
   },
   created(opts) {

yarn.lock

@@ -11602,6 +11602,10 @@ sort-keys@^1.0.0:
   dependencies:
     is-plain-obj "^1.0.0"
 
+sortablejs@^1.7.0:
+  version "1.7.0"
+  resolved "https://registry.yarnpkg.com/sortablejs/-/sortablejs-1.7.0.tgz#80a2b2370abd568e1cec8c271131ef30a904fa28"
+
 source-list-map@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/source-list-map/-/source-list-map-2.0.0.tgz#aaa47403f7b245a92fbc97ea08f250d6087ed085"
@@ -12823,6 +12827,12 @@ vue@2.5.16:
   version "2.5.16"
   resolved "https://registry.yarnpkg.com/vue/-/vue-2.5.16.tgz#07edb75e8412aaeed871ebafa99f4672584a0085"
 
+vuedraggable@2.16.0:
+  version "2.16.0"
+  resolved "https://registry.yarnpkg.com/vuedraggable/-/vuedraggable-2.16.0.tgz#52127081a2adb3de5fabd214d404ff3eee63575a"
+  dependencies:
+    sortablejs "^1.7.0"
+
 vuetify@1.1.1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/vuetify/-/vuetify-1.1.1.tgz#8d8f64306a45aaf862487addae8decf082dac0a3"