Création d’une nouvelle page de consultation des photos en plein écran, avec accès par défilement à toutes les photos de l’année.

12/06/17

Le but du nouveau développement est d’afficher les photos d’une année en peine page, avec défilement vers l’avant et l’arrière, commandé par des flèches, dans un bandeau qui apparaîtra au survol de la souris, en surimpression sur la photo, et qui contiendra aussi la légende de la photo.
La première étape concerne la mécanique d’extraction des données. Elle s’applique aux squelettes rubrique.html et article.html.
Les développements sont faits sous EasyPHP sur Acer. Tous les fichiers de développement seront conservés dans le répertoire /squelettes et mirrorés chez OVH. Ces fichiers se nomment test1(...n).html pour les test du fichier rubrique.html et test1(...n)article.html pour article.html, fichier qui n’existait pas dans la version précedente du site (la page rubrique appelait directement le fichier .jpg).

N.B. : Ne pas oublier de mirrorer aussi le fichier mesfonctions.php qui a été enrichi de fonctions nouvelles.

14/06/17

Parvenu à une version opérationnelle avec test15.html et test15article.html
Nouveau principe de fonctionnement :
La page "rubrique" est modifiée pour qu’elle appelle la page "article" en lui transmettant seulement deux paramètres :

1. param_rubrique est le id_rubrique de la rubrique en cours
2. param_ordre est le numéro d’ordre de la photo dans la liste classée de l’année en cours

La page "article" reçoit ces deux paramètres, recu_rubrique et recu_ordre. Ces deux éléments sont utilisés dans une boucle batissant deux tableaux qui listent toutes les photos, dans l’ordre voulu. On extrait ensuite de ce tableau la photo portant le numéro d’ordre demandé, et on l’affiche. On calcule aussi les liens vers la photo précédente et la suivante : Pour ce faire, on incrémente/décrémente le numéro d’ordre, en butant sur la borne inférieure "=1", et sur une borne supérieure égale au nombre total de photos dans l’année. Ces deux numéros permettent à leur tour d’extraire du tableau les deux liens vers les photos. Ces liens appellent la même page article (mais sans target=_blank, comme dans rubrique), en fournissant dans l’url les deux paramètres param_rubrique et param_ordre.

15/06/17

Mise au point de l’affichage de la photo plein écran : On applique à img un style max-width : 100% et height : auto. Un cadre à opacity 0.6 apparait au survol de la souris. il contient au centre la légende de la photo, et de chaque côté des flèches avec les liens vers l’image précédente et la suivante.

Corrigé un problème de classement des photos : L’affichage se faisait dans le bon ordre sur le site local EasyPHP, mais dans un ordre incorrect sur le site OVH. La raison tient à ce que les fichiers d’images sont classés par ordre alphabétique sous Windows mais pas sous Unix.
Solution : on modifie la page article pour lui faire remplir deux tableaux. Une première boucle génère tablo qui indexe les url des images avec pour clé le numéro extrait de leur nom.
Une deuxième boucle, triée par la première clé, génère tablo2, qui indexe les url avec pour clé le numéro d’ordre dans l’année.

25/06/17
L’apparence de la page Rubrique a été améliorée, sur le modèle du site recettes

09/07/17

reste à faire :

• dans la page Rubrique, corriger la légende qui apparait en bulle (title)
• faire des pages Recherche et Article-recherche sur le même modèle que les pages Rubrique