refactor: replace "embeddable-player" occurrences to "embed"

This commit is contained in:
Yassine Doghri 2021-10-20 14:22:58 +00:00
parent be5a28787f
commit 025b2f42e6
59 changed files with 122 additions and 239 deletions

View File

@ -36,7 +36,7 @@ $routes->addPlaceholder('slug', '[a-zA-Z0-9\-]{1,128}');
$routes->addPlaceholder('base64', '[A-Za-z0-9\.\_]+\-{0,2}');
$routes->addPlaceholder('platformType', '\bpodcasting|\bsocial|\bfunding');
$routes->addPlaceholder('postAction', '\bfavourite|\breblog|\breply');
$routes->addPlaceholder('embeddablePlayerTheme', '\blight|\bdark|\blight-transparent|\bdark-transparent');
$routes->addPlaceholder('embedTheme', '\blight|\bdark|\blight-transparent|\bdark-transparent');
$routes->addPlaceholder(
'uuid',
'[0-9A-Fa-f]{8}-[0-9A-Fa-f]{4}-4[0-9A-Fa-f]{3}-[89ABab][0-9A-Fa-f]{3}-[0-9A-Fa-f]{12}',
@ -154,17 +154,13 @@ $routes->group('@(:podcastHandle)', function ($routes): void {
$routes->get('oembed.xml', 'EpisodeController::oembedXML/$1/$2', [
'as' => 'episode-oembed-xml',
]);
$routes->group('embeddable-player', function ($routes): void {
$routes->get('/', 'EpisodeController::embeddablePlayer/$1/$2', [
'as' => 'embeddable-player',
$routes->group('embed', function ($routes): void {
$routes->get('/', 'EpisodeController::embed/$1/$2', [
'as' => 'embed',
]);
$routes->get(
'(:embeddablePlayerTheme)',
'EpisodeController::embeddablePlayer/$1/$2/$3',
[
'as' => 'embeddable-player-theme',
],
);
$routes->get('(:embedTheme)', 'EpisodeController::embed/$1/$2/$3', [
'as' => 'embed-theme',
],);
});
});

View File

@ -138,7 +138,7 @@ class EpisodeController extends BaseController
return $cachedView;
}
public function embeddablePlayer(string $theme = 'light-transparent'): string
public function embed(string $theme = 'light-transparent'): string
{
header('Content-Security-Policy: frame-ancestors http://*:* https://*:*');
@ -150,13 +150,13 @@ class EpisodeController extends BaseController
$session = Services::session();
$session->start();
if (isset($_SERVER['HTTP_REFERER'])) {
$session->set('embeddable_player_domain', parse_url($_SERVER['HTTP_REFERER'], PHP_URL_HOST));
$session->set('embed_domain', parse_url($_SERVER['HTTP_REFERER'], PHP_URL_HOST));
}
$locale = service('request')
->getLocale();
$cacheName = "page_podcast#{$this->podcast->id}_episode#{$this->episode->id}_embeddable_player_{$theme}_{$locale}";
$cacheName = "page_podcast#{$this->podcast->id}_episode#{$this->episode->id}_embed_{$theme}_{$locale}";
if (! ($cachedView = cache($cacheName))) {
$themeData = EpisodeModel::$themes[$theme];
@ -173,7 +173,7 @@ class EpisodeController extends BaseController
);
// The page cache is set to a decade so it is deleted manually upon podcast update
return view('embeddable_player', $data, [
return view('embed', $data, [
'cache' => $secondsToNextUnpublishedEpisode
? $secondsToNextUnpublishedEpisode
: DECADE,
@ -196,7 +196,7 @@ class EpisodeController extends BaseController
'author_url' => $this->podcast->link,
'html' =>
'<iframe src="' .
$this->episode->embeddable_player_url .
$this->episode->embed_url .
'" width="100%" height="144" frameborder="0" scrolling="no"></iframe>',
'width' => 600,
'height' => 144,
@ -226,7 +226,7 @@ class EpisodeController extends BaseController
'html',
htmlentities(
'<iframe src="' .
$this->episode->embeddable_player_url .
$this->episode->embed_url .
'" width="100%" height="144" frameborder="0" scrolling="no"></iframe>',
),
);

View File

@ -41,7 +41,7 @@ class AddPodcastsPlatforms extends Migration
'constraint' => 1,
'default' => 0,
],
'is_on_embeddable_player' => [
'is_on_embed' => [
'type' => 'TINYINT',
'constraint' => 1,
'default' => 0,

View File

@ -78,7 +78,7 @@ use RuntimeException;
*
* @property Person[] $persons;
* @property Soundbite[] $soundbites;
* @property string $embeddable_player_url;
* @property string $embed_url;
*/
class Episode extends Entity
{
@ -96,7 +96,7 @@ class Episode extends Entity
protected string $audio_file_opengraph_url;
protected string $embeddable_player_url;
protected string $embed_url;
protected Image $image;
@ -422,18 +422,12 @@ class Episode extends Entity
return url_to('episode', $this->getPodcast()->handle, $this->attributes['slug']);
}
public function getEmbeddablePlayerUrl(string $theme = null): string
public function getEmbedUrl(string $theme = null): string
{
return base_url(
$theme
? route_to(
'embeddable-player-theme',
$this->getPodcast()
->handle,
$this->attributes['slug'],
$theme,
)
: route_to('embeddable-player', $this->getPodcast()->handle, $this->attributes['slug']),
? route_to('embed-theme', $this->getPodcast() ->handle, $this->attributes['slug'], $theme,)
: route_to('embed', $this->getPodcast()->handle, $this->attributes['slug']),
);
}

View File

@ -21,7 +21,7 @@ use CodeIgniter\Entity\Entity;
* @property string|null $link_url
* @property string|null $link_content
* @property bool|null $is_visible
* @property bool|null $is_on_embeddable_player
* @property bool|null $is_on_embed
*/
class Platform extends Entity
{
@ -37,6 +37,6 @@ class Platform extends Entity
'link_url' => '?string',
'link_content' => '?string',
'is_visible' => '?boolean',
'is_on_embeddable_player' => '?boolean',
'is_on_embed' => '?boolean',
];
}

View File

@ -106,9 +106,9 @@ if (! function_exists('publication_pill')) {
{
$class = match ($publicationStatus) {
'published' => 'text-pine-600 border-pine-600 bg-pine-50',
'scheduled' => 'text-red-600 border-red-600 bg-red-50',
'not_published' => 'text-gray-600 border-gray-600 bg-gray-50',
default => 'text-gray-600 border-gray-600 bg-gray-50',
'scheduled' => 'text-red-600 border-red-600 bg-red-50',
'not_published' => 'text-gray-600 border-gray-600 bg-gray-50',
default => 'text-gray-600 border-gray-600 bg-gray-50',
};
$label = lang('Episode.publication_status.' . $publicationStatus);
@ -292,7 +292,10 @@ if (! function_exists('audio_player')) {
if (! function_exists('relative_time')) {
function relative_time(Time $time, string $class = ''): string
{
$translatedDate = lang('Common.mediumDate', [$time]);
$formatter = new IntlDateFormatter(service(
'request'
)->getLocale(), IntlDateFormatter::MEDIUM, IntlDateFormatter::NONE);
$translatedDate = $time->toLocalizedString($formatter->getPattern());
$datetime = $time->format(DateTime::ISO8601);
return <<<CODE_SAMPLE

View File

@ -13,17 +13,10 @@ return [
'no' => 'No',
'cancel' => 'Cancel',
'optional' => 'Optional',
'more' => 'More',
'no_data' => 'No data found!',
'close' => 'Close',
'edit' => 'Edit',
'copy' => 'Copy',
'copied' => 'Copied!',
'home' => 'Home',
'explicit' => 'Explicit',
'mediumDate' => '{0,date,medium}',
'powered_by' => 'Powered by {castopod}',
'pageInfo' => 'Page {currentPage} out of {pageCount}',
'go_back' => 'Go back',
'play_episode_button' => [
'play' => 'Play',

View File

@ -19,7 +19,7 @@ return [
one {# person}
other {# persons}
}',
'persons_list' => 'Persons for {episodeTitle}',
'persons_list' => 'Persons',
'back_to_episodes' => 'Back to episodes of {podcast}',
'comments' => 'Comments',
'activity' => 'Activity',

View File

@ -9,21 +9,7 @@ declare(strict_types=1);
*/
return [
'all_podcasts' => 'All podcasts',
'no_podcast' => 'No podcast found!',
'create' => 'Create podcast',
'import' => 'Import podcast',
'new_episode' => 'New Episode',
'feed' => 'RSS Podcast feed',
'view' => 'View podcast',
'edit' => 'Edit podcast',
'delete' => 'Delete podcast',
'see_episodes' => 'See episodes',
'see_contributors' => 'See contributors',
'go_to_page' => 'Go to page',
'latest_episodes' => 'Latest episodes',
'see_all_episodes' => 'See all episodes',
'by' => 'By {publisher}',
'season' => 'Season {seasonNumber}',
'list_of_episodes_year' => '{year} episodes ({episodeCount})',
'list_of_episodes_season' =>

View File

@ -13,18 +13,11 @@ return [
'no' => 'Non',
'cancel' => 'Annuler',
'optional' => 'Optionnel',
'more' => 'Plus',
'no_data' => 'Aucune donnée trouvée!',
'close' => 'Fermer',
'edit' => 'Modifier',
'copy' => 'Copier',
'copied' => 'Copié!',
'home' => 'Accueil',
'explicit' => 'Explicite',
'mediumDate' => '{0,date,medium}',
'powered_by' => 'Propulsé par {castopod}',
'actions' => 'Actions',
'pageInfo' => 'Page {currentPage} sur {pageCount}',
'go_back' => 'Retour en arrière',
'play_episode_button' => [
'play' => 'Lire',

View File

@ -19,7 +19,7 @@ return [
one {# intervenant·e}
other {# intervenant·e·s}
}',
'persons_list' => 'Liste des intervenant·e·s',
'persons_list' => 'Intervenant·e·s',
'back_to_episodes' => 'Retour aux épisodes de {podcast}',
'comments' => 'Commentaires',
'activity' => 'Activité',

View File

@ -9,21 +9,7 @@ declare(strict_types=1);
*/
return [
'all_podcasts' => 'Tous les podcasts',
'no_podcast' => 'Aucun podcast trouvé!',
'create' => 'Créer un podcast',
'import' => 'Importer un podcast',
'new_episode' => 'Créer un épisode',
'feed' => 'Podcast RSS feed',
'view' => 'Voir le podcast',
'edit' => 'Modifier le podcast',
'delete' => 'Supprimer le podcast',
'see_episodes' => 'Voir les épisodes',
'see_contributors' => 'Voir les contributeurs',
'go_to_page' => 'Aller à la page',
'latest_episodes' => 'Derniers épisodes',
'see_all_episodes' => 'Voir tous les épisodes',
'by' => 'Par {publisher}',
'season' => 'Saison {seasonNumber}',
'list_of_episodes_year' => 'Épisodes de {year} ({episodeCount})',
'list_of_episodes_season' =>
@ -52,5 +38,5 @@ return [
one {# intervenant·e}
other {# intervenant·e·s}
}',
'persons_list' => 'Liste des intervenant·e·s',
'persons_list' => 'Intervenant·e·s',
];

View File

@ -102,7 +102,7 @@ class PlatformModel extends Model
! ($found = cache("podcast#{$podcastId}_platforms_{$platformType}_withLinks"))
) {
$found = $this->select(
'platforms.*, podcasts_platforms.link_url, podcasts_platforms.link_content, podcasts_platforms.is_visible, podcasts_platforms.is_on_embeddable_player',
'platforms.*, podcasts_platforms.link_url, podcasts_platforms.link_content, podcasts_platforms.is_visible, podcasts_platforms.is_on_embed',
)
->join(
'podcasts_platforms',
@ -127,7 +127,7 @@ class PlatformModel extends Model
$cacheName = "podcast#{$podcastId}_platforms_{$platformType}";
if (! ($found = cache($cacheName))) {
$found = $this->select(
'platforms.*, podcasts_platforms.link_url, podcasts_platforms.link_content, podcasts_platforms.is_visible, podcasts_platforms.is_on_embeddable_player',
'platforms.*, podcasts_platforms.link_url, podcasts_platforms.link_content, podcasts_platforms.is_visible, podcasts_platforms.is_on_embed',
)
->join('podcasts_platforms', 'podcasts_platforms.platform_slug = platforms.slug')
->where('podcasts_platforms.podcast_id', $podcastId)

View File

@ -35,6 +35,14 @@ import {
import "@vime/core/themes/default.css";
import "@vime/core/themes/light.css";
// Register Castopod's icons library
const library: HTMLVmIconLibraryElement | null = document.querySelector(
'vm-icon-library[name="castopod-icons"]'
);
if (library) {
library.resolver = (iconName) => `/assets/icons/${iconName}.svg`;
}
// Vime elements for audio player
customElements.define("vm-player", VmPlayer);
customElements.define("vm-file", VmFile);
@ -68,11 +76,3 @@ customElements.define("vm-menu-radio-group", VmMenuRadioGroup);
customElements.define("vm-menu-radio", VmMenuRadio);
customElements.define("vm-settings", VmSettings);
customElements.define("vm-skeleton", VmSkeleton);
// Register Castopod's icons library
const library: HTMLVmIconLibraryElement | null = document.querySelector(
'vm-icon-library[name="castopod-icons"]'
);
if (library) {
library.resolver = (iconName) => `/assets/icons/${iconName}.svg`;
}

View File

@ -1,9 +1,8 @@
const ThemePicker = (): void => {
const buttons: NodeListOf<HTMLButtonElement> | null =
document.querySelectorAll("button[data-type='theme-picker']");
const iframe: HTMLIFrameElement | null = document.querySelector(
`iframe[id="embeddable_player"]`
);
const iframe: HTMLIFrameElement | null =
document.querySelector(`iframe[id="embed"]`);
const iframeTextArea: HTMLFormElement | null =
document.querySelector(`[id="iframe"]`);
const urlTextArea: HTMLFormElement | null =

View File

@ -206,7 +206,8 @@ export class PlayEpisodeButton extends LitElement {
}
button:focus {
box-shadow: 0 0 0 2px #e7f9e4, 0 0 0 calc(2px + 2px) #009486;
outline: none;
box-shadow: 0 0 0 2px #e7f9e4, 0 0 0 4px #009486;
}
button.playing {

View File

@ -31,6 +31,6 @@
}
.form-input-tabs > input:checked + label {
@apply font-semibold opacity-100 text-pine-700;
@apply font-semibold opacity-100 text-pine-500;
}
}

View File

@ -8,7 +8,6 @@
@import "./switch.css";
@import "./charts.css";
@import "./post.css";
@import "./tabs.css";
@import "./radioToggler.css";
@import "./formInputTabs.css";
@import "./stickyHeader.css";

View File

@ -1,38 +0,0 @@
@layer components {
.tabset {
@apply grid grid-cols-3;
}
.tabset > input[type="radio"] {
@apply absolute -left-full;
}
.tabset .tab-panel {
@apply hidden;
}
/* Logic for 3 tabs at most */
.tabset > input:first-child:checked ~ .tab-panels > .tab-panel:first-child,
.tabset > input:nth-child(3):checked ~ .tab-panels > .tab-panel:nth-child(2),
.tabset > input:nth-child(5):checked ~ .tab-panels > .tab-panel:nth-child(3) {
@apply block;
}
/* Styling */
.tabset > label {
@apply relative inline-block w-full px-4 py-3 text-center cursor-pointer opacity-70 hover:opacity-100;
}
.tabset > input:checked + label::after {
@apply absolute inset-x-0 bottom-0 w-1/3 h-1 mx-auto bg-pine-500;
content: "";
}
.tabset > input:checked + label {
@apply font-semibold opacity-100 text-pine-700;
}
.tabset .tab-panels {
@apply col-span-3 p-6;
}
}

View File

@ -320,10 +320,10 @@ $routes->group(
],
);
$routes->get(
'embeddable-player',
'EpisodeController::embeddablePlayer/$1/$2',
'embed',
'EpisodeController::embed/$1/$2',
[
'as' => 'embeddable-player-add',
'as' => 'embed-add',
'filter' => 'permission:podcast_episodes-edit',
],
);

View File

@ -822,7 +822,7 @@ class EpisodeController extends BaseController
return redirect()->route('soundbites-edit', [$this->podcast->id, $this->episode->id]);
}
public function embeddablePlayer(): string
public function embed(): string
{
helper(['form']);
@ -836,7 +836,7 @@ class EpisodeController extends BaseController
0 => $this->podcast->title,
1 => $this->episode->title,
]);
return view('episode/embeddable_player', $data);
return view('episode/embed', $data);
}
public function attemptCommentCreate(): RedirectResponse

View File

@ -85,11 +85,8 @@ class PodcastPlatformController extends BaseController
'is_visible' =>
array_key_exists('visible', $podcastPlatform) &&
$podcastPlatform['visible'] === 'yes',
'is_on_embeddable_player' =>
array_key_exists(
'on_embeddable_player',
$podcastPlatform,
) && $podcastPlatform['on_embeddable_player'] === 'yes',
'is_on_embed' =>
array_key_exists('on_embed', $podcastPlatform,) && $podcastPlatform['on_embed'] === 'yes',
];
}

View File

@ -41,5 +41,5 @@ return [
'listening-time' => 'listening time',
'time-periods' => 'time periods',
'soundbites' => 'soundbites',
'embeddable-player' => 'embeddable player',
'embed' => 'embeddable player',
];

View File

@ -21,7 +21,6 @@ return [
'copied' => 'Copied!',
'home' => 'Home',
'explicit' => 'Explicit',
'mediumDate' => '{0,date,medium}',
'powered_by' => 'Powered by {castopod}',
'actions' => 'Actions',
'pageInfo' => 'Page {currentPage} out of {pageCount}',

View File

@ -160,9 +160,9 @@ return [
'delete' => 'Delete soundbite',
'bookmark' =>
'Click while playing to get current position, click again to get duration.',
'submit_edit' => 'Save all soundbites',
'submit' => 'Save soundbites',
],
'embeddable_player' => [
'embed' => [
'title' => 'Embeddable player',
'label' =>
'Pick a theme color, copy the embeddable player to clipboard, then paste it on your website.',

View File

@ -14,6 +14,6 @@ return [
'episode-view' => 'Home',
'episode-edit' => 'Edit episode',
'episode-persons-manage' => 'Manage persons',
'embeddable-player-add' => 'Embeddable player',
'embed-add' => 'Embeddable player',
'soundbites-edit' => 'Soundbites',
];

View File

@ -13,7 +13,7 @@ return [
'home_url' => 'Go to {platformName} website',
'submit_url' => 'Submit your podcast on {platformName}',
'visible' => 'Display in podcast homepage?',
'on_embeddable_player' => 'Display on embeddable player?',
'on_embed' => 'Display on embeddable player?',
'remove' => 'Remove {platformName}',
'submit' => 'Save',
'messages' => [

View File

@ -41,5 +41,5 @@ return [
'listening-time' => 'drée découte',
'time-periods' => 'périodes',
'soundbites' => 'extraits sonores',
'embeddable-player' => 'lecteur intégré',
'embed' => 'lecteur intégré',
];

View File

@ -21,7 +21,6 @@ return [
'copied' => 'Copié!',
'home' => 'Accueil',
'explicit' => 'Explicite',
'mediumDate' => '{0,date,medium}',
'powered_by' => 'Propulsé par {castopod}',
'actions' => 'Actions',
'pageInfo' => 'Page {currentPage} sur {pageCount}',

View File

@ -168,9 +168,9 @@ return [
'delete' => 'Supprimer lextrait sonore',
'bookmark' =>
'Cliquez pour récupérer la position actuelle, cliquez à nouveau pour récupérer la durée.',
'submit_edit' => 'Enregistrer tous les extraits sonores',
'submit' => 'Enregistrer les extraits sonnores',
],
'embeddable_player' => [
'embed' => [
'add' => 'Ajouter un lecteur intégré',
'title' => 'Lecteur intégré',
'label' =>

View File

@ -14,6 +14,6 @@ return [
'episode-view' => 'Accueil',
'episode-edit' => 'Modifier lépisode',
'episode-persons-manage' => 'Gestion des intervenants',
'embeddable-player-add' => 'Lecteur intégré',
'embed' => 'Lecteur intégré',
'soundbites-edit' => 'Extraits sonores',
];

View File

@ -13,7 +13,7 @@ return [
'home_url' => 'Aller au site {platformName}',
'submit_url' => 'Soumettez votre podcast sur {platformName}',
'visible' => 'Afficher sur la page daccueil du podcast?',
'on_embeddable_player' => 'Afficher sur le lecteur intégré?',
'on_embed' => 'Afficher sur le lecteur intégré?',
'remove' => 'Supprimer {platformName}',
'submit' => 'Enregistrer',
'messages' => [

View File

@ -56,8 +56,8 @@ class EpisodeAnalyticsController extends Controller
$serviceName = '';
if (isset($_GET['_from'])) {
$serviceName = $_GET['_from'];
} elseif ($session->get('embeddable_player_domain') !== null) {
$serviceName = $session->get('embeddable_player_domain');
} elseif ($session->get('embed_domain') !== null) {
$serviceName = $session->get('embed_domain');
} elseif ($session->get('referer') !== null && $session->get('referer') !== '- Direct -') {
$serviceName = parse_url($session->get('referer'), PHP_URL_HOST);
}

View File

@ -3,11 +3,11 @@
$podcastNavigation = [
'dashboard' => [
'icon' => 'dashboard',
'items' => ['episode-view', 'episode-edit', 'episode-persons-manage', 'embeddable-player-add', 'soundbites-edit'],
'items' => ['episode-view', 'episode-edit', 'episode-persons-manage', 'embed-add', 'soundbites-edit'],
],
]; ?>
<a href="<?= route_to('podcast-view', $podcast->id) ?>" class="flex items-center px-4 py-2 border-b border-pine-900 focus:ring-castopod">
<a href="<?= route_to('podcast-view', $podcast->id) ?>" class="flex items-center px-4 py-2 border-b border-pine-900 focus:ring-inset focus:ring-castopod">
<?= icon('arrow-left', 'mr-2') ?>
<img
src="<?= $podcast->image->thumbnail_url ?>"

View File

@ -1,39 +1,39 @@
<?= $this->extend('_layout') ?>
<?= $this->section('title') ?>
<?= lang('Episode.embeddable_player.title') ?>
<?= lang('Episode.embed.title') ?>
<?= $this->endSection() ?>
<?= $this->section('pageTitle') ?>
<?= lang('Episode.embeddable_player.title') ?>
<?= lang('Episode.embed.title') ?>
<?= $this->endSection() ?>
<?= $this->section('content') ?>
<p><?= lang('Episode.embeddable_player.label') ?></p>
<p><?= lang('Episode.embed.label') ?></p>
<div class="flex w-full mt-6">
<?php foreach ($themes as $themeKey => $theme): ?>
<button style="<?= $theme[
'style'
] ?>" class="w-12 h-12 mr-1 border-2 border-gray-400 rounded-lg hover:border-white" title="<?= lang(
"Episode.embeddable_player.{$themeKey}",
) ?>" data-type="theme-picker" data-url="<?= $episode->getEmbeddablePlayerUrl(
"Episode.embed.{$themeKey}",
) ?>" data-type="theme-picker" data-url="<?= $episode->getEmbedUrl(
$themeKey,
) ?>"></button>
<?php endforeach; ?>
</div>
<iframe name="embeddable_player" id="embeddable_player" class="w-full max-w-xl mt-6 h-36" frameborder="0" scrolling="no" style="width: 100%; overflow: hidden;" src="<?= $episode->embeddable_player_url ?>"></iframe>
<iframe name="embed" id="embed" class="w-full max-w-xl mt-6 h-36" frameborder="0" scrolling="no" style="width: 100%; overflow: hidden;" src="<?= $episode->embed_url ?>"></iframe>
<div class="flex items-center mt-8 gap-x-2">
<Forms.Textarea readonly="true" class="w-full max-w-xl" name="iframe" rows="2" value="<?= esc("<iframe width=\"100%\" height=\"280\" frameborder=\"0\" scrolling=\"no\" style=\"width: 100%; height: 280px; overflow: hidden;\" src=\"{$episode->embeddable_player_url}\"></iframe>") ?>" />
<IconButton glyph="file-copy" data-type="clipboard-copy" data-clipboard-target="iframe"><?= lang('Episode.embeddable_player.clipboard_iframe') ?></IconButton>
<Forms.Textarea readonly="true" class="w-full max-w-xl" name="iframe" rows="2" value="<?= esc("<iframe width=\"100%\" height=\"280\" frameborder=\"0\" scrolling=\"no\" style=\"width: 100%; height: 280px; overflow: hidden;\" src=\"{$episode->embed_url}\"></iframe>") ?>" />
<IconButton glyph="file-copy" data-type="clipboard-copy" data-clipboard-target="iframe"><?= lang('Episode.embed.clipboard_iframe') ?></IconButton>
</div>
<div class="flex items-center mt-4 gap-x-2">
<Forms.Input readonly="true" class="w-full max-w-xl" name="url" value="<?= $episode->embeddable_player_url ?>" />
<IconButton glyph="file-copy" data-type="clipboard-copy" data-clipboard-target="url"><?= lang('Episode.embeddable_player.clipboard_url') ?></IconButton>
<Forms.Input readonly="true" class="w-full max-w-xl" name="url" value="<?= $episode->embed_url ?>" />
<IconButton glyph="file-copy" data-type="clipboard-copy" data-clipboard-target="url"><?= lang('Episode.embed.clipboard_url') ?></IconButton>
</div>
<?= $this->endSection() ?>

View File

@ -84,8 +84,8 @@
],
[
'type' => 'link',
'title' => lang('Episode.embeddable_player.title'),
'uri' => route_to('embeddable-player-add', $podcast->id, $episode->id),
'title' => lang('Episode.embed.title'),
'uri' => route_to('embed-add', $podcast->id, $episode->id),
],
[
'type' => 'link',

View File

@ -28,7 +28,7 @@
<small class="max-w-md mb-2 text-gray-600"><?= lang('Episode.publish_form.post_hint') ?></small>
<div class="mb-8 overflow-hidden bg-white shadow-md rounded-xl">
<div class="flex px-4 py-3">
<img src="<?= $podcast->actor->avatar_image_url ?>" alt="<?= $podcast->actor->display_name ?>" class="w-12 h-12 mr-4 rounded-full" />
<img src="<?= $podcast->actor->avatar_image_url ?>" alt="<?= $podcast->actor->display_name ?>" class="w-10 h-10 mr-2 rounded-full" />
<div class="flex flex-col min-w-0">
<p class="flex items-baseline min-w-0">
<span class="mr-2 font-semibold truncate"><?= $podcast->actor->display_name ?></span>

View File

@ -29,7 +29,7 @@
<small class="max-w-md mb-2 text-gray-600"><?= lang('Episode.publish_form.post_hint') ?></small>
<div class="mb-8 overflow-hidden bg-white shadow-md rounded-xl">
<div class="flex px-4 py-3">
<img src="<?= $podcast->actor->avatar_image_url ?>" alt="<?= $podcast->actor->display_name ?>" class="w-12 h-12 mr-4 rounded-full" />
<img src="<?= $podcast->actor->avatar_image_url ?>" alt="<?= $podcast->actor->display_name ?>" class="w-10 h-10 mr-2 rounded-full" />
<div class="flex flex-col min-w-0">
<p class="flex items-baseline min-w-0">
<span class="mr-2 font-semibold truncate"><?= $podcast->actor->display_name ?></span>

View File

@ -8,10 +8,14 @@
<?= lang('Episode.soundbites_form.title') ?>
<?= $this->endSection() ?>
<?= $this->section('headerRight') ?>
<Button variant="primary" type="submit" form="soundbites-form"><?= lang('Episode.soundbites_form.submit') ?></Button>
<?= $this->endSection() ?>
<?= $this->section('content') ?>
<form action="<?= route_to('episode-soundbites-edit', $podcast->id, $episode->id) ?>" method="POST" class="flex flex-col">
<form id="soundbites-form" action="<?= route_to('episode-soundbites-edit', $podcast->id, $episode->id) ?>" method="POST" class="flex flex-col">
<?= csrf_field() ?>
<Forms.Section
@ -62,12 +66,7 @@
</audio>
<IconButton glyph="timer" variant="info" data-type="get-soundbite" data-start-time-field-name="soundbites[0][start_time]" data-duration-field-name="soundbites[0][duration]" ><?= lang('Episode.soundbites_form.bookmark') ?></IconButton>
</div>
</Forms.Section>
<Button variant="primary" type="submit" class="self-end"><?= lang('Episode.soundbites_form.submit_edit') ?></Button>
</form>
<?= $this->endSection() ?>

View File

@ -11,7 +11,7 @@
<?= $this->section('content') ?>
<form action="<?= route_to('change-password') ?>" method="POST" class="flex flex-col max-w-sm">
<form action="<?= route_to('change-password') ?>" method="POST" class="flex flex-col max-w-sm gap-y-4">
<?= csrf_field() ?>
<Forms.Field
name="password"

View File

@ -58,8 +58,8 @@
],
[
'type' => 'link',
'title' => lang('Episode.embeddable_player.title'),
'uri' => route_to('embeddable-player-add', $podcast->id, $episode->id),
'title' => lang('Episode.embed.title'),
'uri' => route_to('embed-add', $podcast->id, $episode->id),
],
[
'type' => 'link',

View File

@ -99,7 +99,7 @@
value="<?= $platform->link_content ?>"
placeholder="<?= lang("Platforms.description.{$platform->type}") ?>" />
<Forms.Toggler size="small" class="text-sm" id="<?= $platform->slug . '_visible' ?>" name="<?= 'platforms[' . $platform->slug . '][visible]'?>" value="yes" checked="<?= old($platform->slug . '_visible', $platform->is_visible ? $platform->is_visible : false) ?>"><?= lang('Platforms.visible') ?></Forms.Toggler>
<Forms.Toggler size="small" class="text-sm" id="<?= $platform->slug . '_on_embeddable_player' ?>" name="<?= 'platforms[' . $platform->slug . '][on_embeddable_player]'?>" value="yes" checked="<?= old($platform->slug . '_on_embeddable_player', $platform->is_on_embeddable_player ? $platform->is_on_embeddable_player : false) ?>"><?= lang('Platforms.on_embeddable_player') ?></Forms.Toggler>
<Forms.Toggler size="small" class="text-sm" id="<?= $platform->slug . '_on_embed' ?>" name="<?= 'platforms[' . $platform->slug . '][on_embed]'?>" value="yes" checked="<?= old($platform->slug . '_on_embed', $platform->is_on_embed ? $platform->is_on_embed : false) ?>"><?= lang('Platforms.on_embed') ?></Forms.Toggler>
</fieldset>
</div>
</div>

View File

@ -16,46 +16,23 @@
->asset('js/embed.ts', 'js') ?>
</head>
<body class="flex w-full h-screen" style="background: <?= $themeData[
'background'
] ?>; color: <?= $themeData['text'] ?>;">
<img src="<?= $episode->image
->thumbnail_url ?>" alt="<?= $episode->title ?>" class="flex-shrink w-36 h-36" />
<div class="flex flex-col items-start flex-1 min-w-0 px-4 py-2 h-36">
<div class="flex items-center w-full">
<a href="<?= route_to(
'podcast-activity',
$podcast->handle,
) ?>" style="color: <?= $themeData[
'text'
] ?>;" class="mr-2 text-xs tracking-wider uppercase truncate opacity-75 hover:opacity-100" target="_blank">
<?= $podcast->title ?>
</a>
<a href="https://castopod.org/" class="ml-auto text-3xl text-pine-500 hover:opacity-75" title="<?= lang(
'Common.powered_by',
[
'castopod' => 'Castopod',
],
) ?>" target="_blank" rel="noopener noreferrer">
<?= icon('podcasting/castopod') ?>
</a>
<body class="flex" style="background: <?= $themeData['background'] ?>; color: <?= $themeData['text'] ?>;">
<img src="<?= $episode->image->thumbnail_url ?>" alt="<?= $episode->title ?>" class="flex-shrink w-36 h-36" />
<div class="flex flex-col items-start flex-1 min-w-0 px-4 pt-4 h-36">
<a href="https://castopod.org/" class="absolute text-2xl top-1 right-2 text-pine-500 hover:opacity-75" title="<?= lang('Common.powered_by', [
'castopod' => 'Castopod',
]) ?>" target="_blank" rel="noopener noreferrer"><?= icon('podcasting/castopod') ?></a>
<div class="flex gap-x-2">
<?= episode_numbering($episode->number, $episode->season_number, 'text-xs font-semibold !no-underline border px-1 border-gray-500', true) ?>
<a href="<?= route_to('podcast-activity', $podcast->handle) ?>" style="color: <?= $themeData['text'] ?>;" class="text-xs truncate opacity-75 hover:opacity-100" target="_blank"><?= $podcast->title ?></a>
</div>
<a href="<?= $episode->link ?>" class="flex items-center mb-2" style="color: <?= $themeData[
'text'
] ?>;" target="_blank">
<?= episode_numbering(
$episode->number,
$episode->season_number,
'text-xs font-semibold text-gray-600 !no-underline border px-1 border-gray-500 mr-1',
true,
) ?><h1 class="mr-2 text-lg font-semibold truncate opacity-100 hover:opacity-75">
<?= $episode->title ?>
</h1>
<a href="<?= $episode->link ?>" class="flex flex-col items-start text-sm" style="color: <?= $themeData['text'] ?>;" target="_blank">
<h1 class="text-lg font-semibold leading-tight opacity-100 line-clamp-2 hover:opacity-75"><?= $episode->title ?></h1>
</a>
<vm-player
id="castopod-vm-player"
theme="<?= str_starts_with($theme, 'dark') ? 'dark' : 'light' ?>"
language="${language}"
language="<?= service('request')->getLocale() ?>"
icons="castopod-icons"
class="w-full mt-auto"
style="--vm-player-box-shadow:0; --vm-player-theme: #009486; --vm-control-spacing: 4px; --vm-control-icon-size: 24px; <?= str_ends_with($theme, 'transparent') ? '--vm-controls-bg: transparent;' : '' ?>"

View File

@ -32,7 +32,7 @@
<?php endif; ?>
<nav class="flex items-center justify-between h-10 col-start-2 px-2 text-white bg-pine-800">
<a href="<?= route_to('podcast-episodes', $podcast->handle) ?>" class="inline-flex items-center" title="<?= lang('Episode.back_to_episodes', [
<a href="<?= route_to('podcast-episodes', $podcast->handle) ?>" class="inline-flex items-center focus:ring-castopod" title="<?= lang('Episode.back_to_episodes', [
'podcast' => $podcast->title,
]) ?>">
<?= icon('arrow-left', 'mr-2 text-lg') ?>

View File

@ -1,5 +1,5 @@
<article class="relative z-10 flex w-full p-4 bg-white shadow rounded-conditional-2xl">
<img src="<?= $comment->actor->avatar_image_url ?>" alt="<?= $comment->display_name ?>" class="w-12 h-12 mr-4 rounded-full" />
<img src="<?= $comment->actor->avatar_image_url ?>" alt="<?= $comment->display_name ?>" class="w-10 h-10 mr-2 rounded-full" />
<div class="flex-1">
<header class="w-full mb-2 text-sm">
<a href="<?= $comment->actor->uri ?>" class="flex items-baseline hover:underline" <?= $comment->actor->is_local

View File

@ -1,6 +1,6 @@
<article class="flex px-6 py-4 bg-gray-50">
<img src="<?= $reply->actor->avatar_image_url ?>" alt="<?= $reply->actor
->display_name ?>" class="w-12 h-12 mr-4 rounded-full ring-gray-50 ring-2" />
->display_name ?>" class="w-10 h-10 mr-2 rounded-full ring-gray-50 ring-2" />
<div class="flex flex-col flex-1 min-w-0">
<header class="flex items-center mb-2">
<a href="<?= $reply->actor

View File

@ -1,13 +1,13 @@
<footer>
<?php if (can_user_interact()): ?>
<form action="<?= route_to('comment-attempt-like', interact_as_actor()->username, $episode->slug, $reply->id) ?>" method="POST" class="flex items-center gap-x-4">
<form action="<?= route_to('comment-attempt-like', interact_as_actor()->username, $reply->episode->slug, $reply->id) ?>" method="POST" class="flex items-center gap-x-4">
<button type="submit" name="action" class="inline-flex items-center hover:underline group" title="<?= lang(
'Comment.likes',
[
'numberOfLikes' => $reply->likes_count,
],
) ?>"><?= icon('heart', 'text-xl mr-1 text-gray-400 group-hover:text-red-600') . $reply->likes_count ?></button>
<Button uri="<?= route_to('episode-comment', $podcast->handle, $episode->slug, $reply->id) ?>" size="small"><?= lang('Comment.reply') ?></Button>
<Button uri="<?= route_to('episode-comment', $reply->episode->podcast->handle, $reply->episode->slug, $reply->id) ?>" size="small"><?= lang('Comment.reply') ?></Button>
</form>
<?php else: ?>
<button type="submit" name="action" class="inline-flex items-center opacity-50 cursor-not-allowed" disabled="disabled" title="<?= lang(
@ -18,7 +18,7 @@
) ?>"><?= icon('heart', 'text-xl mr-1 text-gray-500') . $reply->likes_count ?></button>
<?php if ($reply->replies_count): ?>
<?= anchor(
route_to('episode-comment', $podcast->handle, $episode->slug, $reply->id),
route_to('episode-comment', $reply->episode->podcast->handle, $reply->episode->slug, $reply->id),
icon('chat', 'text-2xl mr-1 text-gray-400') . $reply->replies_count,
[
'class' => 'inline-flex items-center hover:underline',

View File

@ -5,7 +5,7 @@
<form action="<?= route_to('comment-attempt-reply', $podcast->id, $episode->id, $comment->id) ?>" method="POST" class="flex px-6 pt-8 pb-4 bg-gray-50">
<img src="<?= interact_as_actor()
->avatar_image_url ?>" alt="<?= interact_as_actor()
->display_name ?>" class="w-12 h-12 mr-4 rounded-full ring-gray-50 ring-2" />
->display_name ?>" class="w-10 h-10 mr-2 rounded-full ring-gray-50 ring-2" />
<div class="flex flex-col flex-1">
<Forms.Textarea
name="message"

View File

@ -27,7 +27,7 @@
<meta name="twitter:card" content="player" />
<meta property="twitter:audio:partner" content="<?= $podcast->publisher ?>" />
<meta property="twitter:audio:artist_name" content="<?= $podcast->owner_name ?>" />
<meta name="twitter:player" content="<?= $episode->getEmbeddablePlayerUrl('light') ?>" />
<meta name="twitter:player" content="<?= $episode->getEmbedUrl('light') ?>" />
<meta name="twitter:player:width" content="600" />
<meta name="twitter:player:height" content="200" />
<?= $this->endSection() ?>
@ -42,7 +42,7 @@
<img src="<?= interact_as_actor()
->avatar_image_url ?>" alt="<?= interact_as_actor()
->display_name ?>" class="w-12 h-12 mr-4 rounded-full" />
->display_name ?>" class="w-10 h-10 mr-2 rounded-full" />
<div class="flex flex-col flex-1 min-w-0 gap-y-2">
<input name="episode_url" value="<?= $episode->link ?>" type="hidden" />
<Forms.Textarea

View File

@ -29,7 +29,7 @@
<meta name="twitter:card" content="player" />
<meta property="twitter:audio:partner" content="<?= $podcast->publisher ?>" />
<meta property="twitter:audio:artist_name" content="<?= $podcast->owner_name ?>" />
<meta name="twitter:player" content="<?= $episode->getEmbeddablePlayerUrl('light') ?>" />
<meta name="twitter:player" content="<?= $episode->getEmbedUrl('light') ?>" />
<meta name="twitter:player:width" content="600" />
<meta name="twitter:player:height" content="200" />
<?= $this->endSection() ?>

View File

@ -31,7 +31,7 @@
</div>
<?php endif; ?>
<header class="z-50 flex flex-col-reverse justify-between w-full col-start-2 bg-top bg-no-repeat bg-cover sm:flex-row sm:items-end bg-pine-800" style="background-image: url('<?= $podcast->actor->cover_image_url ?>'); aspect-ratio: 15 / 5;">
<header class="z-50 flex flex-col-reverse justify-between w-full col-start-2 bg-top bg-no-repeat bg-cover sm:flex-row sm:items-end bg-pine-800" style="background-image: url('<?= $podcast->actor->cover_image_url ?>'); aspect-ratio: 3 / 1;">
<div class="flex items-center pl-4 -mb-6 md:pl-8 md:-mb-8 gap-x-4">
<img src="<?= $podcast->image->thumbnail_url ?>" alt="<?= $podcast->title ?>" loading="lazy" class="h-24 rounded-full md:h-28 ring-4 ring-white" />
<div class="relative flex flex-col text-white -top-2">

View File

@ -35,7 +35,7 @@
<img src="<?= interact_as_actor()
->avatar_image_url ?>" alt="<?= interact_as_actor()
->display_name ?>" class="w-12 h-12 mr-4 rounded-full" />
->display_name ?>" class="w-10 h-10 mr-2 rounded-full" />
<div class="flex flex-col flex-1 min-w-0 gap-y-2">
<Forms.Textarea
name="message"

View File

@ -9,7 +9,7 @@
<form action="<?= route_to('post-attempt-action', interact_as_actor()->username, $post->id) ?>" method="POST" class="flex" >
<img src="<?= interact_as_actor()
->avatar_image_url ?>" alt="<?= interact_as_actor()
->display_name ?>" class="w-12 h-12 mr-4 rounded-full ring-gray-50 ring-2" />
->display_name ?>" class="w-10 h-10 mr-2 rounded-full ring-gray-50 ring-2" />
<div class="flex flex-col flex-1">
<Forms.Textarea
name="message"

View File

@ -8,7 +8,7 @@
]) ?></p>
<header class="flex px-6 py-4">
<img src="<?= $post->actor
->avatar_image_url ?>" alt="<?= $post->display_name ?>" class="w-12 h-12 mr-4 rounded-full" />
->avatar_image_url ?>" alt="<?= $post->display_name ?>" class="w-10 h-10 mr-2 rounded-full" />
<div class="flex flex-col min-w-0">
<a href="<?= $post->actor
->uri ?>" class="flex items-baseline hover:underline" <?= $post

View File

@ -1,6 +1,6 @@
<article class="flex px-6 py-4 bg-gray-50">
<img src="<?= $reply->actor->avatar_image_url ?>" alt="<?= $reply->actor
->display_name ?>" class="w-12 h-12 mr-4 rounded-full ring-gray-50 ring-2" />
->display_name ?>" class="w-10 h-10 mr-2 rounded-full ring-gray-50 ring-2" />
<div class="flex flex-col flex-1 min-w-0">
<header class="flex items-center mb-2">
<a href="<?= $reply->actor

View File

@ -7,7 +7,7 @@
<div class="flex flex-col mb-2">
<div class="flex items-center">
<span class="inline-flex items-center justify-center w-12 h-12 mr-2 text-sm font-semibold tracking-wider border-4 rounded-full text-pine-700 border-pine-700">3/4</span>
<span class="inline-flex items-center justify-center w-12 h-12 mr-2 text-sm font-semibold tracking-wider border-4 rounded-full text-pine-500 border-pine-500">3/4</span>
<Heading tagName="h1"><?= lang('Install.form.cache_config') ?></h1>
</div>

View File

@ -6,7 +6,7 @@
<?= csrf_field() ?>
<div class="flex items-center mb-2">
<span class="inline-flex items-center justify-center w-12 h-12 mr-2 text-sm font-semibold tracking-wider border-4 rounded-full text-pine-700 border-pine-700">4/4</span>
<span class="inline-flex items-center justify-center w-12 h-12 mr-2 text-sm font-semibold tracking-wider border-4 rounded-full text-pine-500 border-pine-500">4/4</span>
<Heading tagName="h1"><?= lang('Install.form.create_superadmin') ?></Heading>
</div>

View File

@ -7,7 +7,7 @@
<div class="flex flex-col mb-2">
<div class="flex items-center">
<span class="inline-flex items-center justify-center w-12 h-12 mr-2 text-sm font-semibold tracking-wider border-4 rounded-full text-pine-700 border-pine-700">2/4</span>
<span class="inline-flex items-center justify-center w-12 h-12 mr-2 text-sm font-semibold tracking-wider border-4 rounded-full text-pine-500 border-pine-500">2/4</span>
<Heading tagName="h1"><?= lang(
'Install.form.database_config',
) ?></Heading>

View File

@ -5,8 +5,8 @@
<form action="<?= '/' . config('Install')->gateway . '/instance-config' ?>" class="flex flex-col w-full max-w-sm gap-y-4" method="post" accept-charset="utf-8">
<?= csrf_field() ?>
<div class="flex items-center mb-4">
<span class="inline-flex items-center justify-center w-12 h-12 mr-2 text-sm font-semibold tracking-wider border-4 rounded-full text-pine-700 border-pine-700">1/4</span>
<div class="flex items-center mb-2">
<span class="inline-flex items-center justify-center w-12 h-12 mr-2 text-sm font-semibold tracking-wider border-4 rounded-full text-pine-500 border-pine-500">1/4</span>
<Heading tagName="h1"><?= lang('Install.form.instance_config') ?></Heading>
</div>