Fix and simplify move.

Former-commit-id: 11231eb1b5c72c27228d955860a38e2dfc4c43c3 [formerly 57e14f4919d0759f80557217ff44d85e60fb6686] [formerly 71a61718832107ad72f26aab12810441ecc0c45f [formerly 32e66bb9c6]]
Former-commit-id: 2268fe7634998e21643933753d3122eefaa35e6f [formerly 2b2fa73458b97b20eae798a613c9385db9b80b05]
Former-commit-id: 1d792dfd5cb699068835ae06ae15042524357e53

assets/src/components/Editor.vue

@@ -38,6 +38,10 @@ export default {
     document.getElementById('save-button').removeEventListener('click', this.save)
   },
   mounted: function () {
+    if (this.req.content === undefined || this.req.content === null) {
+      this.req.content = ''
+    }
+
     // Set up the main content editor.
     this.content = CodeMirror(document.getElementById('editor'), {
       value: this.req.content,

assets/src/components/Files.vue

@@ -70,7 +70,6 @@ export default {
   },
   created () {
     this.fetchData()
-    console.log('created')
   },
   watch: {
     '$route': 'fetchData',
@@ -96,16 +95,16 @@ export default {
       if (url[0] !== '/') url = '/' + url
 
       api.fetch(url)
-      .then((trueURL) => {
-        if (!url.endsWith('/') && trueURL.endsWith('/')) {
-          console.log(trueURL)
+      .then((req) => {
+        if (!url.endsWith('/') && req.url.endsWith('/')) {
           window.history.replaceState(window.history.state, document.title, window.location.pathname + '/')
         }
 
+        this.$store.commit('updateRequest', req)
+        document.title = req.name
         this.setLoading(false)
       })
       .catch(error => {
-        console.log(error)
         this.error = error
         this.setLoading(false)
       })
@@ -130,9 +129,13 @@ export default {
 
       // Del!
       if (event.keyCode === 46) {
-        if (this.showDeleteButton && this.req.kind !== 'editor') {
-          this.$store.commit('showHover', 'delete')
-        }
+        if (this.req.kind === 'editor' ||
+          this.$route.name !== 'Files' ||
+          this.loading ||
+          !this.user.allowEdit ||
+          (this.req.kind === 'listing' && this.selectedCount === 0)) return
+
+        this.$store.commit('showHover', 'delete')
       }
 
       // F1!
@@ -143,9 +146,14 @@ export default {
 
       // F2!
       if (event.keyCode === 113) {
-        if (this.showRenameButton) {
-          this.$store.commit('showHover', 'rename')
-        }
+        if (this.req.kind === 'editor' ||
+          this.$route.name !== 'Files' ||
+          this.loading ||
+          !this.user.allowEdit ||
+          (this.req.kind === 'listing' && this.selectedCount === 0) ||
+          (this.req.kind === 'listing' && this.selectedCount > 1)) return
+
+        this.$store.commit('showHover', 'rename')
       }
 
       // CTRL + S

assets/src/components/Header.vue

@@ -69,7 +69,7 @@ export default {
       return this.req.kind === 'listing' && !this.loading && this.$route.name === 'Files'
     },
     showSaveButton () {
-      return (this.req.kind === 'editor' && !this.loading) || this.$route.name === 'User'
+      return (this.req.kind === 'editor' && !this.loading)
     },
     showSwitchButton () {
       return this.req.kind === 'listing' && this.$route.name === 'Files' && !this.loading

assets/src/components/prompts/Move.vue

@@ -4,7 +4,7 @@
     <p>Choose new house for your file(s)/folder(s):</p>
 
     <ul class="file-list">
-      <li @click="select" @dblclick="next" :key="item.name" v-for="item in items" :data-url="item.url">{{ item.name }}</li>
+      <li @click="select" @dblclick="next" :aria-selected="moveTo == item.url" :key="item.name" v-for="item in items" :data-url="item.url">{{ item.name }}</li>
     </ul>
 
     <p>Currently navigating on: <code>{{ current }}</code>.</p>
@@ -27,45 +27,36 @@ export default {
   data: function () {
     return {
       items: [],
-      current: window.location.pathname
+      current: window.location.pathname,
+      moveTo: null
     }
   },
   computed: mapState(['req', 'selected', 'baseURL']),
-  mounted: function () {
-    if (this.$route.path !== '/files/') {
-      this.items.push({
-        name: '..',
-        url: url.removeLastDir(this.$route.path) + '/'
-      })
-    }
-
+  mounted () {
+    // If we're showing this on a listing,
+    // we can use the current request object
+    // to fill the move options.
     if (this.req.kind === 'listing') {
-      for (let item of this.req.items) {
-        if (!item.isDir) continue
-
-        this.items.push({
-          name: item.name,
-          url: item.url
-        })
-      }
-
+      this.fillOptions(this.req)
       return
     }
+
+    // Otherwise, we must be on a preview or editor
+    // so we fetch the data from the previous directory.
+    api.fetch(url.removeLastDir(this.$rute.path))
+      .then(this.fillOptions)
+      .catch(this.showError)
   },
   methods: {
     move: function (event) {
       event.preventDefault()
 
-      let el = event.currentTarget
+      // Set the destination and create the promises array.
       let promises = []
-      let dest = this.current
+      let dest = (this.moveTo === null) ? this.current : this.moveTo
       buttons.loading('move')
 
-      let selected = el.querySelector('li[aria-selected=true]')
-      if (selected !== null) {
-        dest = selected.dataset.url
-      }
-
+      // Create a new promise for each file.
       for (let item of this.selected) {
         let from = this.req.items[item].url
         let to = dest + '/' + encodeURIComponent(this.req.items[item].name)
@@ -74,75 +65,69 @@ export default {
         promises.push(api.move(from, to))
       }
 
-      this.$store.commit('showMove', false)
-
+      // Execute the promises.
       Promise.all(promises)
         .then(() => {
           buttons.done('move')
-          this.$router.push({page: dest})
+          this.$router.push({ path: dest })
         })
         .catch(error => {
           buttons.done('move')
           this.$store.commit('showError', error)
         })
     },
-    next: function (event) {
-      let uri = event.currentTarget.dataset.url
-      this.json(uri)
-        .then((data) => {
-          this.current = uri
-          this.items = []
+    fillOptions (req) {
+      // Sets the current path and resets
+      // the current items.
+      this.current = req.url
+      this.items = []
 
-          if (uri !== this.baseURL + '/') {
-            this.items.push({
-              name: '..',
-              url: url.removeLastDir(uri) + '/'
-            })
-          }
-
-          let req = JSON.parse(data)
-          for (let item of req.items) {
-            if (!item.isDir) continue
-
-            this.items.push({
-              name: item.name,
-              url: item.uri
-            })
-          }
+      // If the path isn't the root path,
+      // show a button to navigate to the previous
+      // directory.
+      if (req.url !== '/files/') {
+        this.items.push({
+          name: '..',
+          url: url.removeLastDir(req.url) + '/'
         })
-        .catch(e => console.log(e))
+      }
+
+      // If this folder is empty, finish here.
+      if (req.items === null) return
+
+      // Otherwise we add every directory to the
+      // move options.
+      for (let item of req.items) {
+        if (!item.isDir) continue
+
+        this.items.push({
+          name: item.name,
+          url: item.url
+        })
+      }
     },
-    json: function (url) {
-      return new Promise((resolve, reject) => {
-        let request = new XMLHttpRequest()
-        request.open('GET', url)
-        request.setRequestHeader('Accept', 'application/json')
-        request.onload = () => {
-          if (request.status === 200) {
-            resolve(request.responseText)
-          } else {
-            reject(request.statusText)
-          }
-        }
-        request.onerror = () => reject(request.statusText)
-        request.send()
-      })
+    showError (error) {
+      this.$store.commit('showError', error)
+    },
+    next: function (event) {
+      // Retrieves the URL of the directory the user
+      // just clicked in and fill the options with its
+      // content.
+      let uri = event.currentTarget.dataset.url
+
+      api.fetch(uri)
+        .then(this.fillOptions)
+        .catch(this.showError)
     },
     select: function (event) {
-      let el = event.currentTarget
-
-      if (el.getAttribute('aria-selected') === 'true') {
-        el.setAttribute('aria-selected', false)
+      // If the element is already selected, unselect it.
+      if (this.moveTo === event.currentTarget.dataset.url) {
+        this.moveTo = null
         return
       }
 
-      let el2 = this.$el.querySelector('li[aria-selected=true]')
-      if (el2) {
-        el2.setAttribute('aria-selected', false)
-      }
-
-      el.setAttribute('aria-selected', true)
-      return
+      // Otherwise select the element.
+      this.moveTo = event.currentTarget.dataset.url
     }
   }
 }

assets/src/utils/api.js

@@ -21,13 +21,10 @@ function fetch (url) {
     request.onload = () => {
       switch (request.status) {
         case 200:
-          let req = JSON.parse(request.responseText)
-          store.commit('updateRequest', req)
-          document.title = req.name
-          resolve(req.url)
+          resolve(JSON.parse(request.responseText))
           break
         default:
-          reject(request.status)
+          reject(request.responseText)
           break
       }
     }