You've already forked wp-fedistream
137 lines
8.3 KiB
PHP
137 lines
8.3 KiB
PHP
|
|
<?php
|
||
|
|
/**
|
||
|
|
* Single playlist template.
|
||
|
|
*
|
||
|
|
* @package WP_FediStream
|
||
|
|
*
|
||
|
|
* @var array $post Playlist data array.
|
||
|
|
*/
|
||
|
|
|
||
|
|
// Prevent direct file access.
|
||
|
|
if ( ! defined( 'ABSPATH' ) ) {
|
||
|
|
exit;
|
||
|
|
}
|
||
|
|
?>
|
||
|
|
<article class="fedistream-single fedistream-single--playlist">
|
||
|
|
<header class="fedistream-single__header fedistream-single__header--playlist">
|
||
|
|
<div class="fedistream-single__artwork">
|
||
|
|
<?php if ( ! empty( $post['thumbnail'] ) ) : ?>
|
||
|
|
<img src="<?php echo esc_url( $post['thumbnail'] ); ?>" alt="<?php echo esc_attr( $post['title'] ?? '' ); ?>" class="fedistream-single__image fedistream-single__image--playlist">
|
||
|
|
<?php else : ?>
|
||
|
|
<div class="fedistream-single__placeholder fedistream-single__placeholder--playlist">
|
||
|
|
<svg viewBox="0 0 24 24" fill="currentColor"><path d="M15 6H3v2h12V6zm0 4H3v2h12v-2zM3 16h8v-2H3v2zM17 6v8.18c-.31-.11-.65-.18-1-.18-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3V8h3V6h-5z"/></svg>
|
||
|
|
</div>
|
||
|
|
<?php endif; ?>
|
||
|
|
<?php if ( isset( $post['visibility'] ) && 'private' === $post['visibility'] ) : ?>
|
||
|
|
<span class="fedistream-single__badge fedistream-single__badge--private">
|
||
|
|
<svg viewBox="0 0 24 24" fill="currentColor" width="16" height="16"><path d="M18 8h-1V6c0-2.76-2.24-5-5-5S7 3.24 7 6v2H6c-1.1 0-2 .9-2 2v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V10c0-1.1-.9-2-2-2zM9 6c0-1.66 1.34-3 3-3s3 1.34 3 3v2H9V6zm9 14H6V10h12v10zm-6-3c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2z"/></svg>
|
||
|
|
<?php esc_html_e( 'Private', 'wp-fedistream' ); ?>
|
||
|
|
</span>
|
||
|
|
<?php endif; ?>
|
||
|
|
</div>
|
||
|
|
<div class="fedistream-single__info">
|
||
|
|
<span class="fedistream-single__type-badge"><?php esc_html_e( 'Playlist', 'wp-fedistream' ); ?></span>
|
||
|
|
<h1 class="fedistream-single__title"><?php echo esc_html( $post['title'] ?? '' ); ?></h1>
|
||
|
|
<?php if ( ! empty( $post['author'] ) ) : ?>
|
||
|
|
<p class="fedistream-single__author">
|
||
|
|
<?php esc_html_e( 'Created by', 'wp-fedistream' ); ?> <a href="<?php echo esc_url( $post['author_link'] ?? '#' ); ?>"><?php echo esc_html( $post['author'] ); ?></a>
|
||
|
|
</p>
|
||
|
|
<?php endif; ?>
|
||
|
|
<div class="fedistream-single__meta">
|
||
|
|
<?php if ( ! empty( $post['track_count'] ) ) : ?>
|
||
|
|
<span class="fedistream-single__tracks">
|
||
|
|
<?php
|
||
|
|
printf(
|
||
|
|
/* translators: %d: number of tracks */
|
||
|
|
esc_html( _n( '%d track', '%d tracks', $post['track_count'], 'wp-fedistream' ) ),
|
||
|
|
(int) $post['track_count']
|
||
|
|
);
|
||
|
|
?>
|
||
|
|
</span>
|
||
|
|
<?php endif; ?>
|
||
|
|
<?php if ( ! empty( $post['duration_formatted'] ) ) : ?>
|
||
|
|
<span class="fedistream-single__duration"><?php echo esc_html( $post['duration_formatted'] ); ?></span>
|
||
|
|
<?php endif; ?>
|
||
|
|
<?php if ( ! empty( $post['updated_date'] ) ) : ?>
|
||
|
|
<span class="fedistream-single__updated"><?php esc_html_e( 'Updated', 'wp-fedistream' ); ?> <?php echo esc_html( $post['updated_date'] ); ?></span>
|
||
|
|
<?php endif; ?>
|
||
|
|
</div>
|
||
|
|
<?php if ( ! empty( $post['moods'] ) && is_array( $post['moods'] ) ) : ?>
|
||
|
|
<div class="fedistream-single__moods">
|
||
|
|
<?php foreach ( $post['moods'] as $mood ) : ?>
|
||
|
|
<a href="<?php echo esc_url( $mood['url'] ?? '#' ); ?>" class="fedistream-tag fedistream-tag--mood"><?php echo esc_html( $mood['name'] ?? '' ); ?></a>
|
||
|
|
<?php endforeach; ?>
|
||
|
|
</div>
|
||
|
|
<?php endif; ?>
|
||
|
|
<div class="fedistream-single__actions">
|
||
|
|
<button type="button" class="fedistream-btn fedistream-btn--primary fedistream-btn--play-all" data-playlist-id="<?php echo esc_attr( $post['id'] ?? '' ); ?>">
|
||
|
|
<svg viewBox="0 0 24 24" fill="currentColor"><path d="M8 5v14l11-7z"/></svg>
|
||
|
|
<?php esc_html_e( 'Play All', 'wp-fedistream' ); ?>
|
||
|
|
</button>
|
||
|
|
<button type="button" class="fedistream-btn fedistream-btn--secondary fedistream-btn--shuffle" data-playlist-id="<?php echo esc_attr( $post['id'] ?? '' ); ?>">
|
||
|
|
<svg viewBox="0 0 24 24" fill="currentColor"><path d="M10.59 9.17L5.41 4 4 5.41l5.17 5.17 1.42-1.41zM14.5 4l2.04 2.04L4 18.59 5.41 20 17.96 7.46 20 9.5V4h-5.5zm.33 9.41l-1.41 1.41 3.13 3.13L14.5 20H20v-5.5l-2.04 2.04-3.13-3.13z"/></svg>
|
||
|
|
<?php esc_html_e( 'Shuffle', 'wp-fedistream' ); ?>
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</header>
|
||
|
|
|
||
|
|
<?php if ( ! empty( $post['content'] ) ) : ?>
|
||
|
|
<section class="fedistream-single__content">
|
||
|
|
<div class="fedistream-single__description">
|
||
|
|
<?php echo wp_kses_post( $post['content'] ); ?>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
<?php endif; ?>
|
||
|
|
|
||
|
|
<?php if ( ! empty( $post['tracks'] ) && is_array( $post['tracks'] ) ) : ?>
|
||
|
|
<section class="fedistream-single__tracklist">
|
||
|
|
<div class="fedistream-tracklist fedistream-tracklist--playlist">
|
||
|
|
<?php foreach ( $post['tracks'] as $index => $track ) : ?>
|
||
|
|
<div class="fedistream-tracklist__item" data-track-id="<?php echo esc_attr( $track['id'] ?? '' ); ?>">
|
||
|
|
<span class="fedistream-tracklist__number"><?php echo esc_html( $index + 1 ); ?></span>
|
||
|
|
<?php if ( ! empty( $track['thumbnail'] ) ) : ?>
|
||
|
|
<img src="<?php echo esc_url( $track['thumbnail'] ); ?>" alt="" class="fedistream-tracklist__artwork">
|
||
|
|
<?php endif; ?>
|
||
|
|
<div class="fedistream-tracklist__info">
|
||
|
|
<a href="<?php echo esc_url( $track['permalink'] ?? '#' ); ?>" class="fedistream-tracklist__title"><?php echo esc_html( $track['title'] ?? '' ); ?></a>
|
||
|
|
<span class="fedistream-tracklist__artist">
|
||
|
|
<?php if ( ! empty( $track['artists'] ) && is_array( $track['artists'] ) ) : ?>
|
||
|
|
<?php
|
||
|
|
$artist_links = array();
|
||
|
|
foreach ( $track['artists'] as $artist ) {
|
||
|
|
$artist_links[] = sprintf(
|
||
|
|
'<a href="%s">%s</a>',
|
||
|
|
esc_url( $artist['url'] ?? '#' ),
|
||
|
|
esc_html( $artist['name'] ?? '' )
|
||
|
|
);
|
||
|
|
}
|
||
|
|
echo implode( ', ', $artist_links ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
|
||
|
|
?>
|
||
|
|
<?php elseif ( ! empty( $track['artist'] ) ) : ?>
|
||
|
|
<?php echo esc_html( $track['artist'] ); ?>
|
||
|
|
<?php endif; ?>
|
||
|
|
</span>
|
||
|
|
</div>
|
||
|
|
<?php if ( ! empty( $track['explicit'] ) ) : ?>
|
||
|
|
<span class="fedistream-badge fedistream-badge--explicit">E</span>
|
||
|
|
<?php endif; ?>
|
||
|
|
<?php if ( ! empty( $track['duration_formatted'] ) ) : ?>
|
||
|
|
<span class="fedistream-tracklist__duration"><?php echo esc_html( $track['duration_formatted'] ); ?></span>
|
||
|
|
<?php endif; ?>
|
||
|
|
<button type="button" class="fedistream-tracklist__play" aria-label="<?php esc_attr_e( 'Play', 'wp-fedistream' ); ?>">
|
||
|
|
<svg viewBox="0 0 24 24" fill="currentColor"><path d="M8 5v14l11-7z"/></svg>
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
<?php endforeach; ?>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
<?php else : ?>
|
||
|
|
<section class="fedistream-single__empty">
|
||
|
|
<div class="fedistream-empty">
|
||
|
|
<p><?php esc_html_e( 'This playlist is empty.', 'wp-fedistream' ); ?></p>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
<?php endif; ?>
|
||
|
|
</article>
|