Compare commits
27 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| e6761ec734 | |||
| fccbc08b31 | |||
| 5201c1d772 | |||
| abffc172ba | |||
| 6480eee97c | |||
| a2ec68d02e | |||
| 9ca53a4176 | |||
| 302f51dcb3 | |||
| 002486725d | |||
| c7dcc688e7 | |||
| 16f6e0778a | |||
| 86bf57df0d | |||
| 31ba8358d1 | |||
| c00d966fd7 | |||
| ff2e32d2d9 | |||
| 56fd55d09d | |||
| adbd09c060 | |||
| aa3e4ffded | |||
| 67b9847587 | |||
| 8d39956724 | |||
| 5ed5aff945 | |||
| f1849eccf0 | |||
| e5d4f26fc2 | |||
| 5da19afed3 | |||
| 5540ba095d | |||
| af82dac4bc | |||
| aa693c7672 |
2
.gitmodules
vendored
2
.gitmodules
vendored
@ -1,3 +1,3 @@
|
|||||||
[submodule "photos"]
|
[submodule "photos"]
|
||||||
path = photos
|
path = photos
|
||||||
url = https://git.n700.ovh/keb/ginou-photos.git
|
url = https://git.marchal.dev/keb/ginou-photos.git
|
||||||
|
|||||||
@ -8,7 +8,7 @@
|
|||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
<link rel="shortcut icon" href="images/favicon.png">
|
<link rel="shortcut icon" href="images/favicon.png">
|
||||||
<link rel="stylesheet" href="styles/main.css" media="screen">
|
<link rel="stylesheet" href="styles/main.css" media="screen">
|
||||||
<script src="plugins/jquery-3.5.1.min.js"></script>
|
<script src="plugins/jquery-3.6.0.min.js"></script>
|
||||||
<script src="scripts/menu.js"></script>
|
<script src="scripts/menu.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
@ -35,7 +35,7 @@
|
|||||||
<h1>Biographie</h1>
|
<h1>Biographie</h1>
|
||||||
|
|
||||||
<img src="images/ginou50.jpg" class="bio-img" alt="Ginou, peignant dans les années 50">
|
<img src="images/ginou50.jpg" class="bio-img" alt="Ginou, peignant dans les années 50">
|
||||||
<p>Ginou, née Geneviève Collignon, était une artiste-peintre qui a vécu la plus grande partie de sa vie à Dugny-sur-Meuse, village de la vallée de la Meuse où elle trouvera de nombreux sujets d’inspiration.</p>
|
<p>Ginou, née Geneviève Collignon, était une artiste-peintre qui a vécu la plus grande partie de sa vie à Dugny-sur-Meuse, village de la vallée de la Meuse où elle trouvera de nombreux sujets d'inspiration.</p>
|
||||||
|
|
||||||
<p>Comme l'écrit Ginou en 2016 dans un texte sur sa jeunesse, « je suis née un jour de mars 1936 dans un petit village de la Meuse : Mouilly, le berceau des parents de mon père ». Elle a 4 ans quand la Seconde Guerre Mondiale éclate, et en garde des souvenirs très précis, même 75 ans après. Après avoir passé le certificat d'études avec succès, Geneviève apprend le métier de couturière de son père Eugène, tailleur installé dans le bas du petit village isolé dans la forêt meusienne, dans une maison sur les berges du petit ruisseau qui serpente au fond d'une vallée accrochée aux contreforts des côtes de Meuse.</p>
|
<p>Comme l'écrit Ginou en 2016 dans un texte sur sa jeunesse, « je suis née un jour de mars 1936 dans un petit village de la Meuse : Mouilly, le berceau des parents de mon père ». Elle a 4 ans quand la Seconde Guerre Mondiale éclate, et en garde des souvenirs très précis, même 75 ans après. Après avoir passé le certificat d'études avec succès, Geneviève apprend le métier de couturière de son père Eugène, tailleur installé dans le bas du petit village isolé dans la forêt meusienne, dans une maison sur les berges du petit ruisseau qui serpente au fond d'une vallée accrochée aux contreforts des côtes de Meuse.</p>
|
||||||
|
|
||||||
|
|||||||
56
divers.html
56
divers.html
@ -8,12 +8,12 @@
|
|||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
<link rel="shortcut icon" href="images/favicon.png">
|
<link rel="shortcut icon" href="images/favicon.png">
|
||||||
<link rel="stylesheet" href="styles/main.css" media="screen">
|
<link rel="stylesheet" href="styles/main.css" media="screen">
|
||||||
<script src="plugins/jquery-3.5.1.min.js"></script>
|
<link rel="stylesheet" href="styles/fancybox.css" media="screen">
|
||||||
<script src="scripts/menu.js"></script>
|
<link rel="stylesheet" href="plugins/jquery.fancybox.min.css" media="screen">
|
||||||
<link href="plugins/jquery.fancybox.min.css" rel="stylesheet">
|
<script src="plugins/jquery-3.6.0.min.js"></script>
|
||||||
<script src="plugins/jquery.fancybox.min.js"></script>
|
<script src="plugins/jquery.fancybox.min.js"></script>
|
||||||
<link href="plugins/chart.min.css" rel="stylesheet">
|
<script src="plugins/chart-3.9.1.min.js"></script>
|
||||||
<script src="plugins/chart.bundle.min.js"></script>
|
<script src="scripts/menu.js"></script>
|
||||||
<script src="scripts/divers.js"></script>
|
<script src="scripts/divers.js"></script>
|
||||||
<script src="scripts/stats.js"></script>
|
<script src="scripts/stats.js"></script>
|
||||||
</head>
|
</head>
|
||||||
@ -52,8 +52,8 @@
|
|||||||
<img src="photos/divers/mini/carnet.jpg" alt="Couverture du petit carnet qui nous a permis de lister l'intégralité des tableaux.">
|
<img src="photos/divers/mini/carnet.jpg" alt="Couverture du petit carnet qui nous a permis de lister l'intégralité des tableaux.">
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
<a data-fancybox="divers" href="photos/divers/normal/carnetpremierepage.png" data-caption="Première page du petit carnet et les premiers tableaux à l’huile de Ginou.">
|
<a data-fancybox="divers" href="photos/divers/normal/carnetpremierepage.png" data-caption="Première page du petit carnet et les premiers tableaux à l'huile de Ginou.">
|
||||||
<img src="photos/divers/mini/carnetpremierepage.jpg" alt="Première page du petit carnet et les premiers tableaux à l’huile de Ginou.">
|
<img src="photos/divers/mini/carnetpremierepage.jpg" alt="Première page du petit carnet et les premiers tableaux à l'huile de Ginou.">
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
<a data-fancybox="divers" href="photos/divers/normal/carnetpage.png" data-caption="Pages du petit carnet dans les années 2001.">
|
<a data-fancybox="divers" href="photos/divers/normal/carnetpage.png" data-caption="Pages du petit carnet dans les années 2001.">
|
||||||
@ -75,8 +75,8 @@
|
|||||||
<img src="photos/divers/mini/atelier.jpg" alt="L'atelier dans lequel Ginou peignait (vers 2012).">
|
<img src="photos/divers/mini/atelier.jpg" alt="L'atelier dans lequel Ginou peignait (vers 2012).">
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
<a data-fancybox="divers" href="photos/divers/normal/atelier2.jpg" data-caption="Trépied et tableau (nº375, Venise, le Cannareggio) dans l’atelier de Ginou (2015).">
|
<a data-fancybox="divers" href="photos/divers/normal/atelier2.jpg" data-caption="Trépied et tableau (nº375, Venise, le Cannareggio) dans l'atelier de Ginou (2015).">
|
||||||
<img src="photos/divers/mini/atelier2.jpg" alt="Trépied et tableau (nº375, Venise, le Cannareggio) dans l’atelier de Ginou (2015).">
|
<img src="photos/divers/mini/atelier2.jpg" alt="Trépied et tableau (nº375, Venise, le Cannareggio) dans l'atelier de Ginou (2015).">
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
<a data-fancybox="divers" href="photos/divers/normal/palette.jpg" data-caption="La palette de Ginou !">
|
<a data-fancybox="divers" href="photos/divers/normal/palette.jpg" data-caption="La palette de Ginou !">
|
||||||
@ -125,10 +125,34 @@
|
|||||||
|
|
||||||
<h2>Presse</h2>
|
<h2>Presse</h2>
|
||||||
|
|
||||||
<p>Ginou a eu plusieurs articles à son propos dans le journal local, cependant nous n'en possédons qu'un seul. N'hésitez pas <a href="informations.html">à nous contacter</a> si vous avez un en votre possession.</p>
|
<p>Ginou est apparue régulièrement dans le journal local, preuve de son engagement dans la communauté.</p>
|
||||||
<div class="gallery">
|
<div class="gallery">
|
||||||
<a data-fancybox="divers" href="photos/divers/normal/ainesdugny.jpg" data-caption="Ginou était engagée dans des œuvres caritatives, comme le montre cette coupure de presse.">
|
<a data-fancybox="divers" href="photos/divers/normal/presse-2003-11-12.jpg" data-caption="Un portrait dédié à Ginou dans l'Est Républicain du 12 novembre 2003.">
|
||||||
<img src="photos/divers/mini/ainesdugny.jpg" alt="Ginou était engagée dans des œuvres caritatives, comme le montre cette coupure de presse.">
|
<img src="photos/divers/mini/presse-2003-11-12.jpg" alt="Un portrait dédié à Ginou dans l'Est Républicain du 12 novembre 2003.">
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a data-fancybox="divers" href="photos/divers/normal/presse-2010-09-21.jpg" data-caption="Ginou en photo pour la 30ème édition du salon de peinture de Thierville-sur-Meuse (Est Républicain du 21 septembre 2010)">
|
||||||
|
<img src="photos/divers/mini/presse-2010-09-21.jpg" alt="Ginou en photo pour la 30ème édition du salon de peinture de Thierville-sur-Meuse (Est Républicain du 21 septembre 2010).">
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a data-fancybox="divers" href="photos/divers/normal/presse-2013-09-17.jpg" data-caption="Ginou en photo pour la 33ème édition du salon de peinture de Thierville-sur-Meuse (Est Républicain du 17 septembre 2013).">
|
||||||
|
<img src="photos/divers/mini/presse-2013-09-17.jpg" alt="Ginou en photo pour la 33ème édition du salon de peinture de Thierville-sur-Meuse (Est Républicain du 17 septembre 2013).">
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a data-fancybox="divers" href="photos/divers/normal/presse-2015-10-06.jpg" data-caption="Ginou en photo pour la 35ème édition du salon de peinture de Thierville-sur-Meuse (Est Républicain du 06 octobre 2015).">
|
||||||
|
<img src="photos/divers/mini/presse-2015-10-06.jpg" alt="Ginou en photo pour la 35ème édition du salon de peinture de Thierville-sur-Meuse (Est Républicain du 06 octobre 2015).">
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a data-fancybox="divers" href="photos/divers/normal/presse-2010.jpg" data-caption="Un article de 2010 sur la participation de l'association des anciens au profit du Téléthon.">
|
||||||
|
<img src="photos/divers/mini/presse-2010.jpg" alt="Un article de 2010 sur la participation de l'association des anciens au profit du Téléthon.">
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a data-fancybox="divers" href="photos/divers/normal/presse-2014.jpg" data-caption="Un article de 2014 sur la participation de l'association des anciens au profit du Téléthon.">
|
||||||
|
<img src="photos/divers/mini/presse-2014.jpg" alt="Un article de 2014 sur la participation de l'association des anciens au profit du Téléthon.">
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a data-fancybox="divers" href="photos/divers/normal/presse-2016.jpg" data-caption="Ginou était engagée dans des œuvres caritatives, comme le montre cette coupure de presse de 2016.">
|
||||||
|
<img src="photos/divers/mini/presse-2016.jpg" alt="Ginou était engagée dans des œuvres caritatives, comme le montre cette coupure de presse de 2016.">
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@ -156,18 +180,18 @@
|
|||||||
<p>
|
<p>
|
||||||
De 1956 à 2016, soit sur une période de 60 ans, Ginou a peint plus de de 385 tableaux.<br>
|
De 1956 à 2016, soit sur une période de 60 ans, Ginou a peint plus de de 385 tableaux.<br>
|
||||||
Parmi ceux-ci, elle a le plus souvent aimé travailler à la lumière printanière du mois de mai avec un total de 50 tableaux.<br>
|
Parmi ceux-ci, elle a le plus souvent aimé travailler à la lumière printanière du mois de mai avec un total de 50 tableaux.<br>
|
||||||
Son année la plus active fut 1988 où elle réalisa 23 œuvres. Enfin, le genre de tableau qu’elle préféra peindre était des paysages, plus particulièrement à la campagne.
|
Son année la plus active fut 1988 où elle réalisa 23 œuvres. Enfin, le genre de tableau qu'elle préféra peindre était des paysages, plus particulièrement à la campagne.
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<div id="stats">
|
<div id="stats">
|
||||||
<div class="stat">
|
<div class="stat">
|
||||||
<canvas id="month" width="400" height="200"></canvas>
|
<canvas id="month"></canvas>
|
||||||
</div>
|
</div>
|
||||||
<div class="stat">
|
<div class="stat">
|
||||||
<canvas id="year" width="400" height="200"></canvas>
|
<canvas id="year"></canvas>
|
||||||
</div>
|
</div>
|
||||||
<div class="stat">
|
<div class="stat">
|
||||||
<canvas id="dimension" width="400" height="200"></canvas>
|
<canvas id="dimension"></canvas>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</article>
|
</article>
|
||||||
|
|||||||
@ -8,15 +8,15 @@
|
|||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
<link rel="shortcut icon" href="images/favicon.png">
|
<link rel="shortcut icon" href="images/favicon.png">
|
||||||
<link rel="stylesheet" href="styles/main.css" media="screen">
|
<link rel="stylesheet" href="styles/main.css" media="screen">
|
||||||
<script src="plugins/jquery-3.5.1.min.js"></script>
|
|
||||||
<script src="scripts/menu.js"></script>
|
|
||||||
<link rel="stylesheet" href="styles/fancybox.css" media="screen">
|
<link rel="stylesheet" href="styles/fancybox.css" media="screen">
|
||||||
<script src="plugins/jquery-3.5.1.min.js"></script>
|
<link rel="stylesheet" href="styles/pagination.css" media="screen">
|
||||||
<link href="plugins/jquery.fancybox.min.css" rel="stylesheet">
|
<link rel="stylesheet" href="plugins/jquery.fancybox.min.css" media="screen">
|
||||||
|
<link rel="stylesheet" href="plugins/pagination.css" media="screen">
|
||||||
|
<script src="plugins/jquery-3.6.0.min.js"></script>
|
||||||
<script src="plugins/jquery.fancybox.min.js"></script>
|
<script src="plugins/jquery.fancybox.min.js"></script>
|
||||||
<script src="plugins/pagination.min.js"></script>
|
<script src="plugins/pagination.min.js"></script>
|
||||||
<link rel="stylesheet" href="plugins/pagination.css" media="screen">
|
<script src="scripts/menu.js"></script>
|
||||||
<link rel="stylesheet" href="styles/pagination.css" media="screen">
|
<script src="scripts/fancybox.js"></script>
|
||||||
<script src="scripts/explorer.js"></script>
|
<script src="scripts/explorer.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
@ -136,12 +136,13 @@
|
|||||||
</form>
|
</form>
|
||||||
<p class="no-result"><strong>Aucun résultat.</strong> Veuillez réessayer avec d'autres paramètres.</p>
|
<p class="no-result"><strong>Aucun résultat.</strong> Veuillez réessayer avec d'autres paramètres.</p>
|
||||||
<div id="style-container">
|
<div id="style-container">
|
||||||
|
<img class="style-select list active" src="styles/icons/list.svg" alt="liste">
|
||||||
<img class="style-select frame" src="styles/icons/frame.svg" alt="galerie">
|
<img class="style-select frame" src="styles/icons/frame.svg" alt="galerie">
|
||||||
<img class="style-select list" src="styles/icons/list.svg" alt="liste">
|
|
||||||
</div>
|
</div>
|
||||||
<div id="gallery">
|
<div id="gallery">
|
||||||
<div id="pagination" style="display:table; text-align:center; margin:auto;"></div>
|
<div id="pagination"></div>
|
||||||
<div class="gallery"></div>
|
<div class="gallery"></div>
|
||||||
|
<div id="pagination-sec"></div>
|
||||||
</div>
|
</div>
|
||||||
<table>
|
<table>
|
||||||
<thead>
|
<thead>
|
||||||
|
|||||||
@ -10,12 +10,13 @@
|
|||||||
<link rel="stylesheet" href="styles/main.css" media="screen">
|
<link rel="stylesheet" href="styles/main.css" media="screen">
|
||||||
<link rel="stylesheet" href="styles/fancybox.css" media="screen">
|
<link rel="stylesheet" href="styles/fancybox.css" media="screen">
|
||||||
<link rel="stylesheet" href="styles/pagination.css" media="screen">
|
<link rel="stylesheet" href="styles/pagination.css" media="screen">
|
||||||
<script src="plugins/jquery-3.5.1.min.js"></script>
|
<link rel="stylesheet" href="plugins/pagination.css" media="screen">
|
||||||
<script src="scripts/menu.js"></script>
|
<link rel="stylesheet" href="plugins/jquery.fancybox.min.css" media="screen">
|
||||||
<link href="plugins/jquery.fancybox.min.css" rel="stylesheet">
|
<script src="plugins/jquery-3.6.0.min.js"></script>
|
||||||
<script src="plugins/jquery.fancybox.min.js"></script>
|
<script src="plugins/jquery.fancybox.min.js"></script>
|
||||||
<script src="plugins/pagination.min.js"></script>
|
<script src="plugins/pagination.min.js"></script>
|
||||||
<link rel="stylesheet" href="plugins/pagination.css" media="screen">
|
<script src="scripts/menu.js"></script>
|
||||||
|
<script src="scripts/fancybox.js"></script>
|
||||||
<script src="scripts/exposition.js"></script>
|
<script src="scripts/exposition.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
@ -44,8 +45,9 @@
|
|||||||
<p>Cette section présente une sélection de tableaux représentatifs de l'œuvre de Ginou. La section <a href="explorer.html">Explorer</a> permet de tous les consulter.</p>
|
<p>Cette section présente une sélection de tableaux représentatifs de l'œuvre de Ginou. La section <a href="explorer.html">Explorer</a> permet de tous les consulter.</p>
|
||||||
<p>Pour voir un tableau en haute résolution ainsi que ses informations, veuillez cliquer sur celui-ci.</p>
|
<p>Pour voir un tableau en haute résolution ainsi que ses informations, veuillez cliquer sur celui-ci.</p>
|
||||||
</div>
|
</div>
|
||||||
<div id="pagination" style="display:table; text-align:center; margin:auto;"></div>
|
<div id="pagination"></div>
|
||||||
<div class="gallery"></div>
|
<div class="gallery"></div>
|
||||||
|
<div id="pagination-sec"></div>
|
||||||
</article>
|
</article>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
Binary file not shown.
|
Before Width: | Height: | Size: 289 B After Width: | Height: | Size: 985 B |
@ -8,7 +8,7 @@
|
|||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
<link rel="shortcut icon" href="images/favicon.png">
|
<link rel="shortcut icon" href="images/favicon.png">
|
||||||
<link rel="stylesheet" href="styles/main.css" media="screen">
|
<link rel="stylesheet" href="styles/main.css" media="screen">
|
||||||
<script src="plugins/jquery-3.5.1.min.js"></script>
|
<script src="plugins/jquery-3.6.0.min.js"></script>
|
||||||
<script src="scripts/menu.js"></script>
|
<script src="scripts/menu.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
@ -33,9 +33,9 @@
|
|||||||
|
|
||||||
<article class="main">
|
<article class="main">
|
||||||
<h1>L'art de Ginou</h1>
|
<h1>L'art de Ginou</h1>
|
||||||
<p>Ginou était une artiste peintre autodidacte très appréciée dans son entourage et dans un cercle plus élargi grâce aux expositions de peinture annuelles dans sa région. Elle a réalisé de nombreuses œuvres, principalement des <strong>peintures à l’huile</strong>, plus rarement des <strong>aquarelles</strong>. Elle a également réalisé de nombreuses <strong>peintures sur soie</strong> et plus occasionnellement <strong>sur bois</strong>. Elle illustrait aussi ses <strong>cahiers de poèmes</strong>.</p>
|
<p>Ginou était une artiste peintre autodidacte très appréciée dans son entourage et dans un cercle plus élargi grâce aux expositions de peinture annuelles dans sa région. Elle a réalisé de nombreuses œuvres, principalement des <strong>peintures à l'huile</strong>, plus rarement des <strong>aquarelles</strong>. Elle a également réalisé de nombreuses <strong>peintures sur soie</strong> et plus occasionnellement <strong>sur bois</strong>. Elle illustrait aussi ses <strong>cahiers de poèmes</strong>.</p>
|
||||||
|
|
||||||
<p>Tout au long de sa vie, Ginou a tenu à jour un petit carnet où elle consignait ses tableaux. Elle leur attribuait un numéro et un titre. Elle notait leurs dimensions ainsi que le nom de leur destinataires ou acheteurs. De <strong>de 1958 à 2017</strong> sont référencés 383 tableaux. Deux d'entre eux (nº33 et nº49) ont été recouverts par Ginou elle-même. Nous avons pour l'instant retrouvé quatre tableaux inédits, non listés dans ce carnet. Ginou a commencé à prendre en photos certains tableaux dans les années 1980 puis plus systématiquement à partir des années 2000. Pour compléter et améliorer cette base iconographique, nous avons photographié en haute résolution les tableaux en notre possession.
|
<p>Tout au long de sa vie, Ginou a tenu à jour un petit carnet où elle consignait ses tableaux. Elle leur attribuait un numéro et un titre. Elle notait leurs dimensions ainsi que le nom de leur destinataires ou acheteurs. De <strong>1958 à 2017</strong> sont référencés 383 tableaux. Deux d'entre eux (nº33 et nº49) ont été recouverts par Ginou elle-même. Nous avons pour l'instant retrouvé quatre tableaux inédits, non listés dans ce carnet. Ginou a commencé à prendre en photos certains tableaux dans les années 1980 puis plus systématiquement à partir des années 2000. Pour compléter et améliorer cette base iconographique, nous avons photographié en haute résolution les tableaux en notre possession.
|
||||||
|
|
||||||
<p>Ce site comprend actuellement <strong>249 tableaux</strong> sur les <strong>385 peints à l'huile</strong>. Il est conçu pour présenter un aperçu de son talent et pour que tout le monde puisse apprécier son œuvre.</p>
|
<p>Ce site comprend actuellement <strong>249 tableaux</strong> sur les <strong>385 peints à l'huile</strong>. Il est conçu pour présenter un aperçu de son talent et pour que tout le monde puisse apprécier son œuvre.</p>
|
||||||
|
|
||||||
|
|||||||
@ -8,9 +8,8 @@
|
|||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
<link rel="shortcut icon" href="images/favicon.png">
|
<link rel="shortcut icon" href="images/favicon.png">
|
||||||
<link rel="stylesheet" href="styles/main.css" media="screen">
|
<link rel="stylesheet" href="styles/main.css" media="screen">
|
||||||
<script src="plugins/jquery-3.5.1.min.js"></script>
|
<script src="plugins/jquery-3.6.0.min.js"></script>
|
||||||
<link href="plugins/chart.min.css" rel="stylesheet">
|
<script src="plugins/chart-3.9.1.min.js"></script>
|
||||||
<script src="plugins/chart.bundle.min.js"></script>
|
|
||||||
<script src="scripts/menu.js"></script>
|
<script src="scripts/menu.js"></script>
|
||||||
<script src="scripts/informations.js"></script>
|
<script src="scripts/informations.js"></script>
|
||||||
</head>
|
</head>
|
||||||
@ -60,17 +59,17 @@
|
|||||||
|
|
||||||
<h4>Explorer</h4>
|
<h4>Explorer</h4>
|
||||||
<p>Cette rubrique quant à elle est interactive et permet de visualiser l'ensemble des créations de Ginou. En effet, elle regorge d'options pour pouvoir choisir précisément les tableaux à afficher. Par exemple, il est possible de créer un filtre pour voir tous les tableaux de chiens dont la photo est de bonne qualité réalisés un mois de février : il suffit de sélectionner ces options et de cliquer sur le bouton <strong>Générer</strong>. Bien évidemment, il est possible qu'il n'existe pas de tableau réunissant ces critères, ce qui sera alors indiqué.<br>
|
<p>Cette rubrique quant à elle est interactive et permet de visualiser l'ensemble des créations de Ginou. En effet, elle regorge d'options pour pouvoir choisir précisément les tableaux à afficher. Par exemple, il est possible de créer un filtre pour voir tous les tableaux de chiens dont la photo est de bonne qualité réalisés un mois de février : il suffit de sélectionner ces options et de cliquer sur le bouton <strong>Générer</strong>. Bien évidemment, il est possible qu'il n'existe pas de tableau réunissant ces critères, ce qui sera alors indiqué.<br>
|
||||||
Le résultat affiché sera sous la forme d'une liste, mais il est également possible de l'afficher sous forme d'une galerie (comme dans la rubrique Exposition) en cliquant sur le bouton en haut à droite. Dans ce mode, les tableaux n’ayant pas de photo disponible montreront une icône indiquant que la photo est manquante.</p>
|
Le résultat affiché sera sous la forme d'une liste, mais il est également possible de l'afficher sous forme d'une galerie (comme dans la rubrique Exposition) en cliquant sur le bouton en haut à droite. Dans ce mode, les tableaux n'ayant pas de photo disponible montreront une icône indiquant que la photo est manquante.</p>
|
||||||
|
|
||||||
<h4>Divers</h4>
|
<h4>Divers</h4>
|
||||||
<p>Cette page regroupe diverses photos et informations en complément de la biographie : une vue de son atelier, des photos d'expositions, des coupures de presse, ainsi que des statistiques intéressantes (on peut remarquer que le printemps l'inspirait !). N'hésitez pas à nous contacter si vous avez un document, une photo, des coupures de presse, tout ce qui peut être en relation avec l’art de Ginou.</p>
|
<p>Cette page regroupe diverses photos et informations en complément de la biographie : une vue de son atelier, des photos d'expositions, des coupures de presse, ainsi que des statistiques intéressantes (on peut remarquer que le printemps l'inspirait !). N'hésitez pas à nous contacter si vous avez un document, une photo, des coupures de presse, tout ce qui peut être en relation avec l'art de Ginou.</p>
|
||||||
|
|
||||||
<h2>Informations technique</h2>
|
<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 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> et <a href="https://github.com/kosbarts/Commissioner">Commissioner</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> et <a href="https://github.com/kosbarts/Commissioner">Commissioner</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>
|
<p>Le code source est librement disponible <em>via git</em> en <a href="https://git.marchal.dev/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>
|
||||||
|
|
||||||
<p>Site réalisé par <a href="https://theo.marchal.dev">Théo</a> et Denis Marchal avec la participation de toute la famille. Dernière mise à jour en avril 2021.</p>
|
<p>Site réalisé par <a href="https://theo.marchal.dev">Théo</a> et Denis Marchal avec la participation de toute la famille. Dernière mise à jour en juin 2025.</p>
|
||||||
</article>
|
</article>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
@ -8,7 +8,7 @@
|
|||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
<link rel="shortcut icon" href="images/favicon.png">
|
<link rel="shortcut icon" href="images/favicon.png">
|
||||||
<link rel="stylesheet" href="styles/main.css" media="screen">
|
<link rel="stylesheet" href="styles/main.css" media="screen">
|
||||||
<script src="plugins/jquery-3.5.1.min.js"></script>
|
<script src="plugins/jquery-3.6.0.min.js"></script>
|
||||||
<script src="scripts/menu.js"></script>
|
<script src="scripts/menu.js"></script>
|
||||||
<script src="scripts/painting.js"></script>
|
<script src="scripts/painting.js"></script>
|
||||||
</head>
|
</head>
|
||||||
@ -44,17 +44,17 @@
|
|||||||
|
|
||||||
<div>
|
<div>
|
||||||
<ul class="metadata">
|
<ul class="metadata">
|
||||||
<li><span class="title">numéro :</span><span class="content number"> </span></li>
|
<li><span class="title">numéro :</span><span class="content number"> </span></li>
|
||||||
<li><span class="title">date :</span><span class="content date"> </span></li>
|
<li><span class="title">date :</span><span class="content date"> </span></li>
|
||||||
<li><span class="title">format :</span><span class="content dimension"> </span></li>
|
<li><span class="title">format :</span><span class="content dimension"> </span></li>
|
||||||
<li><span class="title">support :</span><span class="content support"> </span></li>
|
<li><span class="title">support :</span><span class="content support"> </span></li>
|
||||||
<li><span class="title">genre :</span><span class="content genre"> </span></li>
|
<li><span class="title">genre :</span><span class="content genre"> </span></li>
|
||||||
<li><span class="title">thème :</span><span class="content theme"> </span></li>
|
<li><span class="title">thème :</span><span class="content theme"> </span></li>
|
||||||
<li><span class="title">lieu :</span><span class="content place"> </span></li>
|
<li><span class="title">lieu :</span><span class="content place"> </span></li>
|
||||||
<li><span class="title">état photo :</span><span class="content photo"> </span></li>
|
<li><span class="title">état photo :</span><span class="content photo"> </span></li>
|
||||||
<li><span class="title">aide requise :</span><span class="content help"> </span></li>
|
<li><span class="title">aide requise :</span><span class="content help"> </span></li>
|
||||||
<li><span class="title">tags :</span><span class="content tag"> </span></li>
|
<li><span class="title">tags :</span><span class="content tag"> </span></li>
|
||||||
<li><span class="title">commentaire :</span><span class="content comment"> </span></li>
|
<li><span class="title">commentaire :</span><span class="content comment"> </span></li>
|
||||||
<li><span class="content original"><a href="photos/paintings/original/42.jpg">photo originale <img src="styles/icons/arrow.svg"></a></span></li>
|
<li><span class="content original"><a href="photos/paintings/original/42.jpg">photo originale <img src="styles/icons/arrow.svg"></a></span></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
2
photos
2
photos
Submodule photos updated: 64e7a332b3...5e70e3e4a4
13
plugins/chart-3.9.1.min.js
vendored
Normal file
13
plugins/chart-3.9.1.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
7
plugins/chart.bundle.min.js
vendored
7
plugins/chart.bundle.min.js
vendored
File diff suppressed because one or more lines are too long
1
plugins/chart.min.css
vendored
1
plugins/chart.min.css
vendored
@ -1 +0,0 @@
|
|||||||
@keyframes chartjs-render-animation{from{opacity:.99}to{opacity:1}}.chartjs-render-monitor{animation:chartjs-render-animation 1ms}.chartjs-size-monitor,.chartjs-size-monitor-expand,.chartjs-size-monitor-shrink{position:absolute;direction:ltr;left:0;top:0;right:0;bottom:0;overflow:hidden;pointer-events:none;visibility:hidden;z-index:-1}.chartjs-size-monitor-expand>div{position:absolute;width:1000000px;height:1000000px;left:0;top:0}.chartjs-size-monitor-shrink>div{position:absolute;width:200%;height:200%;left:0;top:0}
|
|
||||||
2
plugins/jquery-3.5.1.min.js
vendored
2
plugins/jquery-3.5.1.min.js
vendored
File diff suppressed because one or more lines are too long
2
plugins/jquery-3.6.0.min.js
vendored
Normal file
2
plugins/jquery-3.6.0.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
@ -5,8 +5,12 @@ jQuery(document).ready(function($)
|
|||||||
infobar: false,
|
infobar: false,
|
||||||
toolbar: true,
|
toolbar: true,
|
||||||
smallBtn: false,
|
smallBtn: false,
|
||||||
buttons : [ "close" ],
|
buttons: ["arrowLeft", "arrowRight", "close"],
|
||||||
arrows: true,
|
arrows: false,
|
||||||
transitionEffect: "fade",
|
transitionEffect: "fade",
|
||||||
|
baseClass: 'fancybox-custom-layout',
|
||||||
|
mobile: {
|
||||||
|
preventCaptionOverlap: true,
|
||||||
|
},
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
@ -32,6 +32,7 @@ jQuery(document).ready(function($)
|
|||||||
paramTag = (urlParams.get('tags') == null ? urlParams.getAll('tag') : urlParams.getAll('tags'));
|
paramTag = (urlParams.get('tags') == null ? urlParams.getAll('tag') : urlParams.getAll('tags'));
|
||||||
paramPhoto = (urlParams.get('photos') == null ? urlParams.getAll('photo') : urlParams.getAll('photos'));
|
paramPhoto = (urlParams.get('photos') == null ? urlParams.getAll('photo') : urlParams.getAll('photos'));
|
||||||
paramHelp = (urlParams.get('helps') == null ? urlParams.getAll('help') : urlParams.getAll('helps'));
|
paramHelp = (urlParams.get('helps') == null ? urlParams.getAll('help') : urlParams.getAll('helps'));
|
||||||
|
paramView = (urlParams.get('view'));
|
||||||
params = { "year": paramYear, "month": paramMonth, "dimension": paramDimension, "genre": paramGenre, "theme": paramTheme, "place": paramPlace, "tag": paramTag, "photo": paramPhoto, "help": paramHelp }
|
params = { "year": paramYear, "month": paramMonth, "dimension": paramDimension, "genre": paramGenre, "theme": paramTheme, "place": paramPlace, "tag": paramTag, "photo": paramPhoto, "help": paramHelp }
|
||||||
|
|
||||||
$.getJSON("data.json", function(data)
|
$.getJSON("data.json", function(data)
|
||||||
@ -41,6 +42,8 @@ jQuery(document).ready(function($)
|
|||||||
/** MENU **/
|
/** MENU **/
|
||||||
/**********/
|
/**********/
|
||||||
|
|
||||||
|
fancyboxInit(data, true);
|
||||||
|
|
||||||
var availableOptions = [];
|
var availableOptions = [];
|
||||||
var selectedOptions = [];
|
var selectedOptions = [];
|
||||||
|
|
||||||
@ -447,7 +450,7 @@ jQuery(document).ready(function($)
|
|||||||
else
|
else
|
||||||
result += '<td> </td>'
|
result += '<td> </td>'
|
||||||
|
|
||||||
result += '<td><a data-fancybox="exposition-list" href="';
|
result += '<td><a class="list-preview" data-fancybox="exposition-list" href="';
|
||||||
if (i.photo == "none")
|
if (i.photo == "none")
|
||||||
result += 'images/unknown.jpg';
|
result += 'images/unknown.jpg';
|
||||||
else
|
else
|
||||||
@ -522,10 +525,38 @@ jQuery(document).ready(function($)
|
|||||||
$("article.explorer p.result").css("display", "none");
|
$("article.explorer p.result").css("display", "none");
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function setGallery()
|
||||||
|
{
|
||||||
|
$("table").hide();
|
||||||
|
$("#gallery").show();
|
||||||
|
$(".style-select.frame").addClass('active');
|
||||||
|
$(".style-select.list").removeClass('active');
|
||||||
|
window.localStorage.setItem('explorer-view', 'gallery');
|
||||||
|
}
|
||||||
|
|
||||||
// fancybox configuration
|
function setTable()
|
||||||
$.getScript("scripts/fancybox.js", function() {
|
{
|
||||||
fancyboxInit(data, true);
|
$("#gallery").hide();
|
||||||
});
|
$("table").show();
|
||||||
|
$(".style-select.frame").removeClass('active');
|
||||||
|
$(".style-select.list").addClass('active');
|
||||||
|
window.localStorage.setItem('explorer-view', 'table');
|
||||||
|
}
|
||||||
|
|
||||||
|
if (paramView == "gallery")
|
||||||
|
setGallery();
|
||||||
|
else if (paramView == "table")
|
||||||
|
setTable();
|
||||||
|
else
|
||||||
|
{
|
||||||
|
if (res)
|
||||||
|
{
|
||||||
|
explorerView = window.localStorage.getItem('explorer-view');
|
||||||
|
if (explorerView == "gallery")
|
||||||
|
setGallery();
|
||||||
|
else if (explorerView == "table")
|
||||||
|
setTable();
|
||||||
|
}
|
||||||
|
}
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
@ -335,16 +335,21 @@ function userActionHandle(availableOptions)
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// change display: gallery/table
|
// change display: gallery/table
|
||||||
$(".style-select.frame").click(function()
|
$(".style-select.frame").click(function()
|
||||||
{
|
{
|
||||||
$("table").hide();
|
$("table").hide();
|
||||||
$("#gallery").show();
|
$("#gallery").show();
|
||||||
|
$(".style-select.frame").addClass('active');
|
||||||
|
$(".style-select.list").removeClass('active');
|
||||||
|
window.localStorage.setItem('explorer-view', 'gallery');
|
||||||
});
|
});
|
||||||
$(".style-select.list").click(function()
|
$(".style-select.list").click(function()
|
||||||
{
|
{
|
||||||
$("#gallery").hide();
|
$("#gallery").hide();
|
||||||
$("table").show();
|
$("table").show();
|
||||||
|
$(".style-select.frame").removeClass('active');
|
||||||
|
$(".style-select.list").addClass('active');
|
||||||
|
window.localStorage.setItem('explorer-view', 'table');
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
@ -2,6 +2,8 @@ jQuery(document).ready(function($)
|
|||||||
{
|
{
|
||||||
$.getJSON("data.json", function(data)
|
$.getJSON("data.json", function(data)
|
||||||
{
|
{
|
||||||
|
fancyboxInit(data, false);
|
||||||
|
|
||||||
window.pageSize = 14;
|
window.pageSize = 14;
|
||||||
var paintingList = [];
|
var paintingList = [];
|
||||||
|
|
||||||
@ -18,12 +20,12 @@ jQuery(document).ready(function($)
|
|||||||
if (canDisplay)
|
if (canDisplay)
|
||||||
{
|
{
|
||||||
paintingHtml += 'active"><a data-fancybox="exposition" href="photos/paintings/normal/' + i.number + '.jpg" data-fancybox-index="' + i.number + '">'
|
paintingHtml += 'active"><a data-fancybox="exposition" href="photos/paintings/normal/' + i.number + '.jpg" data-fancybox-index="' + i.number + '">'
|
||||||
paintingHtml += '<img src="photos/paintings/mini/" alt="Tableau ' + i.number + '"></a>';
|
paintingHtml += '<img src="photos/paintings/mini/' + i.number + '.jpg" alt="Tableau ' + i.number + '"></a>';
|
||||||
}
|
}
|
||||||
else
|
else
|
||||||
{
|
{
|
||||||
paintingHtml += 'inactive"><a data-fancybox="exposition" href="photos/paintings/normal/' + i.number + '.jpg" data-fancybox-index="' + i.number + '">'
|
paintingHtml += 'inactive"><a data-fancybox="exposition" href="photos/paintings/normal/' + i.number + '.jpg" data-fancybox-index="' + i.number + '">'
|
||||||
paintingHtml += '<img src="photos/paintings/mini/" alt="Tableau ' + i.number + '"></a>';
|
paintingHtml += '<img src="photos/paintings/mini/' + i.number + '.jpg" alt="Tableau ' + i.number + '"></a>';
|
||||||
}
|
}
|
||||||
paintingHtml += '<span class="item-title">' + i.title;
|
paintingHtml += '<span class="item-title">' + i.title;
|
||||||
if (i.year != '—')
|
if (i.year != '—')
|
||||||
@ -46,11 +48,7 @@ jQuery(document).ready(function($)
|
|||||||
|
|
||||||
if (targetPage > 0)
|
if (targetPage > 0)
|
||||||
$("#pagination").pagination('go', targetPage);
|
$("#pagination").pagination('go', targetPage);
|
||||||
});
|
|
||||||
|
|
||||||
// fancybox configuration
|
|
||||||
$.getScript("scripts/fancybox.js", function() {
|
|
||||||
fancyboxInit(data, false);
|
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
@ -1,6 +1,6 @@
|
|||||||
function fancyboxInit(data, explorer)
|
function fancyboxInit(data, explorer)
|
||||||
{
|
{
|
||||||
$('[data-fancybox="exposition"], [data-fancybox="exposition-list"]').fancybox(
|
$('[data-fancybox="exposition"]').fancybox(
|
||||||
{
|
{
|
||||||
selector: '.gallery a',
|
selector: '.gallery a',
|
||||||
infobar: false,
|
infobar: false,
|
||||||
@ -14,7 +14,31 @@ function fancyboxInit(data, explorer)
|
|||||||
preventCaptionOverlap: true,
|
preventCaptionOverlap: true,
|
||||||
},
|
},
|
||||||
|
|
||||||
caption: function(instance, item)
|
caption: function(instance, item) { return caption(item, data); },
|
||||||
|
beforeShow : function(instance, current) { return beforeShow(instance, current); },
|
||||||
|
afterClose : function(instance) { return afterClose(instance); }
|
||||||
|
});
|
||||||
|
|
||||||
|
$('[data-fancybox="exposition-list"]').fancybox(
|
||||||
|
{
|
||||||
|
selector: 'a.list-preview',
|
||||||
|
infobar: false,
|
||||||
|
toolbar: true,
|
||||||
|
smallBtn: false,
|
||||||
|
buttons: ["arrowLeft", "arrowRight", "close"],
|
||||||
|
arrows: false,
|
||||||
|
transitionEffect: "fade",
|
||||||
|
baseClass: 'fancybox-custom-layout',
|
||||||
|
mobile: {
|
||||||
|
preventCaptionOverlap: true,
|
||||||
|
},
|
||||||
|
|
||||||
|
caption: function(instance, item) { return caption(item, data); },
|
||||||
|
beforeShow : function(instance, current) { return beforeShow(instance, current); },
|
||||||
|
afterClose : function(instance) { return afterClose(instance); }
|
||||||
|
});
|
||||||
|
|
||||||
|
function caption(item, data)
|
||||||
{
|
{
|
||||||
var idx = 0; // search the index of the painting of filtered data
|
var idx = 0; // search the index of the painting of filtered data
|
||||||
for (i = 0; i < data.length; i++)
|
for (i = 0; i < data.length; i++)
|
||||||
@ -39,22 +63,23 @@ function fancyboxInit(data, explorer)
|
|||||||
if (data[idx].comment != '—')
|
if (data[idx].comment != '—')
|
||||||
cartel += '<span class="comment">' + data[idx].comment + '</span>';
|
cartel += '<span class="comment">' + data[idx].comment + '</span>';
|
||||||
cartel += '</div>';
|
cartel += '</div>';
|
||||||
|
|
||||||
return cartel;
|
return cartel;
|
||||||
}
|
}
|
||||||
|
|
||||||
return generateCartel();
|
return generateCartel();
|
||||||
},
|
}
|
||||||
|
|
||||||
beforeShow : function(instance, current)
|
function beforeShow(instance, current)
|
||||||
{
|
{
|
||||||
if (current.opts.fancyboxIndex > previousArray[previousArray.length - 1])
|
if (current.opts.fancyboxIndex > previousArray[previousArray.length - 1])
|
||||||
$('#pagination').pagination('next');
|
$('#pagination').pagination('next');
|
||||||
|
|
||||||
if (current.opts.fancyboxIndex < previousArray[0])
|
if (current.opts.fancyboxIndex < previousArray[0])
|
||||||
$('#pagination').pagination('previous');
|
$('#pagination').pagination('previous');
|
||||||
},
|
}
|
||||||
|
|
||||||
afterClose : function(instance)
|
function afterClose(instance)
|
||||||
{
|
{
|
||||||
// after closing, changing the URL again. I guess there's no better way except by changing fancybox code...
|
// after closing, changing the URL again. I guess there's no better way except by changing fancybox code...
|
||||||
// (apparently fancybox changes back to the original url it had when starting)
|
// (apparently fancybox changes back to the original url it had when starting)
|
||||||
@ -67,5 +92,5 @@ function fancyboxInit(data, explorer)
|
|||||||
else
|
else
|
||||||
window.history.replaceState('', '', window.location.pathname + '?page=' + currentPage + window.location.hash);
|
window.history.replaceState('', '', window.location.pathname + '?page=' + currentPage + window.location.hash);
|
||||||
}
|
}
|
||||||
});
|
|
||||||
}
|
}
|
||||||
@ -50,8 +50,11 @@ jQuery(document).ready(function($)
|
|||||||
gatherYear(tens, 2010, 2020);
|
gatherYear(tens, 2010, 2020);
|
||||||
}
|
}
|
||||||
|
|
||||||
var canvasDimension = document.getElementById("photo").getContext('2d');
|
Chart.defaults.font.family = "'Rubik', Helvetica";
|
||||||
var chartDimension = new Chart(canvasDimension, {
|
Chart.defaults.color = "#000000";
|
||||||
|
|
||||||
|
var canvasPhoto = document.getElementById("photo").getContext('2d');
|
||||||
|
var chartPhoto = new Chart(canvasPhoto, {
|
||||||
type: 'bar',
|
type: 'bar',
|
||||||
data: {
|
data: {
|
||||||
labels: ["1956 - 1959", "1960 - 1969", "1970 - 1979", "1980 - 1989", "1990 - 1999", "2000 - 2009", "2010 - 2016"],
|
labels: ["1956 - 1959", "1960 - 1969", "1970 - 1979", "1980 - 1989", "1990 - 1999", "2000 - 2009", "2010 - 2016"],
|
||||||
@ -83,36 +86,60 @@ jQuery(document).ready(function($)
|
|||||||
}]
|
}]
|
||||||
},
|
},
|
||||||
options: {
|
options: {
|
||||||
tooltips: {
|
plugins: {
|
||||||
|
tooltip: {
|
||||||
mode: 'index',
|
mode: 'index',
|
||||||
intersect: false
|
intersect: false,
|
||||||
|
titleFont: {
|
||||||
|
size: 14
|
||||||
},
|
},
|
||||||
responsive: true,
|
bodyFont: {
|
||||||
scales: {
|
size: 14
|
||||||
yAxes: [{
|
|
||||||
ticks: {
|
|
||||||
beginAtZero: true
|
|
||||||
}, gridLines: {
|
|
||||||
display: true
|
|
||||||
},
|
},
|
||||||
scaleLabel: {
|
|
||||||
display: true,
|
|
||||||
labelString: 'Tableaux'
|
|
||||||
},
|
|
||||||
stacked: true,
|
|
||||||
}],
|
|
||||||
xAxes: [{
|
|
||||||
gridLines: {
|
|
||||||
display: false
|
|
||||||
},
|
|
||||||
stacked: true,
|
|
||||||
}]
|
|
||||||
},
|
},
|
||||||
legend: {
|
legend: {
|
||||||
display: false,
|
display: false,
|
||||||
position: "bottom",
|
position: "bottom",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
responsive: true,
|
||||||
|
scales: {
|
||||||
|
y: {
|
||||||
|
ticks: {
|
||||||
|
font: {
|
||||||
|
size: 14
|
||||||
|
},
|
||||||
|
beginAtZero: true
|
||||||
|
},
|
||||||
|
grid: {
|
||||||
|
lineWidth: 0
|
||||||
|
},
|
||||||
|
title: {
|
||||||
|
display: true,
|
||||||
|
text: 'Tableaux',
|
||||||
|
font: {
|
||||||
|
size: 16
|
||||||
}
|
}
|
||||||
}
|
},
|
||||||
|
stacked: true,
|
||||||
|
},
|
||||||
|
x: {
|
||||||
|
ticks: {
|
||||||
|
font: {
|
||||||
|
size: 14
|
||||||
|
},
|
||||||
|
},
|
||||||
|
grid: {
|
||||||
|
lineWidth: 0
|
||||||
|
},
|
||||||
|
stacked: true,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
animation: {
|
||||||
|
duration: 0
|
||||||
|
},
|
||||||
|
responsiveAnimationDuration: 0,
|
||||||
|
},
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
@ -20,6 +20,12 @@ function paginationInit(data, paintingList, explorer)
|
|||||||
callback: function (response, pagination)
|
callback: function (response, pagination)
|
||||||
{
|
{
|
||||||
currentPage = pagination.pageNumber;
|
currentPage = pagination.pageNumber;
|
||||||
|
|
||||||
|
// fix to have two synced pagination bars
|
||||||
|
var paginationClone = $("#pagination > *").clone(true);
|
||||||
|
$("#pagination-sec").empty();
|
||||||
|
paginationClone.appendTo("#pagination-sec");
|
||||||
|
|
||||||
// url handling
|
// url handling
|
||||||
if (explorer)
|
if (explorer)
|
||||||
{
|
{
|
||||||
|
|||||||
@ -45,23 +45,33 @@ jQuery(document).ready(function($)
|
|||||||
|
|
||||||
$(".metadata .content.dimension").append(data[idx].dimension);
|
$(".metadata .content.dimension").append(data[idx].dimension);
|
||||||
$(".metadata .content.support").append(data[idx].support);
|
$(".metadata .content.support").append(data[idx].support);
|
||||||
$(".metadata .content.genre").append(data[idx].genre);
|
$(".metadata .content.genre").append('<a href="explorer.html?genre='+ data[idx].genre +'">' + data[idx].genre + '</a>');
|
||||||
$(".metadata .content.theme").append(data[idx].theme);
|
$(".metadata .content.theme").append('<a href="explorer.html?theme='+ data[idx].theme +'">' + data[idx].theme + '</a>');
|
||||||
$(".metadata .content.place").append(data[idx].place);
|
$(".metadata .content.place").append('<a href="explorer.html?place='+ data[idx].place +'">' + data[idx].place + '</a>');
|
||||||
|
|
||||||
if (data[idx].photo == "none") photoState = "aucune";
|
if (data[idx].photo == "none") photoState = "aucune";
|
||||||
if (data[idx].photo == "bad") photoState = "mauvais";
|
if (data[idx].photo == "bad") photoState = "mauvais";
|
||||||
if (data[idx].photo == "ok") photoState = "acceptable";
|
if (data[idx].photo == "ok") photoState = "acceptable";
|
||||||
if (data[idx].photo == "good") photoState = "bon";
|
if (data[idx].photo == "good") photoState = "bon";
|
||||||
$(".metadata .content.photo").append(photoState);
|
$(".metadata .content.photo").append('<a href="explorer.html?photo='+ data[idx].photo +'">' + photoState + '</a>');
|
||||||
|
|
||||||
if (data[idx].help == "yes")
|
if (data[idx].help == "yes")
|
||||||
$(".metadata .content.help").append('<a href="informations.html"><strong>oui (!)</strong></a>');
|
$(".metadata .content.help").append('<a class="metadata-help" href="informations.html">oui (!)</a>');
|
||||||
else
|
else
|
||||||
$(".metadata .content.help").append("non");
|
$(".metadata .content.help").append("non");
|
||||||
|
|
||||||
|
// split tags to have a link to each one of them
|
||||||
if (data[idx].tags != "—")
|
if (data[idx].tags != "—")
|
||||||
$(".metadata .content.tag").append(data[idx].tags);
|
{
|
||||||
|
var splitTags = data[idx].tags.split(", ");
|
||||||
|
splitTags.forEach(function(tag, idx, array)
|
||||||
|
{
|
||||||
|
$(".metadata .content.tag").append('<a href="explorer.html?tag='+ tag +'">' + tag + '</a>');
|
||||||
|
|
||||||
|
if (idx != array.length - 1)
|
||||||
|
$(".metadata .content.tag").append(', ');
|
||||||
|
});
|
||||||
|
}
|
||||||
else
|
else
|
||||||
$(".metadata .content.tag").parent().css("display", "none");
|
$(".metadata .content.tag").parent().css("display", "none");
|
||||||
|
|
||||||
|
|||||||
170
scripts/stats.js
170
scripts/stats.js
@ -1,5 +1,9 @@
|
|||||||
jQuery(document).ready(function($)
|
jQuery(document).ready(function($)
|
||||||
{
|
{
|
||||||
|
document.fonts.ready.then(function() {
|
||||||
|
Chart.defaults.font.family = "'Rubik', Helvetica";
|
||||||
|
Chart.defaults.color = "#000000";
|
||||||
|
|
||||||
var canvasMonth = document.getElementById("month").getContext('2d');
|
var canvasMonth = document.getElementById("month").getContext('2d');
|
||||||
var chartMonth = new Chart(canvasMonth, {
|
var chartMonth = new Chart(canvasMonth, {
|
||||||
type: 'bar',
|
type: 'bar',
|
||||||
@ -9,32 +13,48 @@ jQuery(document).ready(function($)
|
|||||||
label: 'nombre de tableaux',
|
label: 'nombre de tableaux',
|
||||||
data: [11, 30, 40, 34, 50, 33, 27, 24, 17, 26, 37, 19],
|
data: [11, 30, 40, 34, 50, 33, 27, 24, 17, 26, 37, 19],
|
||||||
backgroundColor: '#2589BD',
|
backgroundColor: '#2589BD',
|
||||||
borderColor: '#187795',
|
|
||||||
borderWidth: 1
|
|
||||||
}]
|
}]
|
||||||
},
|
},
|
||||||
options: {
|
options: {
|
||||||
scales: {
|
plugins: {
|
||||||
yAxes: [{
|
tooltip: {
|
||||||
ticks: {
|
mode: 'index',
|
||||||
beginAtZero: true
|
intersect: false,
|
||||||
}, gridLines: {
|
titleFont: {
|
||||||
display: false
|
size: 13
|
||||||
|
},
|
||||||
|
bodyFont: {
|
||||||
|
size: 13
|
||||||
},
|
},
|
||||||
scaleLabel: {
|
|
||||||
display: true,
|
|
||||||
labelString: 'Tableaux'
|
|
||||||
}
|
|
||||||
}],
|
|
||||||
xAxes: [{
|
|
||||||
gridLines: {
|
|
||||||
display: false
|
|
||||||
}
|
|
||||||
}]
|
|
||||||
},
|
},
|
||||||
legend: {
|
legend: {
|
||||||
display: false
|
display: false,
|
||||||
|
position: "bottom",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
scales: {
|
||||||
|
y: {
|
||||||
|
ticks: {
|
||||||
|
beginAtZero: true
|
||||||
|
},
|
||||||
|
grid: {
|
||||||
|
lineWidth: 0
|
||||||
|
},
|
||||||
|
title: {
|
||||||
|
display: true,
|
||||||
|
text: 'Tableaux'
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
xAxes: {
|
||||||
|
grid: {
|
||||||
|
lineWidth: 0
|
||||||
|
},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
animation: {
|
||||||
|
duration: 0
|
||||||
|
},
|
||||||
|
responsiveAnimationDuration: 0
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
@ -47,32 +67,48 @@ jQuery(document).ready(function($)
|
|||||||
label: 'nombre de tableaux',
|
label: 'nombre de tableaux',
|
||||||
data: [24, 16, 7, 57, 117, 112, 52],
|
data: [24, 16, 7, 57, 117, 112, 52],
|
||||||
backgroundColor: '#2589BD',
|
backgroundColor: '#2589BD',
|
||||||
borderColor: '#187795',
|
|
||||||
borderWidth: 1
|
|
||||||
}]
|
}]
|
||||||
},
|
},
|
||||||
options: {
|
options: {
|
||||||
scales: {
|
plugins: {
|
||||||
yAxes: [{
|
tooltip: {
|
||||||
ticks: {
|
mode: 'index',
|
||||||
beginAtZero: true
|
intersect: false,
|
||||||
}, gridLines: {
|
titleFont: {
|
||||||
display: false
|
size: 13
|
||||||
|
},
|
||||||
|
bodyFont: {
|
||||||
|
size: 13
|
||||||
},
|
},
|
||||||
scaleLabel: {
|
|
||||||
display: true,
|
|
||||||
labelString: 'Tableaux'
|
|
||||||
}
|
|
||||||
}],
|
|
||||||
xAxes: [{
|
|
||||||
gridLines: {
|
|
||||||
display: false
|
|
||||||
}
|
|
||||||
}]
|
|
||||||
},
|
},
|
||||||
legend: {
|
legend: {
|
||||||
display: false
|
display: false,
|
||||||
|
position: "bottom",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
scales: {
|
||||||
|
y: {
|
||||||
|
ticks: {
|
||||||
|
beginAtZero: true
|
||||||
|
},
|
||||||
|
grid: {
|
||||||
|
lineWidth: 0
|
||||||
|
},
|
||||||
|
title: {
|
||||||
|
display: true,
|
||||||
|
text: 'Tableaux'
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
x: {
|
||||||
|
grid: {
|
||||||
|
lineWidth: 0
|
||||||
|
},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
animation: {
|
||||||
|
duration: 0
|
||||||
|
},
|
||||||
|
responsiveAnimationDuration: 0
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
@ -85,32 +121,52 @@ jQuery(document).ready(function($)
|
|||||||
label: 'nombre de tableaux',
|
label: 'nombre de tableaux',
|
||||||
data: [2, 42, 173, 59, 107],
|
data: [2, 42, 173, 59, 107],
|
||||||
backgroundColor: '#2589BD',
|
backgroundColor: '#2589BD',
|
||||||
borderColor: '#187795',
|
|
||||||
borderWidth: 1
|
|
||||||
}]
|
}]
|
||||||
},
|
},
|
||||||
options: {
|
options: {
|
||||||
scales: {
|
plugins: {
|
||||||
yAxes: [{
|
tooltip: {
|
||||||
ticks: {
|
mode: 'index',
|
||||||
beginAtZero: true
|
intersect: false,
|
||||||
}, gridLines: {
|
titleFont: {
|
||||||
display: false
|
size: 13
|
||||||
|
},
|
||||||
|
bodyFont: {
|
||||||
|
size: 13
|
||||||
},
|
},
|
||||||
scaleLabel: {
|
|
||||||
display: true,
|
|
||||||
labelString: 'Tableaux'
|
|
||||||
}
|
|
||||||
}],
|
|
||||||
xAxes: [{
|
|
||||||
gridLines: {
|
|
||||||
display: false
|
|
||||||
}
|
|
||||||
}]
|
|
||||||
},
|
},
|
||||||
legend: {
|
legend: {
|
||||||
display: false
|
display: false,
|
||||||
|
position: "bottom",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
responsive: true,
|
||||||
|
scales: {
|
||||||
|
y: {
|
||||||
|
ticks: {
|
||||||
|
beginAtZero: true
|
||||||
|
},
|
||||||
|
grid: {
|
||||||
|
lineWidth: 0
|
||||||
|
},
|
||||||
|
title: {
|
||||||
|
display: true,
|
||||||
|
text: 'Tableaux'
|
||||||
|
},
|
||||||
|
stacked: true,
|
||||||
|
},
|
||||||
|
x: {
|
||||||
|
grid: {
|
||||||
|
lineWidth: 0
|
||||||
|
},
|
||||||
|
stacked: true,
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
animation: {
|
||||||
|
duration: 0
|
||||||
|
},
|
||||||
|
responsiveAnimationDuration: 0
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
});
|
||||||
});
|
});
|
||||||
@ -26,6 +26,10 @@ a {
|
|||||||
color:#38686A;
|
color:#38686A;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
a:hover {
|
||||||
|
color:#2589BD;
|
||||||
|
}
|
||||||
|
|
||||||
.gallery a, nav a {
|
.gallery a, nav a {
|
||||||
text-decoration:none;
|
text-decoration:none;
|
||||||
}
|
}
|
||||||
@ -39,8 +43,8 @@ nav .hidden {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.IE-header {
|
.IE-header {
|
||||||
font-size: 1.5rem;
|
font-size:1.5rem;
|
||||||
margin: 1rem;
|
margin:1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
header {
|
header {
|
||||||
@ -130,11 +134,11 @@ header nav ul li a {
|
|||||||
}
|
}
|
||||||
|
|
||||||
header nav #hamburger {
|
header nav #hamburger {
|
||||||
display: inline-block;
|
display:inline-block;
|
||||||
right: 1rem;
|
right:1rem;
|
||||||
font-size: 1.5rem;
|
font-size:1.5rem;
|
||||||
position: absolute;
|
position:absolute;
|
||||||
margin-top: 0.35rem;
|
margin-top:0.35rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
header nav #hamburger .container {
|
header nav #hamburger .container {
|
||||||
@ -247,15 +251,20 @@ article.main .bio-img {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#pagination, #pagination-sec {
|
||||||
/* Exposition */
|
|
||||||
|
|
||||||
article #pagination {
|
|
||||||
display:table;
|
display:table;
|
||||||
text-align:center;
|
text-align:center;
|
||||||
margin:auto;
|
margin:auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#pagination-sec {
|
||||||
|
margin-top:1rem;
|
||||||
|
margin-bottom:1.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* Exposition */
|
||||||
|
|
||||||
article .gallery .gallery-item.active {
|
article .gallery .gallery-item.active {
|
||||||
display:initial;
|
display:initial;
|
||||||
}
|
}
|
||||||
@ -271,7 +280,6 @@ article .gallery {
|
|||||||
justify-content:space-around;
|
justify-content:space-around;
|
||||||
align-self:flex-end;
|
align-self:flex-end;
|
||||||
flex-wrap:wrap;
|
flex-wrap:wrap;
|
||||||
|
|
||||||
margin:auto;
|
margin:auto;
|
||||||
margin-top:0;
|
margin-top:0;
|
||||||
}
|
}
|
||||||
@ -333,7 +341,7 @@ article .gallery img {
|
|||||||
|
|
||||||
@media only screen and (max-width:600px) {
|
@media only screen and (max-width:600px) {
|
||||||
#info {
|
#info {
|
||||||
min-width:280px;
|
min-width:85vw;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -368,6 +376,10 @@ article .gallery img {
|
|||||||
|
|
||||||
/* Painting */
|
/* Painting */
|
||||||
|
|
||||||
|
article.painting {
|
||||||
|
width:unset;
|
||||||
|
}
|
||||||
|
|
||||||
article.painting .container {
|
article.painting .container {
|
||||||
display:flex;
|
display:flex;
|
||||||
flex-direction:row;
|
flex-direction:row;
|
||||||
@ -386,13 +398,30 @@ article.painting .container img {
|
|||||||
}
|
}
|
||||||
|
|
||||||
article.painting .container ul.metadata {
|
article.painting .container ul.metadata {
|
||||||
width:15vw;
|
|
||||||
display:block;
|
display:block;
|
||||||
margin:auto;
|
margin:auto;
|
||||||
margin-left:0;
|
margin-left:0;
|
||||||
position:absolute;
|
position:absolute;
|
||||||
bottom:0;
|
bottom:0;
|
||||||
list-style-type:square;
|
list-style-type:square;
|
||||||
|
padding-left: 1.5rem;
|
||||||
|
list-style-position:outside;
|
||||||
|
}
|
||||||
|
|
||||||
|
article.painting .container ul.metadata .metadata-help {
|
||||||
|
font-weight:bold;
|
||||||
|
color:#38686A;
|
||||||
|
}
|
||||||
|
|
||||||
|
article.painting .container ul.metadata a {
|
||||||
|
text-decoration:none;
|
||||||
|
color:unset;
|
||||||
|
}
|
||||||
|
|
||||||
|
article.painting .container ul li {
|
||||||
|
-webkit-column-break-inside:avoid;
|
||||||
|
page-break-inside:avoid;
|
||||||
|
break-inside:avoid;
|
||||||
}
|
}
|
||||||
|
|
||||||
article.painting .container .metadata span.title {
|
article.painting .container .metadata span.title {
|
||||||
@ -430,9 +459,11 @@ article.painting .container .metadata span.content img {
|
|||||||
article.painting .container ul.metadata {
|
article.painting .container ul.metadata {
|
||||||
position:relative;
|
position:relative;
|
||||||
columns:2;
|
columns:2;
|
||||||
width:80vw;
|
width:95vw;
|
||||||
margin:auto;
|
margin:auto;
|
||||||
margin-top:1rem;
|
margin-top:1rem;
|
||||||
|
list-style-position:inside;
|
||||||
|
padding:0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -496,9 +527,15 @@ article.explorer img.style-select {
|
|||||||
margin-bottom:0.25rem;
|
margin-bottom:0.25rem;
|
||||||
margin-right:0.4rem;
|
margin-right:0.4rem;
|
||||||
margin-left:0.4rem;
|
margin-left:0.4rem;
|
||||||
|
padding-bottom:6px;
|
||||||
cursor:pointer;
|
cursor:pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
article.explorer img.style-select.active {
|
||||||
|
border-bottom:2px solid black;
|
||||||
|
padding-bottom:4px;
|
||||||
|
}
|
||||||
|
|
||||||
article.explorer h3 {
|
article.explorer h3 {
|
||||||
margin-bottom:0.3rem;
|
margin-bottom:0.3rem;
|
||||||
}
|
}
|
||||||
@ -828,15 +865,16 @@ article.infos h4 + p {
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@media only screen and (max-width:1200px) {
|
@media only screen and (max-width:1200px) {
|
||||||
article, article.main {
|
article, article.main {
|
||||||
width:95vw;
|
width:95vw;
|
||||||
|
text-align:justify;
|
||||||
}
|
}
|
||||||
|
|
||||||
article .center {
|
article .center {
|
||||||
text-align:left;
|
text-align:justify;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
article.explorer .center {
|
||||||
|
text-align:center;
|
||||||
}
|
}
|
||||||
|
|||||||
@ -4,6 +4,10 @@
|
|||||||
line-height:0.2rem;
|
line-height:0.2rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.paginationjs.paginationjs-theme-ginou .paginationjs-pages li:last-child {
|
||||||
|
border-right: 1px solid #187795;
|
||||||
|
}
|
||||||
|
|
||||||
.paginationjs.paginationjs-theme-ginou .paginationjs-go-input > input[type="text"], .paginationjs.paginationjs-theme-ginou .paginationjs-pages li {
|
.paginationjs.paginationjs-theme-ginou .paginationjs-go-input > input[type="text"], .paginationjs.paginationjs-theme-ginou .paginationjs-pages li {
|
||||||
border-color:#187795;
|
border-color:#187795;
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user