m038
512f1ce9b2
Two new shortcodes for immersive storytelling: - [full-bleed image="" caption="" credit=""] — viewport-wide image, max 80vh - [image-caption image="" caption="" credit="" width="column|full|bleed"] — photo at configurable width with caption Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01WPJztrVGbwic2xTG7G9fjM
35 lines
1.3 KiB
PHP
35 lines
1.3 KiB
PHP
<?php
|
|
namespace Grav\Plugin\Shortcodes;
|
|
|
|
use Thunder\Shortcode\Shortcode\ShortcodeInterface;
|
|
|
|
class FullBleedShortcode extends Shortcode
|
|
{
|
|
public function init(): void
|
|
{
|
|
$this->shortcode->getHandlers()->add('full-bleed', function (ShortcodeInterface $sc) {
|
|
$plugin = $this->grav['plugins']->getPlugin('story-blocks');
|
|
$page = $plugin ? $plugin->getCurrentPage() : null;
|
|
|
|
$imageName = htmlspecialchars($sc->getParameter('image', ''), ENT_QUOTES);
|
|
$alt = htmlspecialchars($sc->getParameter('alt', ''), ENT_QUOTES);
|
|
$caption = htmlspecialchars($sc->getParameter('caption', ''), ENT_QUOTES);
|
|
$credit = htmlspecialchars($sc->getParameter('credit', ''), ENT_QUOTES);
|
|
$imageUrl = ($page && $imageName) ? $page->url() . '/' . $imageName : $imageName;
|
|
|
|
$captionHtml = '';
|
|
if ($caption || $credit) {
|
|
$creditHtml = $credit ? '<span class="full-bleed__credit"> · ' . $credit . '</span>' : '';
|
|
$captionHtml = '<figcaption class="full-bleed__caption">' . $caption . $creditHtml . '</figcaption>';
|
|
}
|
|
|
|
return <<<HTML
|
|
<figure class="full-bleed">
|
|
<img src="{$imageUrl}" alt="{$alt}" class="full-bleed__img" loading="lazy">
|
|
{$captionHtml}
|
|
</figure>
|
|
HTML;
|
|
});
|
|
}
|
|
}
|