diff --git a/assets/src/components/files/Editor.vue b/assets/src/components/files/Editor.vue index 49207996..f0367f3a 100644 --- a/assets/src/components/files/Editor.vue +++ b/assets/src/components/files/Editor.vue @@ -134,7 +134,7 @@ export default { }) .catch(error => { buttons.done(button) - this.$store.commit('showError', error) + this.$showError(error) this.$store.commit('setSchedule', '') }) } diff --git a/assets/src/components/files/Listing.vue b/assets/src/components/files/Listing.vue index b1c07ac3..2b8eb7f0 100644 --- a/assets/src/components/files/Listing.vue +++ b/assets/src/components/files/Listing.vue @@ -210,17 +210,13 @@ export default { if (this.$store.state.clipboard.key === 'x') { api.move(items).then(() => { this.$store.commit('setReload', true) - }).catch(error => { - this.$store.commit('showError', error) - }) + }).catch(this.$showError) return } api.copy(items).then(() => { this.$store.commit('setReload', true) - }).catch(error => { - this.$store.commit('showError', error) - }) + }).catch(this.$showError) }, resizeEvent () { // Update the columns size based on the window width. @@ -348,7 +344,7 @@ export default { }) .catch(error => { finish() - this.$store.commit('showError', error) + this.$showError(error) }) return false diff --git a/assets/src/components/files/ListingItem.vue b/assets/src/components/files/ListingItem.vue index c92c91d1..8b8a6496 100644 --- a/assets/src/components/files/ListingItem.vue +++ b/assets/src/components/files/ListingItem.vue @@ -109,9 +109,7 @@ export default { .then(() => { this.$store.commit('setReload', true) }) - .catch(error => { - this.$store.commit('showError', error) - }) + .catch(this.$showError) }, click: function (event) { if (this.selectedCount !== 0) event.preventDefault() diff --git a/assets/src/components/prompts/Copy.vue b/assets/src/components/prompts/Copy.vue index 972782cc..3900577c 100644 --- a/assets/src/components/prompts/Copy.vue +++ b/assets/src/components/prompts/Copy.vue @@ -56,7 +56,7 @@ export default { }) .catch(error => { buttons.done('copy') - this.$store.commit('showError', error) + this.$showError(error) }) } } diff --git a/assets/src/components/prompts/Delete.vue b/assets/src/components/prompts/Delete.vue index ae0399b5..44a71c88 100644 --- a/assets/src/components/prompts/Delete.vue +++ b/assets/src/components/prompts/Delete.vue @@ -43,7 +43,7 @@ export default { }) .catch(error => { buttons.done('delete') - this.$store.commit('showError', error) + this.$showError(error) }) return @@ -70,7 +70,7 @@ export default { .catch(error => { buttons.done('delete') this.$store.commit('setReload', true) - this.$store.commit('showError', error) + this.$showError(error) }) } } diff --git a/assets/src/components/prompts/Error.vue b/assets/src/components/prompts/Error.vue deleted file mode 100644 index fd319762..00000000 --- a/assets/src/components/prompts/Error.vue +++ /dev/null @@ -1,31 +0,0 @@ - - - error_outline - {{ $t('prompts.error') }} - {{ $store.state.showMessage }} - - {{ $t('buttons.close') }} - {{ $t('buttons.reportIssue') }} - - - - - diff --git a/assets/src/components/prompts/FileList.vue b/assets/src/components/prompts/FileList.vue index 652dc742..15e9c538 100644 --- a/assets/src/components/prompts/FileList.vue +++ b/assets/src/components/prompts/FileList.vue @@ -53,7 +53,7 @@ export default { // so we fetch the data from the previous directory. api.fetch(url.removeLastDir(this.$route.path)) .then(this.fillOptions) - .catch(this.showError) + .catch(this.$showError) }, methods: { fillOptions (req) { @@ -96,7 +96,7 @@ export default { api.fetch(uri) .then(this.fillOptions) - .catch(this.showError) + .catch(this.$showError) }, touchstart (event) { let url = event.currentTarget.dataset.url diff --git a/assets/src/components/prompts/Info.vue b/assets/src/components/prompts/Info.vue index be7fdca2..ff3a7991 100644 --- a/assets/src/components/prompts/Info.vue +++ b/assets/src/components/prompts/Info.vue @@ -111,7 +111,7 @@ export default { api.checksum(link, hash) .then((hash) => { event.target.innerHTML = hash }) - .catch(error => { this.$store.commit('showError', error) }) + .catch(this.$showError) } } } diff --git a/assets/src/components/prompts/Move.vue b/assets/src/components/prompts/Move.vue index 7155d53f..7e7f41e3 100644 --- a/assets/src/components/prompts/Move.vue +++ b/assets/src/components/prompts/Move.vue @@ -56,7 +56,7 @@ export default { }) .catch(error => { buttons.done('move') - this.$store.commit('showError', error) + this.$showError(error) }) event.preventDefault() diff --git a/assets/src/components/prompts/NewArchetype.vue b/assets/src/components/prompts/NewArchetype.vue index 9228a7ee..0356bcc5 100644 --- a/assets/src/components/prompts/NewArchetype.vue +++ b/assets/src/components/prompts/NewArchetype.vue @@ -37,9 +37,7 @@ export default { .then((url) => { this.$router.push({ path: url }) }) - .catch(error => { - this.$store.commit('showError', error) - }) + .catch(this.$showError) }, new (url, type) { url = removePrefix(url) diff --git a/assets/src/components/prompts/NewDir.vue b/assets/src/components/prompts/NewDir.vue index 42559a0f..25137e6b 100644 --- a/assets/src/components/prompts/NewDir.vue +++ b/assets/src/components/prompts/NewDir.vue @@ -43,7 +43,7 @@ export default { api.post(uri) .then(() => { this.$router.push({ path: uri }) }) - .catch(error => { this.$store.commit('showError', error) }) + .catch(this.$showError) // Close the prompt this.$store.commit('closeHovers') diff --git a/assets/src/components/prompts/NewFile.vue b/assets/src/components/prompts/NewFile.vue index 94ea0c94..c43826c1 100644 --- a/assets/src/components/prompts/NewFile.vue +++ b/assets/src/components/prompts/NewFile.vue @@ -44,7 +44,7 @@ export default { // Create the new file. api.post(uri) .then(() => { this.$router.push({ path: uri }) }) - .catch(error => { this.$store.commit('showError', error) }) + .catch(this.$showError) // Close the prompt. this.$store.commit('closeHovers') diff --git a/assets/src/components/prompts/Prompts.vue b/assets/src/components/prompts/Prompts.vue index a840ae82..84bc4e12 100644 --- a/assets/src/components/prompts/Prompts.vue +++ b/assets/src/components/prompts/Prompts.vue @@ -9,8 +9,6 @@ - - @@ -27,8 +25,6 @@ import Rename from './Rename' import Download from './Download' import Move from './Move' import Copy from './Copy' -import Error from './Error' -import Success from './Success' import NewFile from './NewFile' import NewDir from './NewDir' import NewArchetype from './NewArchetype' @@ -47,9 +43,7 @@ export default { NewArchetype, Schedule, Rename, - Error, Download, - Success, Move, Copy, Share, @@ -70,8 +64,6 @@ export default { }, computed: { ...mapState(['show', 'plugins']), - showError: function () { return this.show === 'error' }, - showSuccess: function () { return this.show === 'success' }, showInfo: function () { return this.show === 'info' }, showHelp: function () { return this.show === 'help' }, showDelete: function () { return this.show === 'delete' }, diff --git a/assets/src/components/prompts/Rename.vue b/assets/src/components/prompts/Rename.vue index 434bf7cd..231c34bf 100644 --- a/assets/src/components/prompts/Rename.vue +++ b/assets/src/components/prompts/Rename.vue @@ -68,7 +68,7 @@ export default { } this.$store.commit('setReload', true) }).catch(error => { - this.$store.commit('showError', error) + this.$showError(error) }) this.$store.commit('closeHovers') diff --git a/assets/src/components/prompts/Share.vue b/assets/src/components/prompts/Share.vue index db2ec429..20dfbe7c 100644 --- a/assets/src/components/prompts/Share.vue +++ b/assets/src/components/prompts/Share.vue @@ -18,7 +18,7 @@ :aria-label="$t('buttons.delete')" :title="$t('buttons.delete')">delete - content_paste @@ -54,7 +54,7 @@ diff --git a/assets/src/css/base.css b/assets/src/css/base.css index f5582857..e6f4018a 100644 --- a/assets/src/css/base.css +++ b/assets/src/css/base.css @@ -2,7 +2,6 @@ body { font-family: 'Roboto', sans-serif; padding-top: 4em; background-color: #f8f8f8; - user-select: none; color: #212121; } diff --git a/assets/src/css/prompts.css b/assets/src/css/prompts.css index b1a7fbe6..e85d9e0f 100644 --- a/assets/src/css/prompts.css +++ b/assets/src/css/prompts.css @@ -206,3 +206,24 @@ margin-right: .5em; border: 1px solid #dadada; } + +.prompt#share .action.copy-clipboard::after { + content: 'Copied!'; + position: absolute; + left: -25%; + width: 150%; + font-size: .6em; + text-align: center; + background: #44a6f5; + color: #fff; + padding: .5em .2em; + border-radius: .4em; + top: -2em; + transition: .1s ease opacity; + opacity: 0; +} + +.prompt#share .action.copy-clipboard.active::after { + opacity: 1; +} + diff --git a/assets/src/css/styles.css b/assets/src/css/styles.css index f9c2f488..a90d60bd 100644 --- a/assets/src/css/styles.css +++ b/assets/src/css/styles.css @@ -1,4 +1,5 @@ @import "~normalize.css/normalize.css"; +@import "~noty/lib/noty.css"; @import "./fonts.css"; @import "./base.css"; @import "./header.css"; @@ -180,6 +181,17 @@ * PROMPT * * * * * * * * * * * * * * * * */ +.noty_buttons { + text-align: right; + padding: 0 10px 10px !important; +} + +.noty_buttons button { + background: rgba(0, 0, 0, 0.05); + border: 1px solid rgba(0,0,0,0.1); + box-shadow: 0 0 0 0; + font-size: 14px; +} /* * * * * * * * * * * * * * * * * FOOTER * diff --git a/assets/src/i18n/en.yaml b/assets/src/i18n/en.yaml index 1539d8d8..a52155ca 100644 --- a/assets/src/i18n/en.yaml +++ b/assets/src/i18n/en.yaml @@ -31,6 +31,8 @@ buttons: update: Update upload: Upload permalink: Get Permanent Link +success: + linkCopied: Link copied! errors: forbidden: You're not welcome here. internal: Something really went wrong. diff --git a/assets/src/i18n/pt.yaml b/assets/src/i18n/pt.yaml index e3d8b2ff..d7885916 100644 --- a/assets/src/i18n/pt.yaml +++ b/assets/src/i18n/pt.yaml @@ -31,6 +31,8 @@ buttons: update: Atualizar upload: Enviar permalink: Obter link permanente +success: + linkCopied: Link copiado! errors: forbidden: Tu não és bem-vindo aqui. internal: Algo correu bastante mal. diff --git a/assets/src/main.js b/assets/src/main.js index 33c69173..57e7b930 100644 --- a/assets/src/main.js +++ b/assets/src/main.js @@ -3,9 +3,47 @@ import App from './App' import store from './store' import router from './router' import i18n from './i18n' +import Noty from 'noty' Vue.config.productionTip = true +const notyDefault = { + type: 'info', + layout: 'bottomRight', + timeout: 1000, + progressBar: true +} + +Vue.prototype.$noty = function (opts) { + new Noty(Object.assign({}, notyDefault, opts)).show() +} + +Vue.prototype.$showSuccess = function (message) { + new Noty(Object.assign({}, notyDefault, { + text: message, + type: 'success' + })).show() +} + +Vue.prototype.$showError = function (error) { + // TODO: add btns: close and report issue + let n = new Noty(Object.assign({}, notyDefault, { + text: error, + type: 'error', + timeout: null, + buttons: [ + Noty.button(i18n.t('buttons.reportIssue'), 'cancel', function () { + window.open('https://github.com/hacdias/filemanager/issues/new') + }), + Noty.button(i18n.t('buttons.close'), '', function () { + n.close() + }) + ] + })) + + n.show() +} + /* eslint-disable no-new */ new Vue({ el: '#app', diff --git a/assets/src/views/GlobalSettings.vue b/assets/src/views/GlobalSettings.vue index 28c23829..75963c27 100644 --- a/assets/src/views/GlobalSettings.vue +++ b/assets/src/views/GlobalSettings.vue @@ -45,7 +45,7 @@
{{ $store.state.showMessage }}