diff --git a/src/renderer/App.vue b/src/renderer/App.vue index 2393a4c2..2bb16c04 100644 --- a/src/renderer/App.vue +++ b/src/renderer/App.vue @@ -14,7 +14,7 @@ /> - + diff --git a/src/renderer/components/ft-toast/ft-toast-events.js b/src/renderer/components/ft-toast/ft-toast-events.js new file mode 100644 index 00000000..657c8034 --- /dev/null +++ b/src/renderer/components/ft-toast/ft-toast-events.js @@ -0,0 +1,4 @@ +import Vue from 'vue'; + +const events = new Vue(); +export default events; \ No newline at end of file diff --git a/src/renderer/components/ft-toast/ft-toast.js b/src/renderer/components/ft-toast/ft-toast.js index b835370a..27c87c36 100644 --- a/src/renderer/components/ft-toast/ft-toast.js +++ b/src/renderer/components/ft-toast/ft-toast.js @@ -1,22 +1,19 @@ import Vue from 'vue' +import FtToastEvents from './ft-toast-events.js' export default Vue.extend({ name: 'FtToast', - props: { - message: { - type: String, - required: true, - }, - action: { - type: Function, - default: function () {}, - }, - }, data: function () { return { isOpen: false, + message: '', + action: () => {}, + queue: [], } }, + mounted: function () { + FtToastEvents.$on('toast.open', this.open) + }, methods: { performAction: function () { this.action() @@ -24,10 +21,23 @@ export default Vue.extend({ }, close: function () { this.isOpen = false + if(this.queue.length !== 0) { + const toast = this.queue.shift() + this.open(toast.message, toast.action) + } }, - open: function () { + open: function (message, action) { + if (this.isOpen) { + this.queue.push({ message: message, action: action }) + return + } + this.message = message + this.action = action || (() => {}); this.isOpen = true setTimeout(this.close, 2000) }, }, + beforeDestroy: function () { + FtToastEvents.$off('toast.open', this.open) + }, }) diff --git a/src/renderer/components/watch-video-info/watch-video-info.js b/src/renderer/components/watch-video-info/watch-video-info.js index 550b0067..e72fba59 100644 --- a/src/renderer/components/watch-video-info/watch-video-info.js +++ b/src/renderer/components/watch-video-info/watch-video-info.js @@ -4,6 +4,7 @@ import FtButton from '../ft-button/ft-button.vue' import FtListDropdown from '../ft-list-dropdown/ft-list-dropdown.vue' import FtFlexBox from '../ft-flex-box/ft-flex-box.vue' import FtIconButton from '../ft-icon-button/ft-icon-button.vue' +import FtToastEvents from '../ft-toast/ft-toast-events' // import { shell } from 'electron' export default Vue.extend({ @@ -146,6 +147,7 @@ export default Vue.extend({ switch (method) { case 'copyYoutube': + FtToastEvents.$emit('toast.open', "YouTube URL copied to clipboard") navigator.clipboard.writeText(this.youtubeUrl) break case 'openYoutube': @@ -155,6 +157,7 @@ export default Vue.extend({ } break case 'copyYoutubeEmbed': + FtToastEvents.$emit('toast.open', "YouTube Embed URL copied to clipboard") navigator.clipboard.writeText(this.youtubeEmbedUrl) break case 'openYoutubeEmbed': @@ -164,6 +167,7 @@ export default Vue.extend({ } break case 'copyInvidious': + FtToastEvents.$emit('toast.open', "Invidious URL copied to clipboard") navigator.clipboard.writeText(this.invidiousUrl) break case 'openInvidious':