Merge pull request #2111 from owncloud/feature/new-file-menu

Add new file menu entries for different file types.
owncloud · Oct 23, 2019 · 57636b4 · 57636b4
2 parents bda01bc + c4bd641
commit 57636b4
Show file tree

Hide file tree

Showing 6 changed files with 70 additions and 32 deletions.
diff --git a/apps/draw-io/src/app.js b/apps/draw-io/src/app.js
@@ -20,7 +20,12 @@ const appInfo = {
   extensions: [{
     extension: 'drawio',
     newTab: true,
-    routeName: 'draw-io-edit'
+    routeName: 'draw-io-edit',
+    newFileMenu: {
+      menuTitle ($gettext) {
+        return $gettext('Create new draw.io document…')
+      }
+    }
   }
   ]
 }

diff --git a/apps/files/src/components/FilesApp.vue b/apps/files/src/components/FilesApp.vue
@@ -70,24 +70,6 @@ export default {
       }
     },
 
-    openFileAction (action, file) {
-      if (action.newTab) {
-        const path = this.$router.resolve({ name: action.routeName, params: { filePath: file.path } }).href
-        const url = window.location.origin + '/' + path
-        const target = `${action.routeName}-${file.path}`
-        const win = window.open(url, target)
-        win.focus()
-        return
-      }
-      // TODO: rewire code below ....
-      const appId = action.app
-      this.$emit('open', appId)
-      // TODO path to state
-      this.$router.push({
-        name: appId
-      })
-    },
-
     openFileActionBar (file) {
       this.openFile({
         filePath: file.path
@@ -98,7 +80,7 @@ export default {
           label: action.name,
           icon: action.icon,
           onClick: () => {
-            this.openFileAction(action, file)
+            this.openFileAction(action, file.path)
           }
         }
       })

diff --git a/apps/files/src/components/FilesAppBar.vue b/apps/files/src/components/FilesAppBar.vue
@@ -41,7 +41,10 @@
                 <file-upload :url='url' :headers="headers" @success="onFileSuccess" @error="onFileError" @progress="onFileProgress"></file-upload>
                 <folder-upload v-if="!isIE11()" :rootPath='item' :url='url' :headers="headers" @success="onFileSuccess" @error="onFileError" @progress="onFileProgress"></folder-upload>
                 <oc-nav-item @click="showCreateFolderDialog" id="new-folder-btn" icon="create_new_folder"><translate>Create new folder…</translate></oc-nav-item>
-                <oc-nav-item @click="showCreateFileDialog" id="new-file-btn" icon="save"><translate>Create new file…</translate></oc-nav-item>
+                <oc-nav-item v-for="(newFileHandler, key) in newFileHandlers"
+                  :key="key"
+                  @click="showCreateFileDialog(newFileHandler.ext, newFileHandler.action)" id="new-file-btn" icon="save">
+                  {{ newFileHandler.menuTitle($gettext) }}</oc-nav-item>
               </oc-nav>
             </oc-drop>
           </template>
@@ -106,6 +109,7 @@ export default {
     newFolderName: '',
     newFileName: '',
     createFile: false,
+    newFileAction: null,
     path: '',
     searchedFiles: [],
     fileFolderCreationLoading: false,
@@ -116,8 +120,8 @@ export default {
     searchBarKey: 0
   }),
   computed: {
-    ...mapGetters(['getToken', 'configuration']),
-    ...mapGetters('Files', ['activeFiles', 'searchTerm', 'atSearchPage', 'currentFolder', 'davProperties', 'quota', 'selectedFiles', 'overwriteDialogTitle', 'overwriteDialogMessage', 'publicLinkPassword']),
+    ...mapGetters(['getToken', 'configuration', 'newFileHandlers']),
+    ...mapGetters('Files', ['activeFiles', 'inProgress', 'searchTerm', 'atSearchPage', 'currentFolder', 'davProperties', 'quota', 'selectedFiles', 'overwriteDialogTitle', 'overwriteDialogMessage', 'publicLinkPassword']),
     ...mapState(['route']),
     searchLabel () {
       return this.$gettext('Search')
@@ -380,9 +384,10 @@ export default {
 
       return null
     },
-    showCreateFileDialog () {
+    showCreateFileDialog (ext = 'txt', openAction = null) {
       this.createFile = true
-      this.newFileName = this.$gettext('New file') + '.txt'
+      this.newFileAction = openAction
+      this.newFileName = this.$gettext('New file') + '.' + ext
     },
     addNewFile (fileName) {
       if (fileName !== '') {
@@ -395,17 +400,25 @@ export default {
         p.then(() => {
           this.createFile = false
           this.$_ocFilesFolder_getFolder()
+          this.fileFolderCreationLoading = false
+          if (this.newFileAction) {
+            // not cool - needs refactoring
+            this.$nextTick(() => {
+              this.openFile({
+                filePath: path + fileName
+              })
+              this.openFileAction(this.newFileAction, path + fileName)
+            })
+          }
         })
           .catch(error => {
+            this.fileFolderCreationLoading = false
             this.showMessage({
               title: this.$gettext('Creating file failed…'),
               desc: error,
               status: 'danger'
             })
           })
-          .finally(() => {
-            this.fileFolderCreationLoading = false
-          })
       }
     },
     checkNewFileName (fileName) {

diff --git a/apps/files/src/mixins.js b/apps/files/src/mixins.js
@@ -516,6 +516,25 @@ export default {
           item: param
         }
       })
+    },
+    openFileAction (action, filePath) {
+      if (action.newTab) {
+        const path = this.$router.resolve({ name: action.routeName, params: { filePath: filePath } }).href
+        const url = window.location.origin + '/' + path
+        const target = `${action.routeName}-${filePath}`
+        const win = window.open(url, target)
+        // in case popup is blocked win will be null
+        if (win) {
+          win.focus()
+        }
+        return
+      }
+      // TODO: rewire code below ....
+      const appId = action.app
+      // TODO path to state
+      this.$router.push({
+        name: appId
+      })
     }
   }
 }
diff --git a/apps/markdown-editor/src/app.js b/apps/markdown-editor/src/app.js
@@ -23,11 +23,20 @@ const appInfo = {
   icon: 'text',
   isFileEditor: true,
   extensions: [{
-    extension: 'txt'
+    extension: 'txt',
+    newFileMenu: {
+      menuTitle ($gettext) {
+        return $gettext('Create new plain text file…')
+      }
+    }
   },
   {
-    extension: 'md'
-    // icon: 'custom_icon_class_to_override_icon_for_filetype_md'
+    extension: 'md',
+    newFileMenu: {
+      menuTitle ($gettext) {
+        return $gettext('Create new mark-down file…')
+      }
+    }
   }
   ]
 }

diff --git a/src/store/apps.js b/src/store/apps.js
@@ -6,6 +6,7 @@ const state = {
     edit: false
   },
   extensions: {},
+  newFileHandlers: [],
   fileSideBars: [],
   meta: {}
 }
@@ -73,13 +74,19 @@ const mutations = {
           app: appInfo.id,
           icon: e.icon,
           newTab: e.newTab || false,
-          routeName: e.routeName || appInfo.id
+          routeName: e.routeName || appInfo.id,
+          newFileMenu: e.newFileMenu || null
         }
         if (!state.extensions[e.extension]) {
           state.extensions[e.extension] = [link]
         } else {
           state.extensions[e.extension].push(link)
         }
+        if (e.newFileMenu) {
+          e.newFileMenu.ext = e.extension
+          e.newFileMenu.action = link
+          state.newFileHandlers.push(e.newFileMenu)
+        }
       })
     }
     if (appInfo.fileSideBars) {
@@ -113,6 +120,9 @@ const getters = {
   activeFile: state => {
     return state.file
   },
+  newFileHandlers: state => {
+    return state.newFileHandlers
+  },
   extensions: state => {
     return fileExtension => {
       const ext = state.extensions[fileExtension]