templates: display thumbnail of attached images, open overlay popup on click (fixes #24566)
This commit is contained in:
parent
10c8b89070
commit
019dfbd590
|
@ -20,12 +20,43 @@
|
|||
<p>Demande en cours de traitement par {{ validation_request.taken_by }} depuis le {{ validation_request.taken }}</p>
|
||||
{% endif %}
|
||||
|
||||
<script>
|
||||
$('body').on('click', 'img.popup-image', function (event) {
|
||||
var target = event.target;
|
||||
var src = target.src;
|
||||
var vw = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
|
||||
var vh = Math.max(document.documentElement.clientHeight, window.innerHeight || 0);
|
||||
var ratio_width = target.width / (vw - 100);
|
||||
var ratio_height = target.height / (vh - 100);
|
||||
var ratio = Math.max(ratio_width, ratio_height);
|
||||
var new_width = target.width / ratio;
|
||||
var new_height = target.height / ratio;
|
||||
var $overlay = $('<img src="' + src +'"/>');
|
||||
$overlay.css({
|
||||
'position': 'fixed',
|
||||
'height': '' + new_height + 'px',
|
||||
'width': '' + new_width + 'px',
|
||||
'top': 0,
|
||||
'left': 0,
|
||||
'padding-left': ((vw - new_width) / 2) + 'px',
|
||||
'padding-right': ((vw - new_width) / 2) + 'px',
|
||||
'padding-top': ((vh - new_height) / 2) + 'px',
|
||||
'padding-bottom': ((vh - new_height) / 2) + 'px',
|
||||
'z-index': 999,
|
||||
})
|
||||
|
||||
$overlay.appendTo($('body'));
|
||||
$overlay.on('click', function () {
|
||||
$overlay.remove();
|
||||
});
|
||||
})
|
||||
</script>
|
||||
<div>
|
||||
{% if attachment_urls %}
|
||||
<h4>Pièces jointes</h4>
|
||||
<ul>
|
||||
<p>
|
||||
{% for attachment_url in attachment_urls %}
|
||||
<li><a target="_blank" href="{{ attachment_url }}">Pièce jointe {{ forloop.counter }}</a></li>
|
||||
<img class="popup-image" src="{{ attachment_url }}" tile="Pièce jointe {{ forloop.counter }}" style="max-height: 20vmin; border: 1px solid black; padding: 1ex"/>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
|
|
Loading…
Reference in New Issue