Added "current time" share buttons.
This commit is contained in:
parent
ae18130648
commit
5725c18e2c
|
@ -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()
|
||||||
|
|
|
@ -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)"
|
||||||
|
|
|
@ -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 () {
|
||||||
|
|
|
@ -77,6 +77,7 @@
|
||||||
/>
|
/>
|
||||||
<ft-share-button
|
<ft-share-button
|
||||||
:id="id"
|
:id="id"
|
||||||
|
:timestamp="timestamp"
|
||||||
class="option"
|
class="option"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -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',
|
||||||
|
|
|
@ -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"
|
||||||
|
|
|
@ -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
|
||||||
|
|
Loading…
Reference in New Issue