2020-06-17 12:15:36 +00:00
|
|
|
import Vue from 'vue'
|
|
|
|
|
|
|
|
import FtIconButton from '../ft-icon-button/ft-icon-button.vue'
|
|
|
|
import FtButton from '../ft-button/ft-button.vue'
|
2020-07-04 15:44:35 +00:00
|
|
|
import { mapActions } from 'vuex'
|
2020-06-17 12:15:36 +00:00
|
|
|
|
|
|
|
export default Vue.extend({
|
|
|
|
name: 'FtShareButton',
|
|
|
|
components: {
|
|
|
|
'ft-icon-button': FtIconButton,
|
|
|
|
'ft-button': FtButton
|
2020-06-17 13:36:44 +00:00
|
|
|
},
|
|
|
|
props: {
|
|
|
|
id: {
|
|
|
|
type: String,
|
|
|
|
required: true
|
|
|
|
}
|
|
|
|
},
|
|
|
|
computed: {
|
|
|
|
invidiousInstance: function () {
|
|
|
|
return this.$store.getters.getInvidiousInstance
|
|
|
|
},
|
|
|
|
|
|
|
|
usingElectron: function () {
|
|
|
|
return this.$store.getters.getUsingElectron
|
|
|
|
},
|
|
|
|
|
2020-06-18 14:53:54 +00:00
|
|
|
invidiousURL() {
|
2020-06-17 13:36:44 +00:00
|
|
|
return `${this.invidiousInstance}/watch?v=${this.id}`
|
|
|
|
},
|
|
|
|
|
2020-06-18 14:53:54 +00:00
|
|
|
invidiousEmbedURL() {
|
2020-06-17 13:58:06 +00:00
|
|
|
return `${this.invidiousInstance}/embed/${this.id}`
|
|
|
|
},
|
|
|
|
|
2020-06-18 14:53:54 +00:00
|
|
|
youtubeURL() {
|
2020-06-17 13:36:44 +00:00
|
|
|
return `https://www.youtube.com/watch?v=${this.id}`
|
|
|
|
},
|
|
|
|
|
2020-06-18 14:53:54 +00:00
|
|
|
youtubeEmbedURL() {
|
2020-06-17 13:36:44 +00:00
|
|
|
return `https://www.youtube-nocookie.com/embed/${this.id}`
|
|
|
|
},
|
|
|
|
|
2020-06-18 14:53:54 +00:00
|
|
|
},
|
|
|
|
methods: {
|
|
|
|
copy(text) {
|
|
|
|
navigator.clipboard.writeText(text)
|
|
|
|
},
|
|
|
|
|
|
|
|
open(url) {
|
|
|
|
if (this.usingElectron) {
|
|
|
|
const shell = require('electron').shell
|
|
|
|
shell.openExternal(url)
|
|
|
|
}
|
|
|
|
},
|
|
|
|
|
2020-06-17 13:36:44 +00:00
|
|
|
openInvidious() {
|
2020-06-18 14:53:54 +00:00
|
|
|
this.open(this.invidiousURL)
|
2020-06-18 16:03:20 +00:00
|
|
|
this.$refs.iconButton.toggleDropdown()
|
2020-06-17 13:36:44 +00:00
|
|
|
},
|
|
|
|
|
|
|
|
copyInvidious() {
|
2020-07-04 15:44:35 +00:00
|
|
|
this.showToast('Invidious URL copied to clipboard')
|
2020-06-18 14:53:54 +00:00
|
|
|
this.copy(this.invidiousURL)
|
2020-06-18 16:03:20 +00:00
|
|
|
this.$refs.iconButton.toggleDropdown()
|
2020-06-17 13:36:44 +00:00
|
|
|
},
|
|
|
|
|
|
|
|
openYoutube() {
|
2020-06-18 14:53:54 +00:00
|
|
|
this.open(this.youtubeURL)
|
2020-06-18 16:03:20 +00:00
|
|
|
this.$refs.iconButton.toggleDropdown()
|
2020-06-17 13:36:44 +00:00
|
|
|
},
|
|
|
|
|
|
|
|
copyYoutube() {
|
2020-07-04 15:44:35 +00:00
|
|
|
this.showToast('YouTube URL copied to clipboard')
|
2020-06-18 14:53:54 +00:00
|
|
|
this.copy(this.youtubeURL)
|
2020-06-18 16:03:20 +00:00
|
|
|
this.$refs.iconButton.toggleDropdown()
|
2020-06-17 13:36:44 +00:00
|
|
|
},
|
|
|
|
|
|
|
|
openYoutubeEmbed() {
|
2020-06-18 14:53:54 +00:00
|
|
|
this.open(this.youtubeEmbedURL)
|
2020-06-18 16:03:20 +00:00
|
|
|
this.$refs.iconButton.toggleDropdown()
|
2020-06-17 13:36:44 +00:00
|
|
|
},
|
|
|
|
|
|
|
|
copyYoutubeEmbed() {
|
2020-07-04 15:44:35 +00:00
|
|
|
this.showToast('YouTube Embed URL copied to clipboard')
|
2020-06-18 14:53:54 +00:00
|
|
|
this.copy(this.youtubeEmbedURL)
|
2020-06-18 16:03:20 +00:00
|
|
|
this.$refs.iconButton.toggleDropdown()
|
2020-06-17 13:58:06 +00:00
|
|
|
},
|
|
|
|
|
|
|
|
openInvidiousEmbed() {
|
2020-06-18 14:53:54 +00:00
|
|
|
this.open(this.invidiousEmbedURL)
|
2020-06-18 16:03:20 +00:00
|
|
|
this.$refs.iconButton.toggleDropdown()
|
2020-06-17 13:58:06 +00:00
|
|
|
},
|
|
|
|
|
|
|
|
copyInvidiousEmbed() {
|
2020-07-04 15:44:35 +00:00
|
|
|
this.showToast('Invidious Embed URL copied to clipboard')
|
2020-06-18 14:53:54 +00:00
|
|
|
this.copy(this.invidiousEmbedURL)
|
2020-06-18 16:03:20 +00:00
|
|
|
this.$refs.iconButton.toggleDropdown()
|
2020-06-17 13:58:06 +00:00
|
|
|
},
|
2020-07-04 15:44:35 +00:00
|
|
|
|
|
|
|
...mapActions([
|
|
|
|
'showToast'
|
|
|
|
])
|
2020-06-17 12:15:36 +00:00
|
|
|
}
|
|
|
|
})
|