mirror of
https://github.com/spiral-project/ihatemoney.git
synced 2025-05-15 17:01:49 +02:00
Alexis Métaireau
df7eb6b253
- Put the images in a language folder ("en", "fr"), which will make it
easier to add orther languages later on.
- Resize the images to fit the already existing ones.
- Add a `display_showcase` parameter to the
`list_bills` and `home` views.
75 lines
3.2 KiB
HTML
75 lines
3.2 KiB
HTML
<div id="pswp"
|
|
class="hiddenpswp"
|
|
tabindex="-1"
|
|
role="dialog"
|
|
aria-hidden="true">
|
|
<div class="pswp__bg"></div>
|
|
<div class="pswp__scroll-wrap">
|
|
<div class="pswp__container">
|
|
<div class="pswp__item"></div>
|
|
<div class="pswp__item"></div>
|
|
<div class="pswp__item"></div>
|
|
</div>
|
|
<div class="pswp__ui pswp__ui--hidden">
|
|
<div class="pswp__top-bar">
|
|
<div class="pswp__counter"></div>
|
|
<button class="pswp__button pswp__button--close" title="Fermer (Esc)"></button>
|
|
<div class="pswp__preloader">
|
|
<div class="pswp__preloader__icn">
|
|
<div class="pswp__preloader__cut">
|
|
<div class="pswp__preloader__donut"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<button class="pswp__button pswp__button--arrow--left"
|
|
title="Suivant (flèche droite)"></button>
|
|
<button class="pswp__button pswp__button--arrow--right"
|
|
title="Précédent (flèche gauche)"></button>
|
|
<div class="pswp__caption">
|
|
<div class="pswp__caption__center"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<script type="text/javascript">
|
|
var pswpElement = document.getElementById("pswp");
|
|
var options = {
|
|
index: 0,
|
|
loop: false,
|
|
};
|
|
|
|
function showGallery(){
|
|
let items = [
|
|
{"h": 2450, "src": "{{ url_for('static', filename='showcase/' + g.lang + '/1.webp') }}", "w": 2450},
|
|
{"h": 2509, "src": "{{ url_for('static', filename='showcase/' + g.lang + '/2.webp') }}", "w": 2221},
|
|
{"h": 2536, "src": "{{ url_for('static', filename='showcase/' + g.lang + '/3.webp') }}", "w": 2101},
|
|
{"h": 2722, "src": "{{ url_for('static', filename='showcase/' + g.lang + '/4.webp') }}", "w": 2348},
|
|
{"h": 2745, "src": "{{ url_for('static', filename='showcase/' + g.lang + '/5.webp') }}", "w": 1804},
|
|
{"h": 3307, "src": "{{ url_for('static', filename='showcase/' + g.lang + '/6.webp') }}", "w": 2897},
|
|
{"h": 2321, "src": "{{ url_for('static', filename='showcase/' + g.lang + '/7.webp') }}", "w": 2239},
|
|
{"h": 2470, "src": "{{ url_for('static', filename='showcase/' + g.lang + '/8.webp') }}", "w": 2419},
|
|
{"h": 3307, "src": "{{ url_for('static', filename='showcase/' + g.lang + '/9.webp') }}", "w": 2602}
|
|
];
|
|
|
|
// CSS and JS are loaded dynamically when the gallery opens
|
|
$('head').append('<link rel="stylesheet" type="text/css" href="{{ url_for("static", filename="photoswipe/default-skin/default-skin.css") }}">');
|
|
$('head').append('<link rel="stylesheet" type="text/css" href="{{ url_for("static", filename="photoswipe/photoswipe.css") }}">');
|
|
|
|
var script = document.createElement("script");
|
|
script.type = "text/javascript";
|
|
script.src = "{{ url_for('static', filename='photoswipe/photoswipe.min.js')}}";
|
|
script.onload = function(){
|
|
var script2 = document.createElement("script");
|
|
script2.type = "text/javascript";
|
|
script2.src = "{{ url_for('static', filename='photoswipe/photoswipe-ui-default.min.js')}}";
|
|
script2.onload = function(){
|
|
pswpElement.className="pswp";
|
|
var gallery = new PhotoSwipe(pswpElement, PhotoSwipeUI_Default, items, options);
|
|
gallery.init();
|
|
};
|
|
document.body.appendChild(script2);
|
|
};
|
|
document.body.appendChild(script);
|
|
}
|
|
</script>
|