diff --git a/frontend/src/components/prompts/Prompts.vue b/frontend/src/components/prompts/Prompts.vue index 3bd80f99..937e6232 100644 --- a/frontend/src/components/prompts/Prompts.vue +++ b/frontend/src/components/prompts/Prompts.vue @@ -108,7 +108,9 @@ export default { return (matched && this.show) || null; }, showOverlay: function () { - return this.show !== null && this.show !== "search" && this.show !== "more"; + return ( + this.show !== null && this.show !== "search" && this.show !== "more" + ); }, }, methods: { diff --git a/frontend/src/components/prompts/UploadFiles.vue b/frontend/src/components/prompts/UploadFiles.vue index 9ef86eff..d0bf7cc3 100644 --- a/frontend/src/components/prompts/UploadFiles.vue +++ b/frontend/src/components/prompts/UploadFiles.vue @@ -15,7 +15,13 @@
-
diff --git a/frontend/src/store/getters.js b/frontend/src/store/getters.js index 18a58e55..ed3e3b4c 100644 --- a/frontend/src/store/getters.js +++ b/frontend/src/store/getters.js @@ -14,7 +14,8 @@ const getters = { return Math.ceil((sum / totalSize) * 100); }, filesInUploadCount: (state) => { - let total = Object.keys(state.upload.uploads).length + state.upload.queue.length; + let total = + Object.keys(state.upload.uploads).length + state.upload.queue.length; return total; }, filesInUpload: (state) => { diff --git a/frontend/src/store/modules/upload.js b/frontend/src/store/modules/upload.js index d703888e..4110cb33 100644 --- a/frontend/src/store/modules/upload.js +++ b/frontend/src/store/modules/upload.js @@ -97,7 +97,9 @@ const actions = { { leading: true, trailing: false } ); - await api.post(item.path, item.file, item.overwrite, onUpload).catch(Vue.prototype.$showError); + await api + .post(item.path, item.file, item.overwrite, onUpload) + .catch(Vue.prototype.$showError); } context.dispatch("finishUpload", item); diff --git a/frontend/src/views/Layout.vue b/frontend/src/views/Layout.vue index a503161a..3496a154 100644 --- a/frontend/src/views/Layout.vue +++ b/frontend/src/views/Layout.vue @@ -35,7 +35,8 @@ export default { $route: function () { this.$store.commit("resetSelected"); this.$store.commit("multiple", false); - if (this.$store.state.show !== "success") this.$store.commit("closeHovers"); + if (this.$store.state.show !== "success") + this.$store.commit("closeHovers"); }, }, }; diff --git a/frontend/src/views/files/Listing.vue b/frontend/src/views/files/Listing.vue index 9f7027aa..ef185fe4 100644 --- a/frontend/src/views/files/Listing.vue +++ b/frontend/src/views/files/Listing.vue @@ -2,20 +2,68 @@
- <action class="search-button" icon="search" :label="$t('buttons.search')" @action="openSearch()" /> + <action + class="search-button" + icon="search" + :label="$t('buttons.search')" + @action="openSearch()" + /> <template #actions> <template v-if="!isMobile"> - <action v-if="headerButtons.share" icon="share" :label="$t('buttons.share')" show="share" /> - <action v-if="headerButtons.rename" icon="mode_edit" :label="$t('buttons.rename')" show="rename" /> - <action v-if="headerButtons.copy" id="copy-button" icon="content_copy" :label="$t('buttons.copyFile')" show="copy" /> - <action v-if="headerButtons.move" id="move-button" icon="forward" :label="$t('buttons.moveFile')" show="move" /> - <action v-if="headerButtons.delete" id="delete-button" icon="delete" :label="$t('buttons.delete')" show="delete" /> + <action + v-if="headerButtons.share" + icon="share" + :label="$t('buttons.share')" + show="share" + /> + <action + v-if="headerButtons.rename" + icon="mode_edit" + :label="$t('buttons.rename')" + show="rename" + /> + <action + v-if="headerButtons.copy" + id="copy-button" + icon="content_copy" + :label="$t('buttons.copyFile')" + show="copy" + /> + <action + v-if="headerButtons.move" + id="move-button" + icon="forward" + :label="$t('buttons.moveFile')" + show="move" + /> + <action + v-if="headerButtons.delete" + id="delete-button" + icon="delete" + :label="$t('buttons.delete')" + show="delete" + /> </template> - <action v-if="headerButtons.shell" icon="code" :label="$t('buttons.shell')" @action="$store.commit('toggleShell')" /> - <action :icon="viewIcon" :label="$t('buttons.switchView')" @action="switchView" /> - <action v-if="headerButtons.download" icon="file_download" :label="$t('buttons.download')" @action="download" :counter="selectedCount" /> + <action + v-if="headerButtons.shell" + icon="code" + :label="$t('buttons.shell')" + @action="$store.commit('toggleShell')" + /> + <action + :icon="viewIcon" + :label="$t('buttons.switchView')" + @action="switchView" + /> + <action + v-if="headerButtons.download" + icon="file_download" + :label="$t('buttons.download')" + @action="download" + :counter="selectedCount" + /> <action v-if="headerButtons.upload" icon="file_upload" @@ -25,17 +73,46 @@ @action="upload" /> <action icon="info" :label="$t('buttons.info')" show="info" /> - <action icon="check_circle" :label="$t('buttons.selectMultiple')" @action="toggleMultipleSelection" /> + <action + icon="check_circle" + :label="$t('buttons.selectMultiple')" + @action="toggleMultipleSelection" + /> </template> </header-bar> <div v-if="isMobile" id="file-selection"> <span v-if="selectedCount > 0">{{ selectedCount }} selected</span> - <action v-if="headerButtons.share" icon="share" :label="$t('buttons.share')" show="share" /> - <action v-if="headerButtons.rename" icon="mode_edit" :label="$t('buttons.rename')" show="rename" /> - <action v-if="headerButtons.copy" icon="content_copy" :label="$t('buttons.copyFile')" show="copy" /> - <action v-if="headerButtons.move" icon="forward" :label="$t('buttons.moveFile')" show="move" /> - <action v-if="headerButtons.delete" icon="delete" :label="$t('buttons.delete')" show="delete" /> + <action + v-if="headerButtons.share" + icon="share" + :label="$t('buttons.share')" + show="share" + /> + <action + v-if="headerButtons.rename" + icon="mode_edit" + :label="$t('buttons.rename')" + show="rename" + /> + <action + v-if="headerButtons.copy" + icon="content_copy" + :label="$t('buttons.copyFile')" + show="copy" + /> + <action + v-if="headerButtons.move" + icon="forward" + :label="$t('buttons.moveFile')" + show="move" + /> + <action + v-if="headerButtons.delete" + icon="delete" + :label="$t('buttons.delete')" + show="delete" + /> </div> <div v-if="loading"> @@ -54,8 +131,21 @@ <i class="material-icons">sentiment_dissatisfied</i> <span>{{ $t("files.lonely") }}</span> </h2> - <input style="display: none" type="file" id="upload-input" @change="uploadInput($event)" multiple /> - <input style="display: none" type="file" id="upload-folder-input" @change="uploadInput($event)" webkitdirectory multiple /> + <input + style="display: none" + type="file" + id="upload-input" + @change="uploadInput($event)" + multiple + /> + <input + style="display: none" + type="file" + id="upload-folder-input" + @change="uploadInput($event)" + webkitdirectory + multiple + /> </div> <div v-else id="listing" ref="listing" :class="user.viewMode"> <div> @@ -135,12 +225,32 @@ </item> </div> - <input style="display: none" type="file" id="upload-input" @change="uploadInput($event)" multiple /> - <input style="display: none" type="file" id="upload-folder-input" @change="uploadInput($event)" webkitdirectory multiple /> + <input + style="display: none" + type="file" + id="upload-input" + @change="uploadInput($event)" + multiple + /> + <input + style="display: none" + type="file" + id="upload-folder-input" + @change="uploadInput($event)" + webkitdirectory + multiple + /> <div :class="{ active: $store.state.multiple }" id="multiple-selection"> <p>{{ $t("files.multipleSelectionEnabled") }}</p> - <div @click="$store.commit('multiple', false)" tabindex="0" role="button" :title="$t('files.clear')" :aria-label="$t('files.clear')" class="action"> + <div + @click="$store.commit('multiple', false)" + tabindex="0" + role="button" + :title="$t('files.clear')" + :aria-label="$t('files.clear')" + class="action" + > <i class="material-icons">clear</i> </div> </div> @@ -181,7 +291,15 @@ export default { }; }, computed: { - ...mapState(["req", "selected", "user", "show", "multiple", "selected", "loading"]), + ...mapState([ + "req", + "selected", + "user", + "show", + "multiple", + "selected", + "loading", + ]), ...mapGetters(["selectedCount", "filesInUploadCount"]), nameSorted() { return this.req.sorting.by === "name"; @@ -419,7 +537,9 @@ export default { let items = []; for (let item of this.$store.state.clipboard.items) { - const from = item.from.endsWith("/") ? item.from.slice(0, -1) : item.from; + const from = item.from.endsWith("/") + ? item.from.slice(0, -1) + : item.from; const to = this.$route.path + encodeURIComponent(item.name); items.push({ from, to, name: item.name }); } @@ -480,7 +600,9 @@ export default { }, colunmsResize() { // Update the columns size based on the window width. - let columns = Math.floor(document.querySelector("main").offsetWidth / this.columnWidth); + let columns = Math.floor( + document.querySelector("main").offsetWidth / this.columnWidth + ); let items = css(["#listing.mosaic .item", ".mosaic#listing .item"]); if (columns === 0) columns = 1; items.style.width = `calc(${100 / columns}% - 1em)`; @@ -498,7 +620,9 @@ export default { if (currentPos > triggerPos) { // Quantity of items needed to fill 2x of the window height - const showQuantity = Math.ceil((window.innerHeight * 2) / this.itemWeight); + const showQuantity = Math.ceil( + (window.innerHeight * 2) / this.itemWeight + ); // Increase the number of displayed items this.showLimit += showQuantity; @@ -540,9 +664,15 @@ export default { let files = await upload.scanFiles(dt); let items = this.req.items; - let path = this.$route.path.endsWith("/") ? this.$route.path : this.$route.path + "/"; + let path = this.$route.path.endsWith("/") + ? this.$route.path + : this.$route.path + "/"; - if (el !== null && el.classList.contains("item") && el.dataset.dir === "true") { + if ( + el !== null && + el.classList.contains("item") && + el.dataset.dir === "true" + ) { // Get url from ListingItem instance path = el.__vue__.url; @@ -574,7 +704,9 @@ export default { this.$store.commit("closeHovers"); let files = event.currentTarget.files; - let folder_upload = files[0].webkitRelativePath !== undefined && files[0].webkitRelativePath !== ""; + let folder_upload = + files[0].webkitRelativePath !== undefined && + files[0].webkitRelativePath !== ""; if (folder_upload) { for (let i = 0; i < files.length; i++) { @@ -583,7 +715,9 @@ export default { } } - let path = this.$route.path.endsWith("/") ? this.$route.path : this.$route.path + "/"; + let path = this.$route.path.endsWith("/") + ? this.$route.path + : this.$route.path + "/"; let conflict = upload.checkConflict(files, this.req.items); if (conflict) { @@ -626,7 +760,9 @@ export default { } try { - await users.update({ id: this.user.id, sorting: { by, asc } }, ["sorting"]); + await users.update({ id: this.user.id, sorting: { by, asc } }, [ + "sorting", + ]); } catch (e) { this.$showError(e); } @@ -704,7 +840,10 @@ export default { if (this.filesInUploadCount > 0) { this.$store.commit("showHover", "uploadFiles"); } else { - if (typeof window.DataTransferItem !== "undefined" && typeof DataTransferItem.prototype.webkitGetAsEntry !== "undefined") { + if ( + typeof window.DataTransferItem !== "undefined" && + typeof DataTransferItem.prototype.webkitGetAsEntry !== "undefined" + ) { this.$store.commit("showHover", "upload"); } else { document.getElementById("upload-input").click(); @@ -730,7 +869,9 @@ export default { const windowHeight = window.innerHeight; // Quantity of items needed to fill 2x of the window height - const showQuantity = Math.ceil((windowHeight + windowHeight * 2) / this.itemWeight); + const showQuantity = Math.ceil( + (windowHeight + windowHeight * 2) / this.itemWeight + ); // Less items to display than current if (this.showLimit > showQuantity && !fit) return;