nexus/vuefilemanager
2
0
Fork 0
mirror of https://github.com/VueFileManager/vuefilemanager.git synced 2026-04-18 08:12:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

- fileinfodetail renamed to clipboard

Browse Source
This commit is contained in:
Peter Papp
2021-04-19 09:22:50 +02:00
parent b71072ddda
commit b0c81a692c
24 changed files with 382 additions and 353 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
resources/js/components/FilesView/ContextMenu.vue
View File

@@ -193,21 +193,21 @@ export default {
Option
},
computed: {
...mapGetters(['user', 'fileInfoDetail']),
...mapGetters(['user', 'clipboard']),
hasFolder() {
return this.fileInfoDetail.find(item => item.type === 'folder')
return this.clipboard.find(item => item.type === 'folder')
},
hasFile() {
return this.fileInfoDetail.find(item => item.type !== 'folder')
return this.clipboard.find(item => item.type !== 'folder')
},
isMultiSelectContextMenu() {
// If is context Menu open on multi selected items open just options for the multi selected items
if (this.fileInfoDetail.length > 1 && this.fileInfoDetail.includes(this.item))
if (this.clipboard.length > 1 && this.clipboard.includes(this.item))
return false
// If is context Menu open for the non selected item open options for the single item
if (this.fileInfoDetail.length < 2 || !this.fileInfoDetail.includes(this.item))
if (this.clipboard.length < 2 || !this.clipboard.includes(this.item))
return true
},
favourites() {
@@ -250,11 +250,11 @@ export default {
restoreItem() {
// If is item not in selected items restore just this single item
if (!this.fileInfoDetail.includes(this.item))
if (!this.clipboard.includes(this.item))
this.$store.dispatch('restoreItem', this.item)
// If is item in selected items restore all items from fileInfoDetail
if (this.fileInfoDetail.includes(this.item))
// If is item in selected items restore all items from clipboard
if (this.clipboard.includes(this.item))
this.$store.dispatch('restoreItem', null)
},
shareCancel() {
@@ -283,12 +283,12 @@ export default {
!this.favourites.find(el => el.id === this.item.id)
) {
// Add to favourite folder that is not selected
if (!this.fileInfoDetail.includes(this.item)) {
if (!this.clipboard.includes(this.item)) {
this.$store.dispatch('addToFavourites', this.item)
}
// Add to favourites all selected folders
if (this.fileInfoDetail.includes(this.item)) {
if (this.clipboard.includes(this.item)) {
this.$store.dispatch('addToFavourites', null)
}
} else {
@@ -296,7 +296,7 @@ export default {
}
},
downloadItem() {
if (this.fileInfoDetail.length > 1)
if (this.clipboard.length > 1)
this.$store.dispatch('downloadFiles')
else {
this.$downloadFile(this.item.file_url, this.item.name + '.' + this.item.mimetype)
@@ -304,18 +304,18 @@ export default {
},
ItemDetail() {
// Dispatch load file info detail
this.$store.commit('GET_FILEINFO_DETAIL', this.item)
this.$store.commit('ADD_ITEM_TO_CLIPBOARD', this.item)
// Show panel if is not open
this.$store.dispatch('fileInfoToggle', true)
},
deleteItem() {
// If is context menu open on non selected item delete this single item
if (!this.fileInfoDetail.includes(this.item)) {
if (!this.clipboard.includes(this.item)) {
this.$store.dispatch('deleteItem', this.item)
}
// If is context menu open to multi selected items dele this selected items
if (this.fileInfoDetail.includes(this.item)) {
if (this.clipboard.includes(this.item)) {
this.$store.dispatch('deleteItem')
}
},

18
resources/js/components/FilesView/DesktopToolbar.vue
View File

@@ -73,7 +73,7 @@ export default {
...mapGetters([
'FilePreviewType',
'fileInfoVisible',
'fileInfoDetail',
'clipboard',
'currentFolder',
'browseHistory',
'homeDirectory'
@@ -109,7 +109,7 @@ export default {
'shared',
'public'
]
return !this.$isThisLocation(locations) || this.fileInfoDetail.length === 0
return !this.$isThisLocation(locations) || this.clipboard.length === 0
},
canUploadInView() {
return !this.$isThisLocation(['base', 'public'])
@@ -122,7 +122,7 @@ export default {
'shared',
'public'
]
return !this.$isThisLocation(locations) || this.fileInfoDetail.length === 0
return !this.$isThisLocation(locations) || this.clipboard.length === 0
},
canShareInView() {
@@ -134,7 +134,7 @@ export default {
'public'
]
return !this.$isThisLocation(locations) || this.fileInfoDetail.length > 1 || this.fileInfoDetail.length === 0
return !this.$isThisLocation(locations) || this.clipboard.length > 1 || this.clipboard.length === 0
}
},
data() {
@@ -202,24 +202,24 @@ export default {
events.$emit('folder:actions', this.currentFolder)
},
deleteItem() {
if (this.fileInfoDetail.length > 0)
if (this.clipboard.length > 0)
this.$store.dispatch('deleteItem')
},
createFolder() {
this.$store.dispatch('createFolder', {name: this.$t('popup_create_folder.folder_default_name')})
},
moveItem() {
if (this.fileInfoDetail.length > 0)
events.$emit('popup:open', { name: 'move', item: this.fileInfoDetail })
if (this.clipboard.length > 0)
events.$emit('popup:open', { name: 'move', item: this.clipboard })
},
shareItem() {
let event = this.fileInfoDetail[0].shared
let event = this.clipboard[0].shared
? 'share-edit'
: 'share-create'
events.$emit('popup:open', {
name: event,
item: this.fileInfoDetail[0]
item: this.clipboard[0]
})
}
},

10
resources/js/components/FilesView/DragUI.vue
View File

@@ -11,10 +11,10 @@ export default {
name: 'DragUI',
components: { MultiSelected },
computed: {
...mapGetters(['fileInfoDetail']),
...mapGetters(['clipboard']),
title() {
let filesLength = this.fileInfoDetail.length,
hasDraggedItem = this.fileInfoDetail.includes(this.draggedItem)
let filesLength = this.clipboard.length,
hasDraggedItem = this.clipboard.includes(this.draggedItem)
// Title for multiple selected items
if (filesLength > 1 && hasDraggedItem) {
@@ -27,8 +27,8 @@ export default {
}
},
subtitle() {
let filesLength = this.fileInfoDetail.length,
hasDraggedItem = this.fileInfoDetail.includes(this.draggedItem)
let filesLength = this.clipboard.length,
hasDraggedItem = this.clipboard.includes(this.draggedItem)
// Subtitle for multiple selected items
if (filesLength > 1 && hasDraggedItem) {

4
resources/js/components/FilesView/FileActionsMobile.vue
View File

@@ -155,10 +155,10 @@
events.$emit('mobile-menu:show', 'file-filter')
},
selectAll() {
this.$store.commit('SELECT_ALL_FILES')
this.$store.commit('ADD_ALL_ITEMS_TO_CLIPBOARD')
},
deselectAll() {
this.$store.commit('CLEAR_FILEINFO_DETAIL')
this.$store.commit('CLIPBOARD_CLEAR')
},
enableMultiSelectMode() {
this.isSelectMode = true

28
resources/js/components/FilesView/FileBrowser.vue
View File

@@ -78,15 +78,15 @@
<!--File Info Panel-->
<div v-if="! $isMinimalScale()" class="file-info-container" :class="{ 'is-fileinfo-visible': fileInfoVisible }">
<!--File info panel-->
<FileInfoPanel v-if="fileInfoDetail.length === 1" />
<FileInfoPanel v-if="clipboard.length === 1" />
<MultiSelected v-if="fileInfoDetail.length > 1"
<MultiSelected v-if="clipboard.length > 1"
:title="$t('file_detail.selected_multiple')"
:subtitle="this.fileInfoDetail.length + ' ' + $tc('file_detail.items', this.fileInfoDetail.length)"
:subtitle="this.clipboard.length + ' ' + $tc('file_detail.items', this.clipboard.length)"
/>
<!--If file info panel empty show message-->
<EmptyMessage v-if="fileInfoDetail.length === 0" :message="$t('messages.nothing_to_preview')" icon="eye-off" />
<EmptyMessage v-if="clipboard.length === 0" :message="$t('messages.nothing_to_preview')" icon="eye-off" />
</div>
</div>
</template>
@@ -123,7 +123,7 @@
'filesInQueueTotal',
'fileInfoVisible',
'FilePreviewType',
'fileInfoDetail',
'clipboard',
'currentFolder',
'isSearching',
'isLoading',
@@ -141,12 +141,12 @@
draggedItems() {
//Set opacity for dragged items
if (!this.fileInfoDetail.includes(this.draggingId)) {
if (!this.clipboard.includes(this.draggingId)) {
return [this.draggingId]
}
if (this.fileInfoDetail.includes(this.draggingId)) {
return this.fileInfoDetail
if (this.clipboard.includes(this.draggingId)) {
return this.clipboard
}
}
},
@@ -183,7 +183,7 @@
},
methods: {
deleteItems() {
if (this.fileInfoDetail.length > 0 && this.$checkPermission('master') || this.$checkPermission('editor')) {
if (this.clipboard.length > 0 && this.$checkPermission('master') || this.$checkPermission('editor')) {
this.$store.dispatch('deleteItem')
}
},
@@ -216,17 +216,17 @@
if (data.type !== 'folder' || this.draggingId === data) return
//Prevent move selected folder to folder if in beteewn selected folders
if (this.fileInfoDetail.find(item => item === data && this.fileInfoDetail.length > 1)) return
if (this.clipboard.find(item => item === data && this.clipboard.length > 1)) return
// Move folder to new parent
//Move item if is not included in selected items
if (!this.fileInfoDetail.includes(this.draggingId)) {
if (!this.clipboard.includes(this.draggingId)) {
this.$store.dispatch('moveItem', {to_item: data, noSelectedItem: this.draggingId})
}
//Move selected items to folder
if (this.fileInfoDetail.length > 0 && this.fileInfoDetail.includes(this.draggingId)) {
if (this.clipboard.length > 0 && this.clipboard.includes(this.draggingId)) {
this.$store.dispatch('moveItem', {to_item: data, noSelectedItem: null})
}
@@ -247,7 +247,7 @@
filesContainerClick() {
// Deselect items clicked by outside
this.$store.commit('CLEAR_FILEINFO_DETAIL')
this.$store.commit('CLIPBOARD_CLEAR')
}
},
created() {
@@ -268,7 +268,7 @@
})
events.$on('fileItem:deselect', () => {
this.$store.commit('CLEAR_FILEINFO_DETAIL')
this.$store.commit('CLIPBOARD_CLEAR')
})
events.$on('scrollTop', () => {

36
resources/js/components/FilesView/FileInfoPanel.vue
View File

@@ -1,5 +1,5 @@
<template>
<div class="file-info-content" v-if="fileInfoDetail.length === 1">
<div class="file-info-content" v-if="clipboard.length === 1">
<div class="file-headline" spellcheck="false">
<FilePreviewDetail/>
@@ -14,37 +14,37 @@
</div>
</div>
<div class="file-info">
<span ref="name" class="name">{{ fileInfoDetail[0].name }}</span>
<span class="mimetype text-theme" v-if="fileInfoDetail[0].mimetype">.{{ fileInfoDetail[0].mimetype }}</span>
<span ref="name" class="name">{{ clipboard[0].name }}</span>
<span class="mimetype text-theme" v-if="clipboard[0].mimetype">.{{ clipboard[0].mimetype }}</span>
</div>
</div>
</div>
<!--Info list-->
<ListInfo>
<ListInfoItem v-if="fileInfoDetail[0].filesize"
<ListInfoItem v-if="clipboard[0].filesize"
:title="$t('file_detail.size')"
:content="fileInfoDetail[0].filesize">
:content="clipboard[0].filesize">
</ListInfoItem>
<ListInfoItem v-if="$checkPermission(['master']) && fileInfoDetail[0].author !== 'user'"
<ListInfoItem v-if="$checkPermission(['master']) && clipboard[0].author !== 'user'"
:title="$t('file_detail.author')"
:content="$t('file_detail.author_participant')">
</ListInfoItem>
<ListInfoItem
:title="$t('file_detail.created_at')"
:content="fileInfoDetail[0].created_at">
:content="clipboard[0].created_at">
</ListInfoItem>
<ListInfoItem v-if="$checkPermission(['master'])"
:title="$t('file_detail.where')">
<div class="action-button" @click="moveItem">
<span>{{ fileInfoDetail[0].parent ? fileInfoDetail[0].parent.name : $t('locations.home') }}</span>
<span>{{ clipboard[0].parent ? clipboard[0].parent.name : $t('locations.home') }}</span>
<edit-2-icon size="10" class="edit-icon"></edit-2-icon>
</div>
</ListInfoItem>
<ListInfoItem v-if="$checkPermission('master') && fileInfoDetail[0].shared"
<ListInfoItem v-if="$checkPermission('master') && clipboard[0].shared"
:title="$t('file_detail.shared')">
<div class="action-button" @click="shareItemOptions">
<span>{{ sharedInfo }}</span>
@@ -53,7 +53,7 @@
<div class="sharelink">
<lock-icon v-if="isLocked" @click="shareItemOptions" class="lock-icon" size="17"></lock-icon>
<unlock-icon v-if="! isLocked" @click="shareItemOptions" class="lock-icon" size="17"></unlock-icon>
<CopyInput class="copy-sharelink" size="small" :item="fileInfoDetail[0]"/>
<CopyInput class="copy-sharelink" size="small" :item="clipboard[0]"/>
</div>
</ListInfoItem>
@@ -91,23 +91,23 @@
LockIcon,
},
computed: {
...mapGetters(['fileInfoDetail', 'permissionOptions']),
...mapGetters(['clipboard', 'permissionOptions']),
fileType() {
return this.fileInfoDetail[0].type
return this.clipboard[0].type
},
canShowMetaData() {
return this.fileInfoDetail[0].metadata && this.fileInfoDetail[0].metadata.ExifImageWidth
return this.clipboard[0].metadata && this.clipboard[0].metadata.ExifImageWidth
},
sharedInfo() {
// Get permission title
let title = this.permissionOptions.find(option => {
return option.value === this.fileInfoDetail[0].shared.permission
return option.value === this.clipboard[0].shared.permission
})
return title ? this.$t(title.label) : this.$t('shared.can_download')
},
sharedIcon() {
switch (this.fileInfoDetail[0].shared.permission) {
switch (this.clipboard[0].shared.permission) {
case 'editor':
return 'user-edit'
break
@@ -119,17 +119,17 @@
}
},
isLocked() {
return this.fileInfoDetail[0].shared.is_protected
return this.clipboard[0].shared.is_protected
}
},
methods: {
shareItemOptions() {
// Open share item popup
events.$emit('popup:open', {name: 'share-edit', item: this.fileInfoDetail[0]})
events.$emit('popup:open', {name: 'share-edit', item: this.clipboard[0]})
},
moveItem() {
// Move item fire popup
events.$emit("popup:open", { name: "move", item: this.fileInfoDetail});
events.$emit("popup:open", { name: "move", item: this.clipboard});
}
}
}

49
resources/js/components/FilesView/FileItemGrid.vue
View File

@@ -59,7 +59,7 @@
</div>
<span @mousedown.stop="showItemActions" class="show-actions" v-if="$isMobile() && ! mobileMultiSelect && canShowMobileOptions">
<MoreHorizontalIcon icon="ellipsis-h" size="16" class="icon-action text-theme"/>
<MoreHorizontalIcon icon="ellipsis-h" size="16" class="icon-action text-theme" />
</span>
</div>
</div>
@@ -84,7 +84,7 @@ export default {
},
computed: {
...mapGetters([
'FilePreviewType', 'sharedDetail', 'fileInfoDetail', 'data'
'FilePreviewType', 'sharedDetail', 'clipboard', 'data'
]),
folderEmojiOrColor() {
@@ -102,7 +102,7 @@ export default {
},
isClicked() {
return this.fileInfoDetail.some(element => element.id === this.item.id)
return this.clipboard.some(element => element.id === this.item.id)
},
isFolder() {
return this.item.type === 'folder'
@@ -158,8 +158,8 @@ export default {
},
showItemActions() {
// Load file info detail
this.$store.commit('CLEAR_FILEINFO_DETAIL')
this.$store.commit('GET_FILEINFO_DETAIL', this.item)
this.$store.commit('CLIPBOARD_CLEAR')
this.$store.commit('ADD_ITEM_TO_CLIPBOARD', this.item)
events.$emit('mobile-menu:show', 'file-menu')
},
@@ -181,36 +181,36 @@ export default {
if (e.ctrlKey || e.metaKey && !e.shiftKey) {
// Click + Ctrl
if (this.fileInfoDetail.some(item => item.id === this.item.id)) {
this.$store.commit('REMOVE_ITEM_FILEINFO_DETAIL', this.item)
if (this.clipboard.some(item => item.id === this.item.id)) {
this.$store.commit('REMOVE_ITEM_FROM_CLIPBOARD', this.item)
} else {
this.$store.commit('GET_FILEINFO_DETAIL', this.item)
this.$store.commit('ADD_ITEM_TO_CLIPBOARD', this.item)
}
} else if (e.shiftKey) {
// Click + Shift
let lastItem = this.data.indexOf(this.fileInfoDetail[this.fileInfoDetail.length - 1])
let lastItem = this.data.indexOf(this.clipboard[this.clipboard.length - 1])
let clickedItem = this.data.indexOf(this.item)
// If Click + Shift + Ctrl dont remove already selected items
if (!e.ctrlKey && !e.metaKey) {
this.$store.commit('CLEAR_FILEINFO_DETAIL')
this.$store.commit('CLIPBOARD_CLEAR')
}
//Shift selecting from top to bottom
if (lastItem < clickedItem) {
for (let i = lastItem; i <= clickedItem; i++) {
this.$store.commit('GET_FILEINFO_DETAIL', this.data[i])
this.$store.commit('ADD_ITEM_TO_CLIPBOARD', this.data[i])
}
//Shift selecting from bottom to top
} else {
for (let i = lastItem; i >= clickedItem; i--) {
this.$store.commit('GET_FILEINFO_DETAIL', this.data[i])
this.$store.commit('ADD_ITEM_TO_CLIPBOARD', this.data[i])
}
}
} else {
// Click
this.$store.commit('CLEAR_FILEINFO_DETAIL')
this.$store.commit('GET_FILEINFO_DETAIL', this.item)
this.$store.commit('CLIPBOARD_CLEAR')
this.$store.commit('ADD_ITEM_TO_CLIPBOARD', this.item)
}
}
@@ -219,24 +219,27 @@ export default {
if (this.isFolder) {
if (this.$isThisLocation('public')) {
this.$store.dispatch('browseShared', [{ folder: this.item, back: false, init: false }])
this.$store.dispatch('browseShared', [{folder: this.item, back: false, init: false}])
} else {
this.$store.dispatch('getFolder', [{ folder: this.item, back: false, init: false }])
this.$store.dispatch('getFolder', [{folder: this.item, back: false, init: false}])
}
} else {
if (this.isImage || this.isVideo || this.isAudio || this.isPdf) {
this.$store.commit('LOAD_FILEINFO_DETAIL', this.item)
this.$store.commit('CLIPBOARD_CLEAR')
this.$store.commit('ADD_ITEM_TO_CLIPBOARD', this.item)
events.$emit('file-preview:show')
}
}
}
if (this.mobileMultiSelect && this.$isMobile()) {
if (this.fileInfoDetail.some(item => item.id === this.item.id)) {
this.$store.commit('REMOVE_ITEM_FILEINFO_DETAIL', this.item)
if (this.clipboard.some(item => item.id === this.item.id)) {
this.$store.commit('REMOVE_ITEM_FROM_CLIPBOARD', this.item)
} else {
this.$store.commit('GET_FILEINFO_DETAIL', this.item)
this.$store.commit('ADD_ITEM_TO_CLIPBOARD', this.item)
}
}
},
@@ -250,7 +253,7 @@ export default {
} else if (this.isFolder) {
//Clear selected data after open another folder
this.$store.commit('CLEAR_FILEINFO_DETAIL')
this.$store.commit('CLIPBOARD_CLEAR')
if (this.$isThisLocation('public')) {
this.$store.dispatch('browseShared', [{folder: this.item, back: false, init: false}])
@@ -284,12 +287,12 @@ export default {
events.$on('mobileSelecting:start', () => {
this.mobileMultiSelect = true
this.$store.commit('CLEAR_FILEINFO_DETAIL')
this.$store.commit('CLIPBOARD_CLEAR')
})
events.$on('mobileSelecting:stop', () => {
this.mobileMultiSelect = false
this.$store.commit('CLEAR_FILEINFO_DETAIL')
this.$store.commit('CLIPBOARD_CLEAR')
})
// Change item name
events.$on('change:name', (item) => {

43
resources/js/components/FilesView/FileItemList.vue
View File

@@ -90,9 +90,9 @@ export default {
CheckIcon,
},
computed: {
...mapGetters(['FilePreviewType', 'fileInfoDetail', 'data']),
...mapGetters(['FilePreviewType', 'clipboard', 'data']),
isClicked() {
return this.fileInfoDetail.some(element => element.id === this.item.id)
return this.clipboard.some(element => element.id === this.item.id)
},
isFolder() {
return this.item.type === 'folder'
@@ -152,8 +152,8 @@ export default {
},
showItemActions() {
// Load file info detail
this.$store.commit('CLEAR_FILEINFO_DETAIL')
this.$store.commit('GET_FILEINFO_DETAIL', this.item)
this.$store.commit('CLIPBOARD_CLEAR')
this.$store.commit('ADD_ITEM_TO_CLIPBOARD', this.item)
events.$emit('mobile-menu:show', 'file-menu')
},
@@ -176,36 +176,36 @@ export default {
if ((e.ctrlKey || e.metaKey) && !e.shiftKey) {
// Click + Ctrl
if (this.fileInfoDetail.some(item => item.id === this.item.id)) {
this.$store.commit('REMOVE_ITEM_FILEINFO_DETAIL', this.item)
if (this.clipboard.some(item => item.id === this.item.id)) {
this.$store.commit('REMOVE_ITEM_FROM_CLIPBOARD', this.item)
} else {
this.$store.commit('GET_FILEINFO_DETAIL', this.item)
this.$store.commit('ADD_ITEM_TO_CLIPBOARD', this.item)
}
} else if (e.shiftKey) {
// Click + Shift
let lastItem = this.data.indexOf(this.fileInfoDetail[this.fileInfoDetail.length - 1])
let lastItem = this.data.indexOf(this.clipboard[this.clipboard.length - 1])
let clickedItem = this.data.indexOf(this.item)
// If Click + Shift + Ctrl dont remove already selected items
if (!e.ctrlKey && !e.metaKey) {
this.$store.commit('CLEAR_FILEINFO_DETAIL')
this.$store.commit('CLIPBOARD_CLEAR')
}
//Shift selecting from top to bottom
if (lastItem < clickedItem) {
for (let i = lastItem; i <= clickedItem; i++) {
this.$store.commit('GET_FILEINFO_DETAIL', this.data[i])
this.$store.commit('ADD_ITEM_TO_CLIPBOARD', this.data[i])
}
//Shift selecting from bottom to top
} else {
for (let i = lastItem; i >= clickedItem; i--) {
this.$store.commit('GET_FILEINFO_DETAIL', this.data[i])
this.$store.commit('ADD_ITEM_TO_CLIPBOARD', this.data[i])
}
}
} else {
// Click
this.$store.commit('CLEAR_FILEINFO_DETAIL')
this.$store.commit('GET_FILEINFO_DETAIL', this.item)
this.$store.commit('CLIPBOARD_CLEAR')
this.$store.commit('ADD_ITEM_TO_CLIPBOARD', this.item)
}
}
@@ -221,17 +221,20 @@ export default {
} else {
if (this.isImage || this.isVideo || this.isAudio || this.isPdf) {
this.$store.commit('LOAD_FILEINFO_DETAIL', this.item)
this.$store.commit('CLIPBOARD_CLEAR')
this.$store.commit('ADD_ITEM_TO_CLIPBOARD', this.item)
events.$emit('file-preview:show')
}
}
}
if (this.mobileMultiSelect && this.$isMobile()) {
if (this.fileInfoDetail.some(item => item.id === this.item.id)) {
this.$store.commit('REMOVE_ITEM_FILEINFO_DETAIL', this.item)
if (this.clipboard.some(item => item.id === this.item.id)) {
this.$store.commit('REMOVE_ITEM_FROM_CLIPBOARD', this.item)
} else {
this.$store.commit('GET_FILEINFO_DETAIL', this.item)
this.$store.commit('ADD_ITEM_TO_CLIPBOARD', this.item)
}
}
},
@@ -245,7 +248,7 @@ export default {
} else if (this.isFolder) {
// Clear selected items after open another folder
this.$store.commit('CLEAR_FILEINFO_DETAIL')
this.$store.commit('CLIPBOARD_CLEAR')
if (this.$isThisLocation('public')) {
this.$store.dispatch('browseShared', [{ folder: this.item, back: false, init: false }])
@@ -279,12 +282,12 @@ export default {
events.$on('mobileSelecting:start', () => {
this.mobileMultiSelect = true
this.$store.commit('CLEAR_FILEINFO_DETAIL')
this.$store.commit('CLIPBOARD_CLEAR')
})
events.$on('mobileSelecting:stop', () => {
this.mobileMultiSelect = false
this.$store.commit('CLEAR_FILEINFO_DETAIL')
this.$store.commit('CLIPBOARD_CLEAR')
})
// Change item name

50
resources/js/components/FilesView/FileMenuMobile.vue
View File

@@ -1,10 +1,10 @@
<template>
<MenuMobile name="file-menu">
<ThumbnailItem class="item-thumbnail" :item="fileInfoDetail[0]" info="metadata" />
<ThumbnailItem class="item-thumbnail" :item="clipboard[0]" info="metadata" />
<!--Trash location-->
<MenuMobileGroup v-if="$isThisLocation(['trash', 'trash-root']) && $checkPermission('master')">
<OptionGroup v-if="fileInfoDetail[0]">
<OptionGroup v-if="clipboard[0]">
<Option @click.native="restoreItem" :title="$t('context_menu.restore')" icon="restore" />
<Option @click.native="deleteItem" :title="$t('context_menu.delete')" icon="delete" />
</OptionGroup>
@@ -17,13 +17,13 @@
<!--Shared location-->
<MenuMobileGroup v-if="$isThisLocation(['shared']) && $checkPermission('master')">
<OptionGroup v-if="fileInfoDetail[0] && isFolder">
<OptionGroup v-if="clipboard[0] && isFolder">
<Option @click.native="addToFavourites" :title="favouritesTitle" icon="star" />
</OptionGroup>
<OptionGroup v-if="fileInfoDetail[0]">
<OptionGroup v-if="clipboard[0]">
<Option @click.native="renameItem" :title="$t('context_menu.rename')" icon="rename" />
<Option @click.native="shareItem" :title="fileInfoDetail[0].shared ? $t('context_menu.share_edit') : $t('context_menu.share')" icon="share" />
<Option @click.native="shareItem" :title="clipboard[0].shared ? $t('context_menu.share_edit') : $t('context_menu.share')" icon="share" />
<Option @click.native="deleteItem" :title="$t('context_menu.delete')" icon="trash" />
</OptionGroup>
@@ -35,14 +35,14 @@
<!--Base location for user-->
<MenuMobileGroup v-if="$isThisLocation(['base', 'participant_uploads', 'latest']) && $checkPermission('master')">
<OptionGroup v-if="fileInfoDetail[0] && isFolder">
<OptionGroup v-if="clipboard[0] && isFolder">
<Option @click.native="addToFavourites" :title="favouritesTitle" icon="star" />
</OptionGroup>
<OptionGroup v-if="fileInfoDetail[0]">
<OptionGroup v-if="clipboard[0]">
<Option @click.native="renameItem" :title="$t('context_menu.rename')" icon="rename" />
<Option @click.native="moveItem" :title="$t('context_menu.move')" icon="move-item" />
<Option @click.native="shareItem" :title="fileInfoDetail[0].shared ? $t('context_menu.share_edit') : $t('context_menu.share')" icon="share" />
<Option @click.native="shareItem" :title="clipboard[0].shared ? $t('context_menu.share_edit') : $t('context_menu.share')" icon="share" />
<Option @click.native="deleteItem" :title="$t('context_menu.delete')" icon="trash" />
</OptionGroup>
@@ -55,8 +55,8 @@
<!--Base location for guest-->
<MenuMobileGroup v-if="$isThisLocation(['base', 'public']) && $checkPermission('editor')">
<OptionGroup>
<Option v-if="fileInfoDetail[0]" @click.native="renameItem" :title="$t('context_menu.rename')" icon="rename" />
<Option v-if="fileInfoDetail[0]" @click.native="moveItem" :title="$t('context_menu.move')" icon="move-item" />
<Option v-if="clipboard[0]" @click.native="renameItem" :title="$t('context_menu.rename')" icon="rename" />
<Option v-if="clipboard[0]" @click.native="moveItem" :title="$t('context_menu.move')" icon="move-item" />
<Option @click.native="deleteItem" :title="$t('context_menu.delete')" icon="trash" />
</OptionGroup>
@@ -96,7 +96,7 @@ export default {
},
computed: {
...mapGetters([
'fileInfoDetail',
'clipboard',
'user',
]),
favourites() {
@@ -108,16 +108,16 @@ export default {
: this.$t('context_menu.add_to_favourites')
},
isInFavourites() {
return this.favourites.find(el => el.id === this.fileInfoDetail[0].id)
return this.favourites.find(el => el.id === this.clipboard[0].id)
},
isFile() {
return !this.isImage && !this.isFolder
},
isImage() {
return this.fileInfoDetail[0] && this.fileInfoDetail[0].type === 'image'
return this.clipboard[0] && this.clipboard[0].type === 'image'
},
isFolder() {
return this.fileInfoDetail[0] && this.fileInfoDetail[0].type === 'folder'
return this.clipboard[0] && this.clipboard[0].type === 'folder'
}
},
data() {
@@ -127,42 +127,42 @@ export default {
},
methods: {
downloadFolder() {
this.$store.dispatch('downloadFolder', this.fileInfoDetail[0])
this.$store.dispatch('downloadFolder', this.clipboard[0])
},
moveItem() {
events.$emit('popup:open', {name: 'move', item: [this.fileInfoDetail[0]]})
events.$emit('popup:open', {name: 'move', item: [this.clipboard[0]]})
},
shareItem() {
let event = this.fileInfoDetail[0].shared
let event = this.clipboard[0].shared
? 'share-edit'
: 'share-create'
events.$emit('popup:open', {
name: event,
item: this.fileInfoDetail[0]
item: this.clipboard[0]
})
},
addToFavourites() {
if (this.favourites && !this.favourites.find(el => el.id === this.fileInfoDetail[0].id)) {
this.$store.dispatch('addToFavourites', this.fileInfoDetail[0])
if (this.favourites && !this.favourites.find(el => el.id === this.clipboard[0].id)) {
this.$store.dispatch('addToFavourites', this.clipboard[0])
} else {
this.$store.dispatch('removeFromFavourites', this.fileInfoDetail[0])
this.$store.dispatch('removeFromFavourites', this.clipboard[0])
}
},
downloadItem() {
this.$downloadFile(
this.fileInfoDetail[0].file_url,
this.fileInfoDetail[0].name + '.' + this.fileInfoDetail[0].mimetype
this.clipboard[0].file_url,
this.clipboard[0].name + '.' + this.clipboard[0].mimetype
)
},
deleteItem() {
this.$store.dispatch('deleteItem')
},
restoreItem() {
this.$store.dispatch('restoreItem', this.fileInfoDetail[0])
this.$store.dispatch('restoreItem', this.clipboard[0])
},
renameItem() {
events.$emit('popup:open', {name: 'rename-item', item: this.fileInfoDetail[0]})
events.$emit('popup:open', {name: 'rename-item', item: this.clipboard[0]})
},
}
}

30
resources/js/components/FilesView/FilePreviewMedia.vue
View File

@@ -1,5 +1,5 @@
<template>
<div class="media-full-preview" id="mediaPreview" v-if="fileInfoDetail[0]">
<div class="media-full-preview" id="mediaPreview" v-if="clipboard[0]">
<!--Arrow navigation-->
<div v-if="files.length > 1" class="navigation-arrows">
@@ -79,23 +79,23 @@ export default {
},
computed: {
...mapGetters([
'fileInfoDetail',
'clipboard',
'data',
]),
currentFile() {
return this.files[Math.abs(this.currentIndex) % this.files.length]
},
isPDF() {
return this.fileInfoDetail[0].mimetype === 'pdf'
return this.clipboard[0].mimetype === 'pdf'
},
isVideo() {
return this.fileInfoDetail[0].type === 'video'
return this.clipboard[0].type === 'video'
},
isAudio() {
return this.fileInfoDetail[0].type === 'audio'
return this.clipboard[0].type === 'audio'
},
isImage() {
return this.fileInfoDetail[0].type === 'image'
return this.clipboard[0].type === 'image'
}
},
data() {
@@ -113,21 +113,21 @@ export default {
events.$emit('file-preview:hide')
},
currentFile() {
if (this.fileInfoDetail[0]) {
this.$store.commit('CLEAR_FILEINFO_DETAIL')
this.$store.commit('GET_FILEINFO_DETAIL', this.currentFile)
if (this.clipboard[0]) {
this.$store.commit('CLIPBOARD_CLEAR')
this.$store.commit('ADD_ITEM_TO_CLIPBOARD', this.currentFile)
// Init pdf instance
if (this.fileInfoDetail[0].mimetype === 'pdf') {
if (this.clipboard[0].mimetype === 'pdf') {
this.getPdf()
}
}
},
fileInfoDetail() {
if (!this.fileInfoDetail[0]) {
clipboard() {
if (!this.clipboard[0]) {
this.currentIndex -= 1
this.$store.commit('GET_FILEINFO_DETAIL', this.currentFile)
this.$store.commit('ADD_ITEM_TO_CLIPBOARD', this.currentFile)
this.files = []
}
@@ -172,7 +172,7 @@ export default {
self.pdfdata.then(pdf => self.numPages = pdf.numPages);
},
getFilesForView() {
let requestedFile = this.fileInfoDetail[0]
let requestedFile = this.clipboard[0]
this.data.map(element => {
@@ -189,7 +189,7 @@ export default {
})
this.files.forEach((element, index) => {
if (element.id === this.fileInfoDetail[0].id) {
if (element.id === this.clipboard[0].id) {
this.currentIndex = index
}
})

28
resources/js/components/FilesView/FilePreviewToolbar.vue
View File

@@ -1,9 +1,9 @@
<template>
<div class="navigation-panel" v-if="fileInfoDetail[0]">
<div class="navigation-panel" v-if="clipboard[0]">
<div class="name-wrapper">
<x-icon @click="closeFullPreview" size="22" class="icon-close hover-text-theme" />
<div class="name-count-wrapper">
<p class="title">{{ fileInfoDetail[0].name }}</p>
<p class="title">{{ clipboard[0].name }}</p>
<span class="file-count"> ({{ showingImageIndex + ' ' + $t('pronouns.of') + ' ' + files.length }}) </span>
</div>
<span @click.stop="menuOpen" id="fast-preview-menu" class="fast-menu-icon group">
@@ -12,7 +12,7 @@
</div>
<div class="created-at-wrapper">
<p>{{ fileInfoDetail[0].filesize }}, {{ fileInfoDetail[0].created_at }}</p>
<p>{{ clipboard[0].filesize }}, {{ clipboard[0].created_at }}</p>
</div>
<div class="navigation-icons">
@@ -44,28 +44,28 @@
},
computed: {
...mapGetters([
'fileInfoDetail',
'clipboard',
'data'
]),
isImage() {
return this.fileInfoDetail[0].type === 'image'
return this.clipboard[0].type === 'image'
},
isPdf() {
return this.fileInfoDetail[0].mimetype === 'pdf'
return this.clipboard[0].mimetype === 'pdf'
},
files() {
let files = []
this.data.map(element => {
if (this.fileInfoDetail[0].mimetype === 'pdf') {
if (this.clipboard[0].mimetype === 'pdf') {
if (element.mimetype === 'pdf')
files.push(element)
} else {
if (element.type === this.fileInfoDetail[0].type)
if (element.type === this.clipboard[0].type)
files.push(element)
}
})
@@ -76,7 +76,7 @@
let activeIndex = undefined
this.files.forEach((element, index) => {
if (element.id === this.fileInfoDetail[0].id) {
if (element.id === this.clipboard[0].id) {
activeIndex = index + 1
}
})
@@ -106,25 +106,25 @@
},
downloadItem() {
this.$downloadFile(
this.fileInfoDetail[0].file_url,
this.fileInfoDetail[0].name + '.' + this.fileInfoDetail[0].mimetype
this.clipboard[0].file_url,
this.clipboard[0].name + '.' + this.clipboard[0].mimetype
)
},
shareItem() {
let event = this.fileInfoDetail[0].shared
let event = this.clipboard[0].shared
? 'share-edit'
: 'share-create'
events.$emit('popup:open', {
name: event,
item: this.fileInfoDetail[0]
item: this.clipboard[0]
})
},
menuOpen() {
if (this.$isMobile()) {
events.$emit('mobile-menu:show', 'file-menu')
} else {
events.$emit('showContextMenuPreview:show', this.fileInfoDetail[0])
events.$emit('showContextMenuPreview:show', this.clipboard[0])
}
},
closeFullPreview() {

64
resources/js/components/FilesView/ImageMetaData.vue
View File

@@ -1,81 +1,81 @@
<template>
<div>
<ul class="meta-data-list">
<li v-if="fileInfoDetail.metadata.DateTimeOriginal">
<li v-if="clipboard.metadata.DateTimeOriginal">
<span>{{ $t('file_detail_meta.time_data') }}</span>
<b>{{ fileInfoDetail.metadata.DateTimeOriginal }}</b>
<b>{{ clipboard.metadata.DateTimeOriginal }}</b>
</li>
<li v-if="fileInfoDetail.metadata.Artist">
<li v-if="clipboard.metadata.Artist">
<span>{{ $t('file_detail_meta.author') }}</span>
<b>{{ fileInfoDetail.metadata.Artist }}</b>
<b>{{ clipboard.metadata.Artist }}</b>
</li>
<li v-if="fileInfoDetail.metadata.ExifImageWidth && fileInfoDetail.metadata.ExifImageLength">
<li v-if="clipboard.metadata.ExifImageWidth && clipboard.metadata.ExifImageLength">
<span>{{ $t('file_detail_meta.dimension') }}</span>
<b>{{ fileInfoDetail.metadata.ExifImageWidth }}x{{ fileInfoDetail.metadata.ExifImageLength }}</b>
<b>{{ clipboard.metadata.ExifImageWidth }}x{{ clipboard.metadata.ExifImageLength }}</b>
</li>
<li v-if="fileInfoDetail.metadata.XResolution && fileInfoDetail.metadata.YResolution">
<li v-if="clipboard.metadata.XResolution && clipboard.metadata.YResolution">
<span>{{ $t('file_detail_meta.resolution') }}</span>
<b>{{ fileInfoDetail.metadata.XResolution }}x{{ fileInfoDetail.metadata.YResolution }}</b>
<b>{{ clipboard.metadata.XResolution }}x{{ clipboard.metadata.YResolution }}</b>
</li>
<li v-if="fileInfoDetail.metadata.ColorSpace">
<li v-if="clipboard.metadata.ColorSpace">
<span> {{ $t('file_detail_meta.color_space') }}</span>
<b>{{ fileInfoDetail.metadata.ColorSpace}}</b>
<b>{{ clipboard.metadata.ColorSpace}}</b>
</li>
<!--TODO: Colour profile:sRGB IEC61966-2.1-->
<li v-if="fileInfoDetail.metadata.Make">
<li v-if="clipboard.metadata.Make">
<span>{{ $t('file_detail_meta.make') }}</span>
<b>{{ fileInfoDetail.metadata.Make }}</b>
<b>{{ clipboard.metadata.Make }}</b>
</li>
<li v-if="fileInfoDetail.metadata.Model">
<li v-if="clipboard.metadata.Model">
<span>{{ $t('file_detail_meta.model') }}</span>
<b>{{ fileInfoDetail.metadata.Model }}</b>
<b>{{ clipboard.metadata.Model }}</b>
</li>
<li v-if="fileInfoDetail.metadata.ApertureValue">
<li v-if="clipboard.metadata.ApertureValue">
<span>{{ $t('file_detail_meta.aperture_value') }}</span>
<b v-html="parseInt(fileInfoDetail.metadata.ApertureValue) / 100"></b>
<b v-html="parseInt(clipboard.metadata.ApertureValue) / 100"></b>
</li>
<li v-if="fileInfoDetail.metadata.ExposureTime">
<li v-if="clipboard.metadata.ExposureTime">
<span>{{ $t('file_detail_meta.exposure') }}</span>
<b>{{ fileInfoDetail.metadata.ExposureTime }}</b>
<b>{{ clipboard.metadata.ExposureTime }}</b>
</li>
<li v-if="fileInfoDetail.metadata.FocalLength">
<li v-if="clipboard.metadata.FocalLength">
<span>{{ $t('file_detail_meta.focal') }}</span>
<b>{{ fileInfoDetail.metadata.FocalLength }}</b>
<b>{{ clipboard.metadata.FocalLength }}</b>
</li>
<li v-if="fileInfoDetail.metadata.ISOSpeedRatings">
<li v-if="clipboard.metadata.ISOSpeedRatings">
<span>{{ $t('file_detail_meta.iso') }}</span>
<b>{{ fileInfoDetail.metadata.ISOSpeedRatings }}</b>
<b>{{ clipboard.metadata.ISOSpeedRatings }}</b>
</li>
<li v-if="fileInfoDetail.metadata.COMPUTED.ApertureFNumber">
<li v-if="clipboard.metadata.COMPUTED.ApertureFNumber">
<span>{{ $t('file_detail_meta.aperature') }}</span>
<b>{{ fileInfoDetail.metadata.COMPUTED.ApertureFNumber }}</b>
<b>{{ clipboard.metadata.COMPUTED.ApertureFNumber }}</b>
</li>
<li v-if="fileInfoDetail.metadata.COMPUTED.CCDWidth">
<li v-if="clipboard.metadata.COMPUTED.CCDWidth">
<span>{{ $t('file_detail_meta.camera_lens') }}</span>
<b>{{ fileInfoDetail.metadata.COMPUTED.CCDWidth }}</b>
<b>{{ clipboard.metadata.COMPUTED.CCDWidth }}</b>
</li>
<li v-if="fileInfoDetail.metadata.GPSLongitude">
<li v-if="clipboard.metadata.GPSLongitude">
<span>{{ $t('file_detail_meta.longitude') }}</span>
<b>{{ formatGps(fileInfoDetail.metadata.GPSLongitude,fileInfoDetail.metadata.GPSLongitudeRef) }}</b>
<b>{{ formatGps(clipboard.metadata.GPSLongitude,clipboard.metadata.GPSLongitudeRef) }}</b>
</li>
<li v-if="fileInfoDetail.metadata.GPSLatitude">
<li v-if="clipboard.metadata.GPSLatitude">
<span>{{ $t('file_detail_meta.latitude') }}</span>
<b>{{ formatGps(fileInfoDetail.metadata.GPSLatitude, fileInfoDetail.metadata.GPSLatitudeRef) }}</b>
<b>{{ formatGps(clipboard.metadata.GPSLatitude, clipboard.metadata.GPSLatitudeRef) }}</b>
</li>
</ul>
@@ -89,8 +89,8 @@ import {split} from 'lodash'
export default {
name: 'ImageMetaData',
computed: {
fileInfoDetail() {
return this.$store.getters.fileInfoDetail[0]
clipboard() {
return this.$store.getters.clipboard[0]
},
},
methods: {

1
resources/js/components/FilesView/MobileToolbar.vue
View File

@@ -40,7 +40,6 @@
...mapGetters([
'fileInfoVisible',
'FilePreviewType',
'fileInfoDetail',
'currentFolder',
'browseHistory',
'homeDirectory',

14
resources/js/components/FilesView/MultiSelectToolbarMobile.vue
View File

@@ -1,9 +1,9 @@
<template>
<transition name="context-menu">
<div class="multiselect-actions" v-if="mobileMultiSelect">
<ToolbarButton class="action-btn" v-if="!$isThisLocation(['trash', 'trash-root' , 'shared', 'latest']) && $checkPermission('master') || $checkPermission('editor')" source="move" :action="$t('actions.move')" :class="{'is-inactive' : fileInfoDetail.length < 1}" @click.native="moveItem" />
<ToolbarButton class="action-btn" v-if="!$isThisLocation(['trash', 'trash-root' , 'shared', 'latest']) && $checkPermission('master') || $checkPermission('editor')" source="move" :action="$t('actions.move')" :class="{'is-inactive' : clipboard.length < 1}" @click.native="moveItem" />
<ToolbarButton class="action-btn" v-if="!$isThisLocation(['shared']) && $checkPermission('master') || $checkPermission('editor')" source="trash" :class="{'is-inactive' : fileInfoDetail.length < 1}" :action="$t('actions.delete')" @click.native="deleteItem" />
<ToolbarButton class="action-btn" v-if="!$isThisLocation(['shared']) && $checkPermission('master') || $checkPermission('editor')" source="trash" :class="{'is-inactive' : clipboard.length < 1}" :action="$t('actions.delete')" @click.native="deleteItem" />
<ToolbarButton class="action-btn" v-if="!$isThisLocation(['shared'])" source="download" :class="{'is-inactive': canDownloadItems}" :action="$t('actions.delete')" @click.native="downloadItem" />
@@ -23,9 +23,9 @@ export default {
name: 'MultiSelectToolbarMobile',
components: {ToolbarButton},
computed: {
...mapGetters(['fileInfoDetail']),
...mapGetters(['clipboard']),
canDownloadItems() {
return this.fileInfoDetail.filter(item => item.type === 'folder').length !== 0
return this.clipboard.filter(item => item.type === 'folder').length !== 0
}
},
data() {
@@ -42,16 +42,16 @@ export default {
events.$emit('mobileSelecting:stop')
},
downloadItem() {
if (this.fileInfoDetail.length > 1)
if (this.clipboard.length > 1)
this.$store.dispatch('downloadFiles')
else {
this.$downloadFile(this.fileInfoDetail[0].file_url, this.fileInfoDetail[0].name + '.' + this.fileInfoDetail[0].mimetype)
this.$downloadFile(this.clipboard[0].file_url, this.clipboard[0].name + '.' + this.clipboard[0].mimetype)
}
this.closeSelecting()
},
moveItem() {
// Open move item popup
events.$emit('popup:open', {name: 'move', item: [this.fileInfoDetail[0]]})
events.$emit('popup:open', {name: 'move', item: [this.clipboard[0]]})
},
deleteItem() {
//Delete items