Charges automatiquement des images d'un répertoire

**djedje-08** · 05/04/2020, 19h04

Bonjour à tous,

J'ai un problème que je pense vous pourrez m'aider facilement à résoudre :
Je précise déjà que ma page HTML sera exécutée en local (donc PHP compliqué).

Le but est de charger 2 images côte à côte, l'une nommée "Daily" et l'autre "Weekly".
Le nom de ces images est au format aaaa-mm-jj.JPG soit par exemple 2010-01-20.JPG
Je ne peux pas renommer ces images parce qu'elles sont également utilisées par d'autres personnes et cette nomenclature permet à tout le monde se s'y retrouver.
J'ai quelques 2 617 images "Daily" et donc 530 "Weekly" (je précise que les dossiers "Daily" et "Weekly" ne contiennent que des images dont j'ai besoin.
Vous imaginez bien que je ne me vois pas pas taper plus de 2 000 lignes pour afficher ces images.

Ma première étape consiste donc à faire afficher automatiquement une image sans charger chacun des noms.
Pour cela, j'essaye d’utiliser le code ci-dessous :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<html>
<head>
 
<script language="JavaScript">
i = 1;
 
function affiche(numero) {
  i = numero;
  img.src = 'Daily/'+i+'.jpg';
  text.value = i;
}
</script>
 
</head>
<body>
 
<img name="img" src="Daily/1.jpg""><br>
<input type="button" value="<" OnClick="affiche(i-1)">
<input type="texte" name="text" value="1" OnChange="affiche(text.value)">
<input type="button" value=">" OnClick="affiche(i+1)">
 
</body>
</html>

Mon premier soucis est que ce code fonctionne bien si mes images sont nommées 1.JPG ; 2.JPG ; 3.JPG ; etc mais pas avec ma nomenclature.
Comment faire pour que javascript prenne chacune des images dans l'ordre de leur nom ?
Deuxième soucis, mon input text ne change pas de valeur. A quel endroit j'ai oublié quelque chose ?
Troisième question : serait-il possible d'avoir une liste déroulante contenant le nom de toutes mes images et qui affiche l'image correspondant au nom sélectionné ?
Quatrième question : Comment faire pour que la deuxième image (pas encore indiquée dans le code ci-dessus) se coordonne avec la première :
Je m'explique par un exemple :
L'image weekly "2010-01-08" sera affichée pour les images daily suivantes :
"2010-01-08"
"2010-01-11"
"2010-01-12"
"2010-01-13"
"2010-01-14"

L'image weekly "2010-01-15" sera affichée pour les images daily suivantes :
"2010-01-15"
"2010-01-18"
"2010-01-19"
"2010-01-20"
"2010-01-21"

En gros, tant qu'une autre image weekly n'est pas égal à une autre image daily

Je vous remercie par avance pour votre aide précieuse.

Bonne fin de week-end,
et prennez soin de vous en ces temps troublés