mmjee/Piped-Material
1
0
Fork 0
mirror of https://github.com/mmjee/Piped-Material.git synced 2024-12-06 19:26:36 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

System sharing panel

Browse Source
This commit is contained in:
root
2023-04-11 02:10:05 +05:30
parent d719842269
commit fb6096045f
4 changed files with 51 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/Video/VideoSharingPanel.vue
+42 -4
View File
@@ -7,17 +7,27 @@
<v-col cols="4">
{{ $t('video_sharing_panel.via_pm')}}
</v-col>
<v-col cols="8">
<v-col :cols="columnsForTxt">
<v-text-field readonly dense :value="PMURL.withTimestamps" />
</v-col>
<v-col cols="2" v-if="isShareable" @click="systemShare(PMURL.withTimestamps)">
<v-btn icon class="ml-2 mb-2" :alt="$t('video_sharing_panel.share_system')" >
<v-icon>{{ mdiShareVariantOutline }}</v-icon>
</v-btn>
</v-col>
</v-row>
<v-row align="center" no-gutters>
<v-col cols="4">
{{ $t('video_sharing_panel.via_yt')}}
</v-col>
<v-col cols="8">
<v-col :cols="columnsForTxt">
<v-text-field readonly dense :value="youtubeURL.withTimestamps" />
</v-col>
<v-col cols="2" v-if="isShareable" @click="systemShare(youtubeURL.withTimestamps)">
<v-btn icon class="ml-2 mb-2" :alt="$t('video_sharing_panel.share_system')" >
<v-icon>{{ mdiShareVariantOutline }}</v-icon>
</v-btn>
</v-col>
</v-row>
<v-divider class="my-1" />
<p class="text-subtitle-1">{{ $t('video_sharing_panel.without_timestamps') }}</p>
@@ -25,27 +35,50 @@
<v-col cols="4">
{{ $t('video_sharing_panel.via_pm')}}
</v-col>
<v-col cols="8">
<v-col :cols="columnsForTxt">
<v-text-field readonly dense :value="PMURL.base" />
</v-col>
<v-col cols="2" v-if="isShareable" @click="systemShare(PMURL.base)">
<v-btn icon class="ml-2 mb-2" :alt="$t('video_sharing_panel.share_system')" >
<v-icon>{{ mdiShareVariantOutline }}</v-icon>
</v-btn>
</v-col>
</v-row>
<v-row align="center" no-gutters>
<v-col cols="4">
{{ $t('video_sharing_panel.via_yt')}}
</v-col>
<v-col cols="8">
<v-col :cols="columnsForTxt">
<v-text-field readonly dense :value="youtubeURL.base" />
</v-col>
<v-col cols="2" v-if="isShareable" @click="systemShare(youtubeURL.base)">
<v-btn icon class="ml-2 mb-2" :alt="$t('video_sharing_panel.share_system')" >
<v-icon>{{ mdiShareVariantOutline }}</v-icon>
</v-btn>
</v-col>
</v-row>
</v-card-text>
</v-card>
</template>
<script>
import { mdiShareVariantOutline } from '@mdi/js'
export default {
name: 'VideoSharingPanel',
props: ['currentTime', 'videoId'],
data: () => ({
mdiShareVariantOutline
}),
computed: {
isShareable () {
return navigator.canShare ? navigator.canShare({ url: this.youtubeURL }) : false
},
columnsForTxt () {
return this.isShareable ? 6 : 8
},
currentTimeR () {
return Math.round(this.currentTime)
},
@@ -73,6 +106,11 @@ export default {
withTimestamps: base.href
}
}
},
methods: {
systemShare (url) {
return navigator.share({ url })
}
}
}
</script>
src/routes/WatchVideo.vue
+1 -1
View File
@@ -13,7 +13,7 @@
@timeupdate="onTimeUpdate"
/>
<v-dialog max-width="720" v-model="sharingPanelOpen">
<v-dialog max-width="960" v-model="sharingPanelOpen">
<VideoSharingPanel @input="sharingPanelOpen = $event" :current-time="currentTime" :video-id="videoId" />
</v-dialog>
<VideoPlaylistOperationsA
src/translations/en.json
+2 -1
View File
@@ -63,7 +63,8 @@
"with_timestamps": "With Timestamps",
"without_timestamps": "Without Timestamps",
"via_pm": "Via Piped Material",
"via_yt": "Via YouTube"
"via_yt": "Via YouTube",
"share_system": "Share via system dialog"
},
"auth_dialog": {
"title": "Authentication",
vue.config.js
+6
View File
@@ -38,6 +38,12 @@ module.exports = {
]
}
},
devServer: {
allowedHosts: 'all',
client: {
webSocketURL: 'auto://0.0.0.0:0/ws'
}
},
productionSourceMap: false,
lintOnSave: false