You've already forked wp-fedistream
feat: Initial release v0.1.0
WP FediStream - Stream music over ActivityPub Features: - Custom post types: Artist, Album, Track, Playlist - Custom taxonomies: Genre, Mood, License - User roles: Artist, Label - Admin dashboard with statistics - Frontend templates and shortcodes - Audio player with queue management - ActivityPub integration with actor support - WooCommerce product types for albums/tracks - User library with favorites and history - Notification system (in-app and email) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
120
templates/single/track.twig
Normal file
120
templates/single/track.twig
Normal file
@@ -0,0 +1,120 @@
|
||||
{# Single track template #}
|
||||
<article class="fedistream-single fedistream-single--track">
|
||||
<header class="fedistream-single__header fedistream-single__header--track">
|
||||
<div class="fedistream-single__artwork">
|
||||
{% if post.thumbnail %}
|
||||
<img src="{{ post.thumbnail }}" alt="{{ post.title|e('html_attr') }}" class="fedistream-single__image fedistream-single__image--track">
|
||||
{% else %}
|
||||
<div class="fedistream-single__placeholder fedistream-single__placeholder--track">
|
||||
<svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 3v10.55c-.59-.34-1.27-.55-2-.55-2.21 0-4 1.79-4 4s1.79 4 4 4 4-1.79 4-4V7h4V3h-6z"/></svg>
|
||||
</div>
|
||||
{% endif %}
|
||||
<button type="button" class="fedistream-single__play-overlay" data-track-id="{{ post.id }}" aria-label="{{ __('Play', 'wp-fedistream') }}">
|
||||
<svg viewBox="0 0 24 24" fill="currentColor"><path d="M8 5v14l11-7z"/></svg>
|
||||
</button>
|
||||
</div>
|
||||
<div class="fedistream-single__info">
|
||||
<h1 class="fedistream-single__title">{{ post.title }}</h1>
|
||||
{% if post.artists is not empty %}
|
||||
<p class="fedistream-single__artists">
|
||||
{% for artist in post.artists %}
|
||||
<a href="{{ artist.link }}">{{ artist.name }}</a>{% if not loop.last %}, {% endif %}
|
||||
{% endfor %}
|
||||
</p>
|
||||
{% endif %}
|
||||
{% if post.album %}
|
||||
<p class="fedistream-single__album">
|
||||
{{ __('From', 'wp-fedistream') }} <a href="{{ post.album_link }}">{{ post.album }}</a>
|
||||
</p>
|
||||
{% endif %}
|
||||
<div class="fedistream-single__meta">
|
||||
{% if post.duration_formatted %}
|
||||
<span class="fedistream-single__duration">{{ post.duration_formatted }}</span>
|
||||
{% endif %}
|
||||
{% if post.play_count %}
|
||||
<span class="fedistream-single__plays">{{ post.play_count }} {{ post.play_count == 1 ? __('play', 'wp-fedistream') : __('plays', 'wp-fedistream') }}</span>
|
||||
{% endif %}
|
||||
{% if post.explicit %}
|
||||
<span class="fedistream-badge fedistream-badge--explicit">{{ __('Explicit', 'wp-fedistream') }}</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% if post.genres is not empty %}
|
||||
<div class="fedistream-single__genres">
|
||||
{% for genre in post.genres %}
|
||||
<a href="{{ genre.link }}" class="fedistream-tag">{{ genre.name }}</a>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if post.moods is not empty %}
|
||||
<div class="fedistream-single__moods">
|
||||
{% for mood in post.moods %}
|
||||
<a href="{{ mood.link }}" class="fedistream-tag fedistream-tag--mood">{{ mood.name }}</a>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</header>
|
||||
|
||||
{% if post.audio_url %}
|
||||
<section class="fedistream-single__player">
|
||||
<div class="fedistream-player" data-track-id="{{ post.id }}" data-audio-url="{{ post.audio_url }}">
|
||||
<div class="fedistream-player__controls">
|
||||
<button type="button" class="fedistream-player__btn fedistream-player__btn--play" aria-label="{{ __('Play', 'wp-fedistream') }}">
|
||||
<svg class="fedistream-player__icon fedistream-player__icon--play" viewBox="0 0 24 24" fill="currentColor"><path d="M8 5v14l11-7z"/></svg>
|
||||
<svg class="fedistream-player__icon fedistream-player__icon--pause" viewBox="0 0 24 24" fill="currentColor"><path d="M6 19h4V5H6v14zm8-14v14h4V5h-4z"/></svg>
|
||||
</button>
|
||||
</div>
|
||||
<div class="fedistream-player__progress">
|
||||
<span class="fedistream-player__time fedistream-player__time--current">0:00</span>
|
||||
<div class="fedistream-player__bar">
|
||||
<div class="fedistream-player__bar-progress"></div>
|
||||
<input type="range" class="fedistream-player__seek" min="0" max="100" value="0" aria-label="{{ __('Seek', 'wp-fedistream') }}">
|
||||
</div>
|
||||
<span class="fedistream-player__time fedistream-player__time--total">{{ post.duration_formatted|default('0:00') }}</span>
|
||||
</div>
|
||||
<div class="fedistream-player__volume">
|
||||
<button type="button" class="fedistream-player__btn fedistream-player__btn--volume" aria-label="{{ __('Volume', 'wp-fedistream') }}">
|
||||
<svg viewBox="0 0 24 24" fill="currentColor"><path d="M3 9v6h4l5 5V4L7 9H3zm13.5 3c0-1.77-1.02-3.29-2.5-4.03v8.05c1.48-.73 2.5-2.25 2.5-4.02zM14 3.23v2.06c2.89.86 5 3.54 5 6.71s-2.11 5.85-5 6.71v2.06c4.01-.91 7-4.49 7-8.77s-2.99-7.86-7-8.77z"/></svg>
|
||||
</button>
|
||||
<input type="range" class="fedistream-player__volume-slider" min="0" max="100" value="80" aria-label="{{ __('Volume', 'wp-fedistream') }}">
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{% endif %}
|
||||
|
||||
{% if post.content %}
|
||||
<section class="fedistream-single__content">
|
||||
<h2 class="fedistream-section__title">{{ __('About This Track', 'wp-fedistream') }}</h2>
|
||||
<div class="fedistream-single__description">
|
||||
{{ post.content|raw }}
|
||||
</div>
|
||||
</section>
|
||||
{% endif %}
|
||||
|
||||
{% if post.lyrics %}
|
||||
<section class="fedistream-single__lyrics">
|
||||
<h2 class="fedistream-section__title">{{ __('Lyrics', 'wp-fedistream') }}</h2>
|
||||
<div class="fedistream-lyrics">
|
||||
{{ post.lyrics|nl2br }}
|
||||
</div>
|
||||
</section>
|
||||
{% endif %}
|
||||
|
||||
{% if post.credits %}
|
||||
<section class="fedistream-single__credits">
|
||||
<h2 class="fedistream-section__title">{{ __('Credits', 'wp-fedistream') }}</h2>
|
||||
<div class="fedistream-credits">
|
||||
{{ post.credits|raw }}
|
||||
</div>
|
||||
</section>
|
||||
{% endif %}
|
||||
|
||||
{% if post.license %}
|
||||
<section class="fedistream-single__license">
|
||||
<p class="fedistream-license">
|
||||
<strong>{{ __('License:', 'wp-fedistream') }}</strong>
|
||||
<a href="{{ post.license.link }}">{{ post.license.name }}</a>
|
||||
</p>
|
||||
</section>
|
||||
{% endif %}
|
||||
</article>
|
||||
Reference in New Issue
Block a user