On Sat, 08 Sep 2007 15:56:20 +0200, ASM <stephanemoriaux.NoAdmin@wanadoo.fr.invalid> wrote:

Bonjour Stephane,

>(combien de mégas au total ?)
>
Selon la sélection, mais entre 1 et 10 MB!

Encore merci pour l'exemple je vais tester cela prochainement.

Otto

>En réponse à otto qui écrivit, en date du : 8/09/07 13:30, le message
>suivant :
>> Bonjour
>> J'ai un répertoire avec des milliers de photos (env. 10k)
>
>une folie !
>(combien de mégas au total ?)
>
>> que je sélectionne à l'aide d'un script PHP
>> dans un tableau. Ce tableau est ensuite utilisé par une fonction Javascript pour les feuilleters.
>>
>> Avant que je puisse utiliser la commande avant ou arrière je dois attendre que le tableau soit downloadé dans
>> mon browser.
>>
>> Question est il possible d'afficher une barre de progression en JavaScript pour voir l'état du download ?
>> si oui comment ?
>>
>> Merci d'avanc pour l'idée ou un lien internet.
>>
>> Otto
>>
>>
>> Exemple simplifié du source:
>>
>> Partie PHP
>> Lecture du répertoire et charge le tableau image
>> *************
>> $dossier=opendir ($repertoir);
>
>$by = 0;
>
>> while ($file = readdir ($dossier)) {
>> if($file != "." && $file != "..") {
>> echo "image[$by]='$repertoir$file';\n";
>> $by++;
>> $last_pic = $repertoir.$file;
>> }
>> }
>> closedir($dossier);
>>
>>
>Partie JavaScript
>affichage du des images
>*******************
>image.sort();
>
>var actuel=0, ende=image.length, r=0, animation = [];
>
>// mise en cache forcée et variation de la barre :
>
>function postCharge() {
>if(r < ende){
> animation[r] = new Image();
> animation[r].onload = postCharge;
> animation[r].src = image[r];
> r++;
> // pourcentage chargé
> var prct = Math.floor((r/ende)*100-1);
> // variation de la barre
> document.getElementById('barre').style.width = prct + '%';
> document.getElementById('barre').innerHTML = r+'/'+ende;
> // ou
> // document.getElementById('barre').innerHTML = prct+'%';
> }
>else // fin de chargement, hop! plus de barre
>document.getElementById('attente').style.displa y = 'none';
>}
>
>// en fin de chargement de la page :
>// 1) création et affichage de la barre
>// 2) post chargement des k images
>
>window.onload = function() {
> var b = document.createElement('div');
> b.id = 'attente';
> b.style.position = 'absolute';
> b.style.top = '150px';
> b.style.left = '8%';
> b.style.width = '80%';
> b.style.border = '4px inset #555';
> b.style.backgroundColor = '#ddd';
> var i = document.createElement('div');
> i.id = 'barre';
> i.style.margin = '3px';
> i.style.width = '1px';
> i.style.height = '12px';
> i.style.border = '2px outset green';
> i.style.backgroundColor = 'lime';
> i.style.textAlign = 'right';
> b.appendChild(i);
> document.body.appendChild(b);
> postCharge();
>}
>
>function feuilleter(direction) {
> if (direction == 1) {
> actuel++;
> if (actuel >= ende) {
> actuel = 0;
> }
> }
> else {
> actuel-- ;
> if (actuel < 0 ) {
> actuel = -1+ende;
> }
> }
>
> document.images.dummy.src=animation[actuel].src;
> document.getElementById('info').innerHTML='image : ' +
> (+1+actuel)+'/'+ende;
>}
></script>
>
><div align=center>
>" . ($by-1) ." images<br>;
><spam id=info></spam><br />
><<
><a href="javascript: feuilleter(-1);">en arrière</a>
><a href="javascript: feuilleter(1) ;">en avant</a>
> >> >>
><br><br>
><img src="<? echo $last_pic; ?>" name="dummy">
></div>