Added "current time" share buttons.

This commit is contained in:
Violet Rose 2020-09-10 20:48:06 -07:00
parent ae18130648
commit 5725c18e2c
7 changed files with 83 additions and 1 deletions

View File

@ -14,6 +14,10 @@ export default Vue.extend({
id: { id: {
type: String, type: String,
required: true required: true
},
timestamp: {
default: 0,
type: Number
} }
}, },
computed: { computed: {
@ -29,6 +33,10 @@ export default Vue.extend({
return `${this.invidiousInstance}/watch?v=${this.id}` return `${this.invidiousInstance}/watch?v=${this.id}`
}, },
invidiousURLWithTime() {
return `${this.invidiousInstance}/watch?v=${this.id}&t=${this.timestamp}`
},
invidiousEmbedURL() { invidiousEmbedURL() {
return `${this.invidiousInstance}/embed/${this.id}` return `${this.invidiousInstance}/embed/${this.id}`
}, },
@ -37,6 +45,10 @@ export default Vue.extend({
return `https://www.youtube.com/watch?v=${this.id}` return `https://www.youtube.com/watch?v=${this.id}`
}, },
youtubeURLWithTime() {
return `https://www.youtube.com/watch?v=${this.id}&t=${this.timestamp}`
},
youtubeEmbedURL() { youtubeEmbedURL() {
return `https://www.youtube-nocookie.com/embed/${this.id}` return `https://www.youtube-nocookie.com/embed/${this.id}`
} }
@ -59,6 +71,11 @@ export default Vue.extend({
this.$refs.iconButton.toggleDropdown() this.$refs.iconButton.toggleDropdown()
}, },
openInvidiousAtTime() {
this.open(this.invidiousURLWithTime)
this.$refs.iconButton.toggleDropdown()
},
copyInvidious() { copyInvidious() {
this.showToast({ this.showToast({
message: this.$t('Share.Invidious URL copied to clipboard') message: this.$t('Share.Invidious URL copied to clipboard')
@ -67,11 +84,24 @@ export default Vue.extend({
this.$refs.iconButton.toggleDropdown() this.$refs.iconButton.toggleDropdown()
}, },
copyInvidiousAtTime() {
this.showToast({
message: this.$t('Share.Invidious URL copied to clipboard')
})
this.copy(this.invidiousURLWithTime)
this.$refs.iconButton.toggleDropdown()
},
openYoutube() { openYoutube() {
this.open(this.youtubeURL) this.open(this.youtubeURL)
this.$refs.iconButton.toggleDropdown() this.$refs.iconButton.toggleDropdown()
}, },
openYoutubeAtTime() {
this.open(this.youtubeURLWithTime)
this.$refs.iconButton.toggleDropdown()
},
copyYoutube() { copyYoutube() {
this.showToast({ this.showToast({
message: this.$t('Share.YouTube URL copied to clipboard') message: this.$t('Share.YouTube URL copied to clipboard')
@ -80,6 +110,14 @@ export default Vue.extend({
this.$refs.iconButton.toggleDropdown() this.$refs.iconButton.toggleDropdown()
}, },
copyYoutubeAtTime() {
this.showToast({
message: this.$t('Share.YouTube URL copied to clipboard')
})
this.copy(this.youtubeURLWithTime)
this.$refs.iconButton.toggleDropdown()
},
openYoutubeEmbed() { openYoutubeEmbed() {
this.open(this.youtubeEmbedURL) this.open(this.youtubeEmbedURL)
this.$refs.iconButton.toggleDropdown() this.$refs.iconButton.toggleDropdown()

View File

@ -26,6 +26,13 @@
<font-awesome-icon icon="copy" /> <font-awesome-icon icon="copy" />
{{ $t("Share.Copy Link") }} {{ $t("Share.Copy Link") }}
</ft-button> </ft-button>
<ft-button
class="action"
@click="copyYoutubeAtTime()"
>
<font-awesome-icon icon="copy" />
{{ $t("Share.Copy Link At Current Time") }}
</ft-button>
<ft-button <ft-button
class="action" class="action"
@click="openYoutube()" @click="openYoutube()"
@ -33,6 +40,13 @@
<font-awesome-icon icon="globe" /> <font-awesome-icon icon="globe" />
{{ $t("Share.Open Link") }} {{ $t("Share.Open Link") }}
</ft-button> </ft-button>
<ft-button
class="action"
@click="openYoutubeAtTime()"
>
<font-awesome-icon icon="globe" />
{{ $t("Share.Open Link At Current Time") }}
</ft-button>
<ft-button <ft-button
class="action" class="action"
background-color="var(--accent-color-active)" background-color="var(--accent-color-active)"
@ -65,6 +79,13 @@
<font-awesome-icon icon="copy" /> <font-awesome-icon icon="copy" />
{{ $t("Share.Copy Link") }} {{ $t("Share.Copy Link") }}
</ft-button> </ft-button>
<ft-button
class="action"
@click="copyInvidiousAtTime()"
>
<font-awesome-icon icon="copy" />
{{ $t("Share.Copy Link At Current Time") }}
</ft-button>
<ft-button <ft-button
class="action" class="action"
@click="openInvidious()" @click="openInvidious()"
@ -72,6 +93,13 @@
<font-awesome-icon icon="globe" /> <font-awesome-icon icon="globe" />
{{ $t("Share.Open Link") }} {{ $t("Share.Open Link") }}
</ft-button> </ft-button>
<ft-button
class="action"
@click="openInvidiousAtTime()"
>
<font-awesome-icon icon="globe" />
{{ $t("Share.Open Link At Current Time") }}
</ft-button>
<ft-button <ft-button
class="action" class="action"
background-color="var(--accent-color-active)" background-color="var(--accent-color-active)"

View File

@ -58,6 +58,10 @@ export default Vue.extend({
dislikeCount: { dislikeCount: {
type: Number, type: Number,
default: 0 default: 0
},
timestamp: {
default: 0,
type: Number
} }
}, },
data: function () { data: function () {

View File

@ -77,6 +77,7 @@
/> />
<ft-share-button <ft-share-button
:id="id" :id="id"
:timestamp="timestamp"
class="option" class="option"
/> />
</div> </div>

View File

@ -611,7 +611,7 @@ export default Vue.extend({
const player = this.$refs.videoPlayer.player const player = this.$refs.videoPlayer.player
if (player !== null && this.saveWatchedProgress) { if (player !== null && this.saveWatchedProgress) {
const currentTime = this.$refs.videoPlayer.player.currentTime() const currentTime = this.getWatchedProgress()
const payload = { const payload = {
videoId: this.videoId, videoId: this.videoId,
watchProgress: currentTime watchProgress: currentTime
@ -765,6 +765,14 @@ export default Vue.extend({
}) })
}, },
getWatchedProgress: function () {
return this.$refs.videoPlayer && this.$refs.videoPlayer.player ? this.$refs.videoPlayer.player.currentTime() : 0
},
getTimestamp: function () {
return Math.floor(this.getWatchedProgress())
},
...mapActions([ ...mapActions([
'showToast', 'showToast',
'buildVTTFileLocally', 'buildVTTFileLocally',

View File

@ -42,6 +42,7 @@
:like-count="videoLikeCount" :like-count="videoLikeCount"
:dislike-count="videoDislikeCount" :dislike-count="videoDislikeCount"
:view-count="videoViewCount" :view-count="videoViewCount"
:timestamp="getTimestamp()"
class="watchVideo" class="watchVideo"
:class="{ theatreWatchVideo: useTheatreMode }" :class="{ theatreWatchVideo: useTheatreMode }"
@theatreMode="toggleTheatreMode" @theatreMode="toggleTheatreMode"

View File

@ -425,7 +425,9 @@ Change Format:
Share: Share:
Share Video: Share Video Share Video: Share Video
Copy Link: Copy Link Copy Link: Copy Link
Copy Link At Current Time: Copy Link At Current Time
Open Link: Open Link Open Link: Open Link
Open Link At Current Time: Open Link At Current Time
Copy Embed: Copy Embed Copy Embed: Copy Embed
Open Embed: Open Embed Open Embed: Open Embed
# On Click # On Click