FreeTube/src/templates/playlistView.html

81 lines
4.4 KiB
HTML

<!--
This file is part of FreeTube.
FreeTube is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
FreeTube is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
You should have received a copy of the GNU General Public License
along with FreeTube. If not, see <http://www.gnu.org/licenses/>.
-->
<div>
<div v-if='seen'>
<div class='playlistSideView'>
<div class='playlistThumbnail'>
<img :src='thumbnail' />
</div>
<h2>{{title}}</h2>
<hr />
<div v-on:click='channel(channelId)' class='playlistChannel'>
<img :src='channelThumbnail' />
<h3>{{channelName}}</h3>
</div>
<p>{{videoCount}} videos - {{viewCount}} views - Last updated on {{lastUpdated}}</p>
<hr />
<div class='playlistShare'>
<div class='playlistShareButton smallButton'>Share Playlist <i class='fas fa-angle-down'></i></div>
<ul>
<li class='smallButton'><a v-on:click='copyYouTubePlaylist(playlistId)'>Copy YouTube Link</a></li>
<li class='smallButton'><a v-on:click='openYouTubePlaylist(playlistId)'>Open in YouTube</a></li>
<li class='smallButton'><a v-on:click='copyInvidiousPlaylist(playlistId)'>Copy Invidious Link</a></li>
<li class='smallButton'><a v-on:click='openInvidiousPlaylist(playlistId)'>Open in Invidious</a></li>
</ul>
</div>
<hr />
<p v-html='description'></p>
</div>
<div class='playlistVideoView'>
<div v-for="video in videoList">
<div class='playlistVideoOptions'>
<i class="fas fa-ellipsis-v" onclick='showVideoOptions(this)'></i>
<ul>
<a v-on:click='openYouTube(video.id)' onclick='showVideoOptions(this.parentNode.previousSibling);'>
<li>Open in YouTube</li>
</a>
<li v-on:click='copyYouTube(video.id)' onclick='showVideoOptions(this.parentNode.previousSibling);'>Copy YouTube Link</li>
<a v-on:click='openYouTubeNoCookie(video.id)' onclick='showVideoOptions(this.parentNode.previousSibling);'>
<li>Open in YouTube-NoCookie</li>
</a>
<li v-on:click='copyYouTubeNoCookie(video.id)' onclick='showVideoOptions(this.parentNode.previousSibling);'>Copy YouTube-NoCookie Link</li>
<a v-on:click='openInvidious(video.id)' onclick='showVideoOptions(this.parentNode.previousSibling);'>
<li>Open in Invidious</li>
</a>
<li v-on:click='copyInvidious(video.id)' onclick='showVideoOptions(this.parentNode.previousSibling);'>Copy Invidious Link</li>
</ul>
</div>
<div class='playlistVideo'>
<div class='playlistVideoThumbnail'>
<img v-on:click='play(video.id)' :src='video.thumbnail' />
<p v-on:click='play(video.id)' class='videoDuration'>{{video.duration}}</p>
<i class="fas fa-history playlistVideoSave" v-on:click='toggleSave(video.id)'></i>
<div v-if='video.watched' class='videoWatched'>
WATCHED
</div>
</div>
<p v-on:click='play(video.id)' class='playlistVideoTitle'>{{video.title}}</p>
<p v-on:click='channel(video.channelId)' class='playlistChannelName'>{{video.channelName}}</p>
<p v-on:click='play(video.id)' class='live'>{{video.liveText}}</p>
</div>
<hr />
</div>
</div>
</div>
</div>