Pagination page number working without fancybox hash

Also legal update
This commit is contained in:
Théo Marchal 2021-02-14 01:55:42 +01:00
parent 649be52829
commit 3469704e1b
3 changed files with 18 additions and 11 deletions

View File

@ -18,6 +18,7 @@ Tools used:
* [jQuery](https://jquery.com/)
* [fancybox 3](https://fancyapps.com/fancybox/3/)
* [Chart.js](https://www.chartjs.org/)
* [Pagination.js](https://pagination.js.org/)
Fonts used:
* [Rubik](https://github.com/googlefonts/Rubik)

View File

@ -54,7 +54,7 @@
<p>Cette page regroupe diverses photos et informations&#8239;: une vue de l'atelier que Ginou utilisait ses dernières années, des photos d'exposition, des coupures de presse, ainsi que des statistiques intéressante (on peut remarquer que le printemps l'inspirait&#8239;!). N'hésitez pas à nous contacter si vous avez du contenu intéressant, notamment pour les coupures de presse.</p>
<h2>Informations technique</h2>
<p>Ce site a été développé à l'aide de la librairie <a href="https://jquery.com/">jQuery</a>, ainsi que du plugin <a href="https://fancyapps.com/fancybox/3/">fancybox 3</a> et <a href="https://www.chartjs.org/">Chart.js</a>. Les polices de caractères utilisées sont <a href="https://github.com/googlefonts/Rubik">Rubik</a>, <a href="https://github.com/kosbarts/Commissioner">Commissioner</a> et <a href="https://www.1001fonts.com/hot-august-night-font.html">Hot August Night</a>. Emoji "tableau" par <a href="https://openmoji.org/">OpenMoji</a>.</p>
<p>Ce site a été développé à l'aide de la librairie <a href="https://jquery.com/">jQuery</a>, ainsi que des plugins <a href="https://fancyapps.com/fancybox/3/">fancybox 3</a>, <a href="https://www.chartjs.org/">Chart.js</a> et <a href="https://pagination.js.org/">Pagination.js</a>. Les polices de caractères utilisées sont <a href="https://github.com/googlefonts/Rubik">Rubik</a>, <a href="https://github.com/kosbarts/Commissioner">Commissioner</a> et <a href="https://www.1001fonts.com/hot-august-night-font.html">Hot August Night</a>. Emoji "tableau" par <a href="https://openmoji.org/">OpenMoji</a>.</p>
<p>Le code source est librement disponible <em>via git</em> en <a href="https://git.n700.ovh/keb/ginou">cliquant ici</a>. Cela signifie qu'il est possible d'obtenir le site en local pour son utilisation personnelle, moyennant quelques connaissances techniques.</p>

View File

@ -2,6 +2,7 @@ jQuery(document).ready(function($)
{
$.getJSON("data.json", function(data)
{
var pageSize = 14;
var paintingList = [];
canDisplay = true;
@ -10,7 +11,7 @@ jQuery(document).ready(function($)
if (i.photo == "ok" || i.photo == "good")
{
paintingList.push(i.number);
if (paintingList.length % (14 + 1) == 0)
if (paintingList.length % (pageSize + 1) == 0)
canDisplay = false;
paintingHtml = '<div class="gallery-item ';
@ -32,22 +33,24 @@ jQuery(document).ready(function($)
}
}
/*var targetPage = 0;
var targetPage = 0;
urlParams = new URLSearchParams(window.location.search);
if (urlParams.get('page') != "")
targetPage = urlParams.get('page');*/
targetPage = urlParams.get('page');
var previousArray = []
var options =
{
dataSource: paintingList,
pageSize: 14,
//pageRange: null,
pageSize: pageSize,
pageRange: null,
className: 'paginationjs-theme-blue',
callback: function (response, pagination)
{
//window.history.pushState('', '', '/exposition-pagination.html?page=' + pagination.pageNumber); // careful, back button is broken with that
//window.console && console.log(response, pagination);
{
console.log(window.location.pathname);
console.log(window.location.hash);
window.history.replaceState('', '', window.location.pathname + '?page=' + pagination.pageNumber + window.location.hash); // careful, back button is broken with that
if (previousArray.length > 0)
{
@ -67,8 +70,8 @@ jQuery(document).ready(function($)
$('#pagination').pagination(options);
/*if (targetPage > 0)
$("#pagination").pagination('go', targetPage);*/
if (targetPage > 0)
$("#pagination").pagination('go', targetPage);
$('[data-fancybox="exposition"]').fancybox(
@ -84,6 +87,7 @@ jQuery(document).ready(function($)
mobile: {
preventCaptionOverlap: true,
},
hash: false,
caption: function(instance, item)
{
@ -122,6 +126,8 @@ jQuery(document).ready(function($)
$('#pagination').pagination('previous');
},
});
});
});