mirror of
				https://github.com/TeamPiped/Piped.git
				synced 2024-08-14 23:57:27 +00:00 
			
		
		
		
	Merge pull request #3314 from Bnyro/share-video-item
feat: add share button to video items and improve share dialog ui
This commit is contained in:
		
						commit
						c8e05c2954
					
				
					 2 changed files with 19 additions and 6 deletions
				
			
		| 
						 | 
				
			
			@ -1,10 +1,11 @@
 | 
			
		|||
<template>
 | 
			
		||||
    <ModalComponent>
 | 
			
		||||
        <h2 v-t="'actions.share'" />
 | 
			
		||||
        <h2 v-t="'actions.share'" class="mb-5" />
 | 
			
		||||
        <div class="flex justify-between">
 | 
			
		||||
            <label v-t="'actions.piped_link'" />
 | 
			
		||||
            <input v-model="pipedLink" type="checkbox" @change="onChange" />
 | 
			
		||||
        </div>
 | 
			
		||||
        <hr />
 | 
			
		||||
        <div v-if="hasPlaylist" class="flex justify-between">
 | 
			
		||||
            <label v-t="'actions.with_playlist'" />
 | 
			
		||||
            <input v-model="withPlaylist" type="checkbox" @change="onChange" />
 | 
			
		||||
| 
						 | 
				
			
			@ -17,6 +18,7 @@
 | 
			
		|||
            <label v-t="'actions.time_code'" />
 | 
			
		||||
            <input v-model="timeStamp" class="input w-12" type="text" @change="onChange" />
 | 
			
		||||
        </div>
 | 
			
		||||
        <hr />
 | 
			
		||||
        <a :href="generatedLink" target="_blank">
 | 
			
		||||
            <h3 class="mt-4" v-text="generatedLink" />
 | 
			
		||||
        </a>
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -107,9 +107,12 @@
 | 
			
		|||
                >
 | 
			
		||||
                    <font-awesome-icon icon="headphones" />
 | 
			
		||||
                </router-link>
 | 
			
		||||
                <button :title="$t('actions.add_to_playlist')" @click="showModal = !showModal">
 | 
			
		||||
                <button :title="$t('actions.add_to_playlist')" @click="showPlaylistModal = !showPlaylistModal">
 | 
			
		||||
                    <font-awesome-icon icon="circle-plus" />
 | 
			
		||||
                </button>
 | 
			
		||||
                <button :title="$t('actions.share')" @click="showShareModal = !showShareModal">
 | 
			
		||||
                    <font-awesome-icon icon="share" />
 | 
			
		||||
                </button>
 | 
			
		||||
                <button
 | 
			
		||||
                    v-if="admin"
 | 
			
		||||
                    ref="removeButton"
 | 
			
		||||
| 
						 | 
				
			
			@ -125,10 +128,16 @@
 | 
			
		|||
                    @confirm="removeVideo(item.url.substr(-11))"
 | 
			
		||||
                />
 | 
			
		||||
                <PlaylistAddModal
 | 
			
		||||
                    v-if="showModal"
 | 
			
		||||
                    v-if="showPlaylistModal"
 | 
			
		||||
                    :video-id="item.url.substr(-11)"
 | 
			
		||||
                    :video-info="item"
 | 
			
		||||
                    @close="showModal = !showModal"
 | 
			
		||||
                    @close="showPlaylistModal = false"
 | 
			
		||||
                />
 | 
			
		||||
                <ShareModal
 | 
			
		||||
                    v-if="showShareModal"
 | 
			
		||||
                    :video-id="item.url.substr(-11)"
 | 
			
		||||
                    :current-time="0"
 | 
			
		||||
                    @close="showShareModal = false"
 | 
			
		||||
                />
 | 
			
		||||
            </div>
 | 
			
		||||
        </div>
 | 
			
		||||
| 
						 | 
				
			
			@ -137,10 +146,11 @@
 | 
			
		|||
 | 
			
		||||
<script>
 | 
			
		||||
import PlaylistAddModal from "./PlaylistAddModal.vue";
 | 
			
		||||
import ShareModal from "./ShareModal.vue";
 | 
			
		||||
import ConfirmModal from "./ConfirmModal.vue";
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
    components: { PlaylistAddModal, ConfirmModal },
 | 
			
		||||
    components: { PlaylistAddModal, ConfirmModal, ShareModal },
 | 
			
		||||
    props: {
 | 
			
		||||
        item: {
 | 
			
		||||
            type: Object,
 | 
			
		||||
| 
						 | 
				
			
			@ -162,7 +172,8 @@ export default {
 | 
			
		|||
    emits: ["remove"],
 | 
			
		||||
    data() {
 | 
			
		||||
        return {
 | 
			
		||||
            showModal: false,
 | 
			
		||||
            showPlaylistModal: false,
 | 
			
		||||
            showShareModal: false,
 | 
			
		||||
            showVideo: true,
 | 
			
		||||
            showConfirmRemove: false,
 | 
			
		||||
        };
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue