Load the application after checking the file permissions

owncloud · Dec 8, 2020 · 8bc0e3b · 8bc0e3b
1 parent 5c9d455
commit 8bc0e3b
Showing 1 changed file with 22 additions and 7 deletions.
diff --git a/apps/draw-io/src/DrawIoEditor.vue b/apps/draw-io/src/DrawIoEditor.vue
@@ -1,5 +1,13 @@
 <template>
-  <iframe id="drawio-editor" ref="drawIoEditor" :src="iframeSource"></iframe>
+  <div>
+    <oc-spinner
+      v-if="loading"
+      :aria-label="this.$gettext('Loading media')"
+      class="uk-position-center"
+      size="xlarge"
+    />
+    <iframe v-else id="drawio-editor" ref="drawIoEditor" :src="iframeSource" />
+  </div>
 </template>
 <script>
 import { mapGetters, mapActions } from 'vuex'
@@ -10,16 +18,14 @@ import moment from 'moment'
 export default {
   name: 'DrawIoEditor',
   data: () => ({
+    loading: true,
     filePath: '',
     fileExtension: '',
     isReadOnly: null,
     currentETag: null
   }),
   computed: {
     ...mapGetters(['getToken']),
-    loading() {
-      return this.content === ''
-    },
     config() {
       const { url = 'https://embed.diagrams.net', theme = 'minimal', autosave = false } =
         this.$store.state.apps.fileEditors.find(editor => editor.app === 'draw-io').config || {}
@@ -42,9 +48,7 @@ export default {
   created() {
     this.filePath = this.$route.params.filePath
     this.fileExtension = this.filePath.split('.').pop()
-    this.$client.files.fileInfo(this.filePath, ['{http://owncloud.org/ns}permissions']).then(v => {
-      this.isReadOnly = v.fileInfo['{http://owncloud.org/ns}permissions'].indexOf('W') === -1
-    })
+    this.checkPermissions()
     window.addEventListener('message', event => {
       if (event.data.length > 0) {
         var payload = JSON.parse(event.data)
@@ -75,6 +79,17 @@ export default {
         }
       })
     },
+    checkPermissions() {
+      this.$client.files
+        .fileInfo(this.filePath, ['{http://owncloud.org/ns}permissions'])
+        .then(v => {
+          this.isReadOnly = v.fileInfo['{http://owncloud.org/ns}permissions'].indexOf('W') === -1
+          this.loading = false
+        })
+        .catch(error => {
+          this.error(error)
+        })
+    },
     load() {
       this.$client.files
         .getFileContents(this.filePath, { resolveWithResponseObject: true })