|
|
|
|
@ -13,135 +13,8 @@
@@ -13,135 +13,8 @@
|
|
|
|
|
{% set isEmbed = true %} |
|
|
|
|
{% endif %} |
|
|
|
|
|
|
|
|
|
{# Content warning #} |
|
|
|
|
{% set contentWarning = null %} |
|
|
|
|
{% for tag in event.tags %} |
|
|
|
|
{% if tag[0] == 'content-warning' %} |
|
|
|
|
{% set contentWarning = tag[1] %} |
|
|
|
|
{% endif %} |
|
|
|
|
{% endfor %} |
|
|
|
|
|
|
|
|
|
{% if contentWarning %} |
|
|
|
|
<div class="content-warning"> |
|
|
|
|
<strong>⚠️ Content Warning:</strong> {{ contentWarning }} |
|
|
|
|
<button class="btn-show-nsfw" onclick="this.parentElement.nextElementSibling.classList.remove('hidden'); this.parentElement.style.display='none';">Show Content</button> |
|
|
|
|
</div> |
|
|
|
|
<div class="picture-gallery hidden"> |
|
|
|
|
{% else %} |
|
|
|
|
<div class="picture-gallery"> |
|
|
|
|
{% endif %} |
|
|
|
|
|
|
|
|
|
{# Collect all imeta images into an array #} |
|
|
|
|
{% set images = [] %} |
|
|
|
|
{% for tag in event.tags %} |
|
|
|
|
{% if tag[0] == 'imeta' %} |
|
|
|
|
{% set imageUrl = null %} |
|
|
|
|
{% set mimeType = null %} |
|
|
|
|
{% set blurhash = null %} |
|
|
|
|
{% set dimensions = null %} |
|
|
|
|
{% set altText = null %} |
|
|
|
|
{% set fallbacks = [] %} |
|
|
|
|
{% set annotatedUsers = [] %} |
|
|
|
|
{# Parse imeta tag parameters #} |
|
|
|
|
{% for i in 1..(tag|length - 1) %} |
|
|
|
|
{% set param = tag[i] %} |
|
|
|
|
{% if param starts with 'url ' %} |
|
|
|
|
{% set imageUrl = param[4:] %} |
|
|
|
|
{% elseif param starts with 'm ' %} |
|
|
|
|
{% set mimeType = param[2:] %} |
|
|
|
|
{% elseif param starts with 'blurhash ' %} |
|
|
|
|
{% set blurhash = param[9:] %} |
|
|
|
|
{% elseif param starts with 'dim ' %} |
|
|
|
|
{% set dimensions = param[4:] %} |
|
|
|
|
{% elseif param starts with 'alt ' %} |
|
|
|
|
{% set altText = param[4:] %} |
|
|
|
|
{% elseif param starts with 'fallback ' %} |
|
|
|
|
{% set fallbacks = fallbacks|merge([param[9:]]) %} |
|
|
|
|
{% elseif param starts with 'annotate-user ' %} |
|
|
|
|
{% set annotatedUsers = annotatedUsers|merge([param[14:]]) %} |
|
|
|
|
{% endif %} |
|
|
|
|
{% endfor %} |
|
|
|
|
{# Alt is also own tag #} |
|
|
|
|
{% for altTag in event.tags %} |
|
|
|
|
{% if altTag[0] == 'alt' %} |
|
|
|
|
{% set altText = altTag[1] %} |
|
|
|
|
{% endif %} |
|
|
|
|
{% endfor %} |
|
|
|
|
{% set images = images|merge([{ |
|
|
|
|
'url': imageUrl, |
|
|
|
|
'mimeType': mimeType, |
|
|
|
|
'blurhash': blurhash, |
|
|
|
|
'dimensions': dimensions, |
|
|
|
|
'altText': altText, |
|
|
|
|
'fallbacks': fallbacks, |
|
|
|
|
'annotatedUsers': annotatedUsers |
|
|
|
|
}]) %} |
|
|
|
|
{% endif %} |
|
|
|
|
{% endfor %} |
|
|
|
|
|
|
|
|
|
{% if images|length > 0 %} |
|
|
|
|
<div class="gallery-view" data-controller="gallery"> |
|
|
|
|
<div class="main-image-wrapper"> |
|
|
|
|
{% set main = images[0] %} |
|
|
|
|
<figure class="media"> |
|
|
|
|
{% if isEmbed %} |
|
|
|
|
<a href="{{ path('nevent', {nevent: event.id|nEncode }) }}" aria-label="View standalone"> |
|
|
|
|
{% endif %} |
|
|
|
|
<picture> |
|
|
|
|
<img src="{{ main.url }}" |
|
|
|
|
alt="{{ main.altText|default('Picture') }}" |
|
|
|
|
{% if main.dimensions %}data-dimensions="{{ main.dimensions }}"{% endif %} |
|
|
|
|
{% if main.blurhash %}data-blurhash="{{ main.blurhash }}"{% endif %} |
|
|
|
|
class="picture-image main-image" |
|
|
|
|
data-gallery-target="mainImage" |
|
|
|
|
/> |
|
|
|
|
{% for fallback in main.fallbacks %} |
|
|
|
|
<source srcset="{{ fallback }}" /> |
|
|
|
|
{% endfor %} |
|
|
|
|
</picture> |
|
|
|
|
|
|
|
|
|
{% if images|length > 1 %} |
|
|
|
|
<div class="thumbnails" data-gallery-target="thumbnails"> |
|
|
|
|
{% for img in images %} |
|
|
|
|
<img src="{{ img.url }}" |
|
|
|
|
alt="{{ img.altText|default('Picture') }}" |
|
|
|
|
class="thumbnail{% if loop.first %} selected{% endif %}" |
|
|
|
|
data-gallery-target="thumbnail" |
|
|
|
|
data-action="click->gallery#switch" |
|
|
|
|
data-gallery-index="{{ loop.index0 }}" |
|
|
|
|
{% if img.dimensions %}data-dimensions="{{ img.dimensions }}"{% endif %} |
|
|
|
|
{% if img.blurhash %}data-blurhash="{{ img.blurhash }}"{% endif %} |
|
|
|
|
/> |
|
|
|
|
{% endfor %} |
|
|
|
|
</div> |
|
|
|
|
{% endif %} |
|
|
|
|
|
|
|
|
|
{% if isEmbed %} |
|
|
|
|
</a> |
|
|
|
|
{% endif %} |
|
|
|
|
<figcaption class="picture-description"> |
|
|
|
|
<twig:Atoms:Content :content="event.content" /> |
|
|
|
|
{% if isEmbed %} |
|
|
|
|
<span class="credits">Image by <twig:Molecules:UserFromNpub :ident="event.pubkey" class="credits" /></span> |
|
|
|
|
{% endif %} |
|
|
|
|
</figcaption> |
|
|
|
|
</figure> |
|
|
|
|
{# Display annotated users for main image #} |
|
|
|
|
{% if main.annotatedUsers|length > 0 %} |
|
|
|
|
<div class="annotated-users"> |
|
|
|
|
{% for userAnnotation in main.annotatedUsers %} |
|
|
|
|
{% set parts = userAnnotation|split(':') %} |
|
|
|
|
{% if parts|length == 3 %} |
|
|
|
|
<div class="user-tag" data-left="{{ parts[1] }}" data-top="{{ parts[2] }}" style="left: {{ parts[1] }}%; top: {{ parts[2] }}%;"> |
|
|
|
|
<twig:Molecules:UserFromNpub ident="{{ parts[0] }}" /> |
|
|
|
|
</div> |
|
|
|
|
{% endif %} |
|
|
|
|
{% endfor %} |
|
|
|
|
</div> |
|
|
|
|
{% endif %} |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
{% endif %} |
|
|
|
|
{% include 'partial/_gallery.html.twig' with {event: event, isEmbed: isEmbed} %} |
|
|
|
|
|
|
|
|
|
{# Location data #} |
|
|
|
|
{% set location = null %} |
|
|
|
|
|
Nuša Pukšič
3 months ago