refactor: renderers + auth providers + fixes

client/js/components/editor.component.js

@@ -1,5 +1,3 @@
-'use strict'
-
 /* global $, siteRoot */
 
 let mde

client/js/components/login.vue

@@ -55,7 +55,8 @@ export default {
       this.selectedStrategy = key
       this.screen = 'login'
       if (!useForm) {
-        window.location.assign(siteConfig.path + 'login/' + key)
+        this.isLoading = true
+        window.location.assign(this.$helpers.resolvePath('login/' + key))
       } else {
         this.$refs.iptEmail.focus()
       }

client/js/components/navigator.vue

@@ -15,12 +15,24 @@
             use(:xlink:href='subtitleIconClass')
         h2 {{subtitleText}}
       .navigator-action
-        .navigator-action-item
+        .navigator-action-item(:class='{"is-active": userMenuShown}', @click='toggleUserMenu')
           svg.icons.is-32(role='img')
             title User
             use(xlink:href='#nc-user-circle')
+          transition(name='navigator-action-item-dropdown')
+            ul.navigator-action-item-dropdown(v-show='userMenuShown', v-cloak)
+              li
+                label Account
+                svg.icons.is-24(role='img')
+                  title Account
+                  use(xlink:href='#nc-man-green')
+              li(@click='logout')
+                label Sign out
+                svg.icons.is-24(role='img')
+                  title Sign Out
+                  use(xlink:href='#nc-exit')
     transition(name='navigator-sd')
-      .navigator-sd(v-show='sdShown')
+      .navigator-sd(v-show='sdShown', v-cloak)
         .navigator-sd-actions
           a.is-active(href='', title='Search')
             svg.icons.is-24(role='img')
@@ -77,7 +89,8 @@ export default {
   name: 'navigator',
   data() {
     return {
-      sdShown: false
+      sdShown: false,
+      userMenuShown: false
     }
   },
   computed: {
@@ -104,16 +117,39 @@ export default {
   methods: {
     toggleMainMenu() {
       this.sdShown = !this.sdShown
+      this.userMenuShown = false
       if (this.sdShown) {
         this.$nextTick(() => {
+          this.bindOutsideClick()
           this.$refs.iptSearch.focus()
         })
+      } else {
+        this.unbindOutsideClick()
       }
-      // this.$store.dispatch('navigator/alert', {
-      //   style: 'success',
-      //   icon: 'gg-check',
-      //   msg: 'Changes were saved successfully!'
-      // })
+    },
+    toggleUserMenu() {
+      this.userMenuShown = !this.userMenuShown
+      this.sdShown = false
+      if (this.userMenuShown) {
+        this.bindOutsideClick()
+      } else {
+        this.unbindOutsideClick()
+      }
+    },
+    bindOutsideClick() {
+      document.addEventListener('mousedown', this.handleOutsideClick, false)
+    },
+    unbindOutsideClick() {
+      document.removeEventListener('mousedown', this.handleOutsideClick, false)
+    },
+    handleOutsideClick(ev) {
+      if (!this.$el.contains(ev.target)) {
+        this.sdShown = false
+        this.userMenuShown = false
+      }
+    },
+    logout() {
+      window.location.assign(this.$helpers.resolvePath('logout'))
     }
   },
   mounted() {

client/js/components/setup.component.js

@@ -24,7 +24,7 @@ export default {
       final: {
         ok: false,
         error: '',
-        results: []
+        redirectUrl: ''
       },
       conf: {
         adminEmail: '',
@@ -219,19 +219,32 @@ export default {
       self.final = {
         ok: false,
         error: '',
-        results: []
+        redirectUrl: ''
       }
 
       this.$helpers._.delay(() => {
         axios.post('/finalize', self.conf).then(resp => {
           if (resp.data.ok === true) {
-            self.final.ok = true
-            self.final.results = resp.data.results
+            self.$helpers._.delay(() => {
+              self.final.ok = true
+              switch (resp.data.redirectPort) {
+                case 80:
+                  self.final.redirectUrl = `http://${window.location.hostname}${resp.data.redirectPath}/login`
+                  break
+                case 443:
+                  self.final.redirectUrl = `https://${window.location.hostname}${resp.data.redirectPath}/login`
+                  break
+                default:
+                  self.final.redirectUrl = `http://${window.location.hostname}:${resp.data.redirectPort}${resp.data.redirectPath}/login`
+                  break
+              }
+              self.loading = false
+            }, 5000)
           } else {
             self.final.ok = false
             self.final.error = resp.data.error
+            self.loading = false
           }
-          self.loading = false
           self.$nextTick()
         }).catch(err => {
           window.alert(err.message)
@@ -239,18 +252,7 @@ export default {
       }, 1000)
     },
     finish: function (ev) {
-      let self = this
-      self.state = 'restart'
-
-      this.$helpers._.delay(() => {
-        axios.post('/restart', {}).then(resp => {
-          this.$helpers._.delay(() => {
-            window.location.assign(self.conf.host)
-          }, 30000)
-        }).catch(err => {
-          window.alert(err.message)
-        })
-      }, 1000)
+      window.location.assign(this.final.redirectUrl)
     }
   }
 }