diff --git a/_assets/src/components/Main.vue b/_assets/src/components/Main.vue index fa7c6215..4f4c3172 100644 --- a/_assets/src/components/Main.vue +++ b/_assets/src/components/Main.vue @@ -9,6 +9,9 @@
+ @@ -141,7 +144,7 @@ export default { window.addEventListener('keydown', (event) => { // Esc! if (event.keyCode === 27) { - this.$store.commit('closePrompts') + this.$store.commit('closeHovers') // Unselect all files and folders. if (this.req.kind === 'listing') { @@ -159,20 +162,20 @@ export default { // Del! if (event.keyCode === 46) { if (this.showDeleteButton()) { - this.$store.commit('showPrompt', 'delete') + this.$store.commit('showHover', 'delete') } } // F1! if (event.keyCode === 112) { event.preventDefault() - this.$store.commit('showPrompt', 'help') + this.$store.commit('showHover', 'help') } // F2! if (event.keyCode === 113) { if (this.showRenameButton()) { - this.$store.commit('showPrompt', 'rename') + this.$store.commit('showHover', 'rename') } } @@ -201,7 +204,7 @@ export default { // Reset selected items and multiple selection. this.$store.commit('resetSelected') this.$store.commit('multiple', false) - this.$store.commit('closePrompts') + this.$store.commit('closeHovers') let url = this.$route.path if (url === '') url = '/' @@ -224,6 +227,9 @@ export default { this.loading = false }) }, + openSearch () { + this.$store.commit('showHover', 'search') + }, showUpload: function () { if (this.req.kind === 'editor') return false return this.user.allowNew diff --git a/_assets/src/components/Search.vue b/_assets/src/components/Search.vue index 197885c5..ef214703 100644 --- a/_assets/src/components/Search.vue +++ b/_assets/src/components/Search.vue @@ -41,7 +41,6 @@ export default { data: function () { return { value: '', - active: false, ongoing: false, scrollable: null, search: [], @@ -49,7 +48,11 @@ export default { } }, computed: { - ...mapState(['user']), + ...mapState(['user', 'show']), + // Computed property for activeness of search. + active () { + return (this.show === 'search') + }, // Placeholder value. placeholder: function () { if (this.user.allowCommands && this.user.commands.length > 0) { @@ -88,14 +91,14 @@ export default { // when it's pressed, it closes the search window. window.addEventListener('keydown', (event) => { if (event.keyCode === 27) { - this.active = false + this.$store.commit('closeHovers') } }) }, methods: { // Sets the search to active. open: function (event) { - this.active = true + this.$store.commit('showHover', 'search') }, // Closes the search and prevents the event // of propagating so it doesn't trigger the @@ -103,7 +106,7 @@ export default { close: function (event) { event.stopPropagation() event.preventDefault() - this.active = false + this.$store.commit('closeHovers') }, // Checks if the current input is a supported command. supported: function () { @@ -127,7 +130,6 @@ export default { return } - this.active = true this.search.length = 0 this.commands.length = 0 }, diff --git a/_assets/src/components/Sidebar.vue b/_assets/src/components/Sidebar.vue index 4d92be61..9b0318c9 100644 --- a/_assets/src/components/Sidebar.vue +++ b/_assets/src/components/Sidebar.vue @@ -6,12 +6,12 @@
- - @@ -60,7 +60,7 @@ export default { }, methods: { help: function () { - this.$store.commit('showPrompt', 'help') + this.$store.commit('showHover', 'help') }, logout: auth.logout } diff --git a/_assets/src/components/buttons/DeleteButton.vue b/_assets/src/components/buttons/DeleteButton.vue index 65ca97cd..09082d7a 100644 --- a/_assets/src/components/buttons/DeleteButton.vue +++ b/_assets/src/components/buttons/DeleteButton.vue @@ -10,7 +10,7 @@ export default { name: 'delete-button', methods: { show: function (event) { - this.$store.commit('showPrompt', 'delete') + this.$store.commit('showHover', 'delete') } } } diff --git a/_assets/src/components/buttons/DownloadButton.vue b/_assets/src/components/buttons/DownloadButton.vue index ed89401b..cb38638d 100644 --- a/_assets/src/components/buttons/DownloadButton.vue +++ b/_assets/src/components/buttons/DownloadButton.vue @@ -28,7 +28,7 @@ export default { return } - this.$store.commit('showPrompt', 'download') + this.$store.commit('showHover', 'download') } } } diff --git a/_assets/src/components/buttons/InfoButton.vue b/_assets/src/components/buttons/InfoButton.vue index ee617fb0..6e2ef91f 100644 --- a/_assets/src/components/buttons/InfoButton.vue +++ b/_assets/src/components/buttons/InfoButton.vue @@ -1,10 +1,17 @@ diff --git a/_assets/src/components/buttons/MoveButton.vue b/_assets/src/components/buttons/MoveButton.vue index 4be8aeda..93c75b3b 100644 --- a/_assets/src/components/buttons/MoveButton.vue +++ b/_assets/src/components/buttons/MoveButton.vue @@ -1,10 +1,17 @@ diff --git a/_assets/src/components/buttons/RenameButton.vue b/_assets/src/components/buttons/RenameButton.vue index a54f677a..dc28dc27 100644 --- a/_assets/src/components/buttons/RenameButton.vue +++ b/_assets/src/components/buttons/RenameButton.vue @@ -1,10 +1,17 @@ diff --git a/_assets/src/components/prompts/Delete.vue b/_assets/src/components/prompts/Delete.vue index 05982d73..309e8c12 100644 --- a/_assets/src/components/prompts/Delete.vue +++ b/_assets/src/components/prompts/Delete.vue @@ -5,7 +5,7 @@

Are you sure you want to delete {{ selectedCount }} file(s)?

- +
@@ -22,9 +22,9 @@ export default { ...mapState(['req', 'selected']) }, methods: { - ...mapMutations(['closePrompts']), + ...mapMutations(['closeHovers']), submit: function (event) { - this.closePrompts() + this.closeHovers() // buttons.setLoading('delete') if (this.req.kind !== 'listing') { diff --git a/_assets/src/components/prompts/Download.vue b/_assets/src/components/prompts/Download.vue index 76809b40..18b401ba 100644 --- a/_assets/src/components/prompts/Download.vue +++ b/_assets/src/components/prompts/Download.vue @@ -34,7 +34,7 @@ export default { api.download(format, ...files) } - this.$store.commit('closePrompts') + this.$store.commit('closeHovers') } } } diff --git a/_assets/src/components/prompts/Help.vue b/_assets/src/components/prompts/Help.vue index 3873c127..454e76bf 100644 --- a/_assets/src/components/prompts/Help.vue +++ b/_assets/src/components/prompts/Help.vue @@ -20,7 +20,7 @@
- +
diff --git a/_assets/src/components/prompts/Info.vue b/_assets/src/components/prompts/Info.vue index 3d54d797..df6e5300 100644 --- a/_assets/src/components/prompts/Info.vue +++ b/_assets/src/components/prompts/Info.vue @@ -21,7 +21,7 @@
- +
diff --git a/_assets/src/components/prompts/Move.vue b/_assets/src/components/prompts/Move.vue index eb2cff33..d3916c10 100644 --- a/_assets/src/components/prompts/Move.vue +++ b/_assets/src/components/prompts/Move.vue @@ -11,7 +11,7 @@
- +
diff --git a/_assets/src/components/prompts/NewDir.vue b/_assets/src/components/prompts/NewDir.vue index ce841967..600a85c0 100644 --- a/_assets/src/components/prompts/NewDir.vue +++ b/_assets/src/components/prompts/NewDir.vue @@ -5,7 +5,7 @@
- +
@@ -45,7 +45,7 @@ export default { console.log(error) }) - this.$store.commit('closePrompts') + this.$store.commit('closeHovers') } } } diff --git a/_assets/src/components/prompts/NewFile.vue b/_assets/src/components/prompts/NewFile.vue index ada54f30..dbbd5fa2 100644 --- a/_assets/src/components/prompts/NewFile.vue +++ b/_assets/src/components/prompts/NewFile.vue @@ -5,7 +5,7 @@
- +
@@ -45,7 +45,7 @@ export default { console.log(error) }) - this.$store.commit('closePrompts') + this.$store.commit('closeHovers') } } } diff --git a/_assets/src/components/prompts/Prompts.vue b/_assets/src/components/prompts/Prompts.vue index 3d1e8c65..f3de27a7 100644 --- a/_assets/src/components/prompts/Prompts.vue +++ b/_assets/src/components/prompts/Prompts.vue @@ -22,7 +22,7 @@ import Download from './Download' import Move from './Move' import NewFile from './NewFile' import NewDir from './NewDir' -import {mapState} from 'vuex' +import { mapState } from 'vuex' export default { name: 'prompts', @@ -37,20 +37,22 @@ export default { Help }, computed: { - ...mapState(['prompt']), - showInfo: function () { return this.prompt === 'info' }, - showHelp: function () { return this.prompt === 'help' }, - showDelete: function () { return this.prompt === 'delete' }, - showRename: function () { return this.prompt === 'rename' }, - showMove: function () { return this.prompt === 'move' }, - showNewFile: function () { return this.prompt === 'newFile' }, - showNewDir: function () { return this.prompt === 'newDir' }, - showDownload: function () { return this.prompt === 'download' }, - showOverlay: function () { return this.prompt !== null } + ...mapState(['show']), + showInfo: function () { return this.show === 'info' }, + showHelp: function () { return this.show === 'help' }, + showDelete: function () { return this.show === 'delete' }, + showRename: function () { return this.show === 'rename' }, + showMove: function () { return this.show === 'move' }, + showNewFile: function () { return this.show === 'newFile' }, + showNewDir: function () { return this.show === 'newDir' }, + showDownload: function () { return this.show === 'download' }, + showOverlay: function () { + return (this.show !== null && this.show !== 'search') + } }, methods: { resetPrompts () { - this.$store.commit('closePrompts') + this.$store.commit('closeHovers') } } } diff --git a/_assets/src/components/prompts/Rename.vue b/_assets/src/components/prompts/Rename.vue index 39caabd8..d10427f4 100644 --- a/_assets/src/components/prompts/Rename.vue +++ b/_assets/src/components/prompts/Rename.vue @@ -25,7 +25,7 @@ export default { computed: mapState(['req', 'selected', 'selectedCount']), methods: { cancel: function (event) { - this.$store.commit('closePrompts') + this.$store.commit('closeHovers') }, oldName: function () { if (this.req.kind !== 'listing') { @@ -68,7 +68,7 @@ export default { console.log(error) }) - this.$store.commit('closePrompts') + this.$store.commit('closeHovers') return } } diff --git a/_assets/src/css/header.css b/_assets/src/css/header.css index 7c4d2ce8..91ab2270 100644 --- a/_assets/src/css/header.css +++ b/_assets/src/css/header.css @@ -53,6 +53,10 @@ header>div:last-child { justify-content: flex-end; } +header .search-button { + display: none; +} + /* * * * * * * * * * * * * * * * * MORE?? * diff --git a/_assets/src/css/mobile.css b/_assets/src/css/mobile.css index 35afb9f1..f785e427 100644 --- a/_assets/src/css/mobile.css +++ b/_assets/src/css/mobile.css @@ -22,6 +22,7 @@ transition: .2s ease-in-out left; left: -14em; } + header .search-button, header>div:first-child>.action { display: inherit; } @@ -36,4 +37,10 @@ margin: 0 1em; width: calc(100% - 2em); } + #search { + display: none; + } + #search.active { + display: block; + } } diff --git a/_assets/src/store/mutations.js b/_assets/src/store/mutations.js index 075c8fd8..3adadd0e 100644 --- a/_assets/src/store/mutations.js +++ b/_assets/src/store/mutations.js @@ -1,6 +1,6 @@ const mutations = { - closePrompts: (state) => { state.prompt = null }, - showPrompt: (state, value) => { state.prompt = value }, + closeHovers: state => { state.show = null }, + showHover: (state, value) => { state.show = value }, setReload: (state, value) => { state.reload = value }, setUser: (state, value) => (state.user = value), setJWT: (state, value) => (state.jwt = value), diff --git a/_assets/src/store/store.js b/_assets/src/store/store.js index f42e254c..c1d5ad76 100644 --- a/_assets/src/store/store.js +++ b/_assets/src/store/store.js @@ -13,7 +13,7 @@ const state = { reload: false, selected: [], multiple: false, - prompt: null + show: null } export default new Vuex.Store({