{% extends "base.html.twig" %}
{% block pageTitle %} {{ opera.titolo }} {% endblock %}
{% block pageStyle %}
{{ parent() }}
<link rel="stylesheet" href="{{ asset('js/tobii/tobii.min.css') }}">
{% endblock %}
{% block pageScriptsHeader %}
{{ parent() }}
<script src="{{ asset('js/tobii/tobii.min.js') }}"></script>
<script>
document.addEventListener('DOMContentLoaded', function() {
const tobii = new Tobii({
zoomText: '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="#fff" d="m15.5 14l5 5l-1.5 1.5l-5-5v-.79l-.27-.28A6.47 6.47 0 0 1 9.5 16A6.5 6.5 0 0 1 3 9.5A6.5 6.5 0 0 1 9.5 3A6.5 6.5 0 0 1 16 9.5c0 1.61-.59 3.09-1.57 4.23l.28.27zm-6 0C12 14 14 12 14 9.5S12 5 9.5 5S5 7 5 9.5S7 14 9.5 14m2.5-4h-2v2H9v-2H7V9h2V7h1v2h2z"/></svg>'
});
});
</script>
{% endblock %}
{% block navigation %} {{ parent() }} {% endblock %}
{% block upperMainContainer %}
{% endblock %}
{% set splideConfiguration = {
"perPage": 1,
"perMove": 1,
"type": "loop",
"gap": "3rem",
"focus": "center",
"padding": {
"right": "0px"
},
"mediaQuery": "min",
"breakpoints": {
"768": {
"perPage": 2,
"perMove": 1,
"gap": "3rem",
"focus": "center",
},
"992": {
"perPage": 3,
"perMove": 1,
"gap": "3rem",
"focus": "center",
}
}
} %}
{% block mainContainer %}
<section id="opera">
<div class="container">
<div class="d-grid grid-opera">
<nav class="grid-col">
<ul>
<li><a href="{{ app.request.headers.get('referer') }}"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><path fill="#B8293D" d="M31.884 8.366a1.25 1.25 0 0 1 0 1.768L18.018 24l13.866 13.866a1.25 1.25 0 0 1-1.768 1.768l-14.75-14.75a1.25 1.25 0 0 1 0-1.768l14.75-14.75a1.25 1.25 0 0 1 1.768 0"/></svg> Torna indietro</a></li>
{% if app.user and is_granted('IS_AUTHENTICATED_FULLY') %}
<li><a href="{{ path("adminModifyOpera", {"idopera": opera.id}) }}">Modifica opera</a></li>
{% endif %}
</ul>
</nav>
<div class="grid-col">
<h1>{{ opera.titolo }}, {{ opera.anno }}</h1>
</div>
</div>
<div class="d-grid grid-opera">
<div class="grid-col">
{% if opera.visibile or app.user %}
<div class="my-gallery" itemscope itemtype="https://schema.org/ImageGallery">
{% if not cover_presence %}
{% for m in opera.multimedias | slice(0, 1) %}
<figure itemprop="associatedMedia" itemscope itemtype="https://schema.org/ImageObject">
<a href="{{ asset(uploaded_img_big ~ m.multimedia.fileref ~ '.' ~ m.multimedia.estensione) }}" itemprop="contentUrl" data-size="{{ m.multimedia.widthbig }}x{{ m.multimedia.heightbig }}" class="lightbox">
<img src="{{ asset(uploaded_img_normal ~ m.multimedia.fileref ~ '.' ~ m.multimedia.estensione) }}" alt="{{ m.multimedia.nome }}">
</a>
</figure>
{% endfor %}
{% else %}
{% for m in opera.multimedias %}
{% if m.cover %}
<figure itemprop="associatedMedia" itemscope itemtype="https://schema.org/ImageObject">
<a href="{{ asset(uploaded_img_big ~ m.multimedia.fileref ~ '.' ~ m.multimedia.estensione) }}" itemprop="contentUrl" data-size="{{ m.multimedia.widthbig }}x{{ m.multimedia.heightbig }}" class="lightbox">
<img src="{{ asset(uploaded_img_normal ~ m.multimedia.fileref ~ '.' ~ m.multimedia.estensione) }}" alt="{{ m.multimedia.nome }}">
</a>
</figure>
{% endif %}
{% endfor %}
{% endif %}
</div>
{% endif %}
</div>
<div class="grid-col">
{% if opera.visibile or app.user %}
<div class="dati">
{% if opera.materiale != '' %}
<div>
<strong>Materiale</strong>
<span>{{ opera.materiale }}</span>
</div>
{% endif %}
{% if opera.tecnica != '' %}
<div>
<strong>Tecnica</strong>
<span>{{ opera.tecnica }}</span>
</div>
{% endif %}
{% if opera.x != '' or opera.y != '' or opera.z != '' %}
<div>
<strong>Misure (cm)</strong>
<span>
{% if opera.x %}L: {{ opera.x }}{% endif %}
{% if opera.y %}A: {{ opera.y }}{% endif %}
{% if opera.z %}P: {{ opera.z }}{% endif %}
</span>
</div>
{% endif %}
{% if opera.collezione != '' %}
<div>
<strong>Collezione</strong>
<span>{{ opera.collezione }}</span>
</div>
{% endif %}
{% if opera.numprogressivoanno != '' %}
<div>
<strong>Numero progressivo</strong>
<span>{{ opera.numprogressivoanno }}</span>
</div>
{% endif %}
</div>
<div class="accordion" id="accordion-caratteristiche">
{% if opera.note | length > 0 %}
<div class="accordion-item">
<h2 class="accordion-header " id="heading1c">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapse1c" aria-expanded="false" aria-controls="collapse1c">
Note
</button>
</h2>
<div id="collapse1c" class="accordion-collapse collapse" role="region" aria-labelledby="heading1c">
<div class="accordion-body">
{{ opera.note }}
</div>
</div>
</div>
{% endif %}
{% if opera.getLinkVideo() %}
<div class="accordion-item">
<h2 class="accordion-header " id="heading2c">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapse2c" aria-expanded="false" aria-controls="collapse2c">
Video
</button>
</h2>
<div id="collapse2c" class="accordion-collapse collapse" role="region" aria-labelledby="heading2c">
<div class="accordion-body">
<div class="opera-video">
<video src="{{ opera.getLinkVideo() }}" autoplay muted loop controls width="480" height="480"></video>
</div>
</div>
</div>
</div>
{% endif %}
{# {% if opera.multimedias | length > 2 %}
<div class="accordion-item">
<h2 class="accordion-header " id="heading3c">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapse3c" aria-expanded="false" aria-controls="collapse3c">
Immagini
</button>
</h2>
<div id="collapse3c" class="accordion-collapse collapse" role="region" aria-labelledby="heading3c">
<div class="accordion-body">
<div class="my-gallery" itemscope itemtype="https://schema.org/ImageGallery">
{% if opera.multimedias | length > 4 %}
<div class="it-carousel-wrapper splide it-carousel-landscape-abstract-three-cols-arrow-visible" data-bs-carousel-splide data-splide="{{ splideConfiguration|json_encode }}">
<div class="splide__track p-0">
{% endif %}
<ul class="{% if opera.multimedias | length > 4 %}splide__list it-carousel-all{% else %}no-carousel{% endif %}">
{% if not cover_presence %}
{% for m in opera.multimedias | slice(1, 30) %}
<li class="{% if opera.multimedias | length > 4 %}splide__slide{% else %}no-carousel{% endif %}">
<figure itemprop="associatedMedia" itemscope itemtype="https://schema.org/ImageObject">
<a href="{{ asset(uploaded_img_big ~ m.multimedia.fileref ~ '.' ~ m.multimedia.estensione) }}" itemprop="contentUrl" data-size="{{ m.multimedia.widthbig }}x{{ m.multimedia.heightbig }}" class="lightbox">
<img src="{{ asset(uploaded_img_normal ~ m.multimedia.fileref ~ '.' ~ m.multimedia.estensione) }}" alt="{{ m.multimedia.nome }}">
</a>
</figure>
</li>
{% endfor %}
{% else %}
{% for m in opera.multimedias %}
{% if not m.cover %}
<li class="{% if opera.multimedias | length > 4 %}splide__slide{% else %}no-carousel{% endif %}">
<figure itemprop="associatedMedia" itemscope itemtype="https://schema.org/ImageObject">
<a href="{{ asset(uploaded_img_big ~ m.multimedia.fileref ~ '.' ~ m.multimedia.estensione) }}" itemprop="contentUrl" data-size="{{ m.multimedia.widthbig }}x{{ m.multimedia.heightbig }}" class="lightbox">
<img src="{{ asset(uploaded_img_normal ~ m.multimedia.fileref ~ '.' ~ m.multimedia.estensione) }}" alt="{{ m.multimedia.nome }}">
</a>
</figure>
</li>
{% endif %}
{% endfor %}
{% endif %}
</ul>
{% if opera.multimedias | length > 4 %}
</div>
</div>
{% endif %}
</div>
</div>
</div>
</div>
{% endif %} #}
{% if opera.connectedOperas | length > 0 %}
<div class="accordion-item">
<h2 class="accordion-header " id="heading4c">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapse4c" aria-expanded="false" aria-controls="collapse4c">
Opere connesse
</button>
</h2>
<div id="collapse4c" class="accordion-collapse collapse" role="region" aria-labelledby="heading4c">
<div class="accordion-body">
<div class="opere-connesse">
<ul class="d-grid">
{% for connectedOpera in opera.connectedOperas%}
<li>
<figure>
{% set cover_presence = false %}
{% for m in connectedOpera.multimedias %}
{% if m.multimedia.tipo == "image" and m.cover %}
{% set cover_presence = true %}
{% endif %}
{% endfor %}
{% if not cover_presence %}
{% set cc = 0 %}
{% for m in connectedOpera.multimedias %}
{% if m.multimedia.tipo == "image" and cc < 1 %}
{% set cc = 1 %}
<a href="{{ asset(uploaded_img_normal ~ m.multimedia.fileref ~ '.' ~ m.multimedia.estensione) }}" class="lightbox">
<img src="{{ asset(uploaded_img_normal ~ m.multimedia.fileref ~ '.' ~ m.multimedia.estensione) }}" alt="{{ m.multimedia.nome }}">
</a>
<figcaption>
<a href="{{ path("archivio-opere-scheda", {"idopera": connectedOpera.id}) }}">{{ connectedOpera.titolo | replace({"<": "(", ">": ")"}) }}</a>
</figcaption>
{% endif %}
{% endfor %}
{% else %}
{% for m in connectedOpera.multimedias %}
{% if m.multimedia.tipo == "image" and m.cover %}
<a href="{{ asset(uploaded_img_normal ~ m.multimedia.fileref ~ '.' ~ m.multimedia.estensione) }}" class="lightbox">
<img src="{{ asset(uploaded_img_normal ~ m.multimedia.fileref ~ '.' ~ m.multimedia.estensione) }}" alt="{{ m.multimedia.nome }}">
</a>
<figcaption>
<a href="{{ path("archivio-opere-scheda", {"idopera": connectedOpera.id}) }}">{{ connectedOpera.titolo | replace({"<": "(", ">": ")"}) }}</a>
</figcaption>
{% endif %}
{% endfor %}
{% endif %}
</figure>
</li>
{% endfor %}
</ul>
</div>
</div>
</div>
</div>
{% endif %}
{% if opera.idmostra is defined and opera.idmostra | length > 0 %}
<div class="accordion-item">
<h2 class="accordion-header " id="heading5c">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapse5c" aria-expanded="false" aria-controls="collapse5c">
Esposizioni
</button>
</h2>
<div id="collapse5c" class="accordion-collapse collapse" role="region" aria-labelledby="heading5c">
<div class="accordion-body">
<div class="opera-esposizioni">
<ul>
{% for mostra in opera.idmostra %}
<li>
<a href="{{ path('allestimentoMostra', {'idmostra': mostra.id}) }}">{{ mostra.nome }}</a>
</li>
{% endfor %}
</ul>
</div>
</div>
</div>
</div>
{% endif %}
{% if pubblicazioni | length > 0 %}
<div class="accordion-item">
<h2 class="accordion-header " id="heading6c">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapse6c" aria-expanded="false" aria-controls="collapse6c">
Pubblicazioni
</button>
</h2>
<div id="collapse6c" class="accordion-collapse collapse" role="region" aria-labelledby="heading6c">
<div class="accordion-body">
<div class="opera-pubblicazioni">
<ul>
{% for documento in pubblicazioni|sort((a, b) => a.anno <=> b.anno) %}
<li>
<p class="mt-0 mb-0">
<a href="{{ path('documentoMonografieCataloghi', {'iddocumento': documento.id}) }}">
{{ documento.titolo }}
</a>
{% if documento.getAutore() %} di {{ documento.getAutore() }}
{% endif %}
</p>
<p class="mt-0 mb-0">
{% if documento.getLuogo() is defined and documento.getLuogo() is not empty %}
{{ documento.getLuogo() }} -
{% endif %}
({{ documento.getAnno() }})
{% if documento.file is defined and documento.file is not empty %}
<a href="{{ asset(uploaded_documents ~ documento.file.fileref|replace({'-':''}) ~ '.' ~ documento.file.estensione) }}">
PDF
</a>
{% endif %}
</p>
</li>
{% endfor %}
</ul>
</div>
</div>
</div>
</div>
{% endif %}
{% if giornali | length > 0 %}
<div class="accordion-item">
<h2 class="accordion-header " id="heading7c">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapse7c" aria-expanded="false" aria-controls="collapse7c">
Giornali
</button>
</h2>
<div id="collapse7c" class="accordion-collapse collapse" role="region" aria-labelledby="heading7c">
<div class="accordion-body">
<div class="opera-giornali">
<ul>
{% for giornale in giornali|sort((a, b) => a.anno <=> b.anno) %}
<li class="bibliografia-item giornale">
{% if giornale.getAutore() is not empty and giornale.getTitolo() is not empty %}
<p class="mt-0 mb-0">
{% if giornale.getAutore() is not empty %}
{{ giornale.getAutore() }}
{% endif %}
{% if giornale.getAutore() is not empty and giornale.getTitolo() is not empty %}
-
{% endif %}
{% if giornale.getTitolo() is not empty %}
{{ giornale.getTitolo() }}
{% endif %}
</p>
{% endif %}
<p class="mt-0 mb-0">
{% if giornale.getIdgiornale() is defined and giornale.getIdgiornale().getNome() is not empty %}
{{ giornale.getIdgiornale().getNome() }} -
{% endif %}
{% if giornale.getPagina() is not empty %}
pag. {{ giornale.getPagina() }}
{% endif %}
({{ giornale.getGiorno() }}-{{ giornale.getMese() }}-{{ giornale.getAnno() }})
{% if giornale.multimediafiles is not empty %}
{% for multimedia in giornale.multimediafiles | slice(0, 1) %}
- <a href="{{ asset(uploaded_img_big ~ multimedia.fileref ~ '.' ~ multimedia.estensione) }}" itemprop="contentUrl" data-size="{{ multimedia.widthbig }}x{{ multimedia.heightbig }}">IMG</a>
{% endfor %}
{% endif %}
</p>
</li>
{% endfor %}
</ul>
</div>
</div>
</div>
</div>
{% endif %}
</div>
{% else %}
<div class="alert alert-light text-center" role="alert">
Siamo spiacenti, questa opera non รจ visibile al pubblico.
</div>
{% endif %}
</div>
</div>
</div>
</section>
{% endblock %}