Random index da un array

[Imnotdead]

Ciao a tutti,
ho questo problema e non riesco a venirne a capo: ho un array di 16 immagini che vorrei mostrare in sequenza (carico un'immagine, faccio .animate con jquery e con la callback di animate carico la prossima alla fine dell'animazione) in una "griglia" di 16 divs.

Le 16 immagini dovrebbero apparire in posizioni "random", ovvero la prima potrebbe apparire nel decimo div, la seconda nel settimo, ecc. Per questo, ho un array di "posizioni" da cui estraggo un index randomly, poi lo tolgo dall'array perchè non sia più disponibile quando chiamo il prossimo random().

Pare però che non sempre riesca a eliminare l'elemento dall'array "posizioni".

Non so se mi sono spiegata molto bene, posto il codice in ogni caso:

function GenerateRand() {
					
					
					intRandom 	= Math.floor(Math.random()*33); 									// Random Image (1-32)
					szImageSrc 		= arrImages[intRandom]; 											// Image
					szImageLink 	= arrLinks[intRandom]; 												// Link
					RandomPos		= Math.floor(Math.random()*arrPositions.length);					// Random Position (1-16)
					
					alert("Available Positions =>" + arrPositions);
					alert("RandPos =>"+ RandomPos);
					
					GetImage(intRandom,szImageSrc,RandomPos,szImageLink);
				
				}

				function GetImage(intRandom,imgSource,imgPos,imgLink) {
					var img = new Image();
					$(img).attr('src', '/Uploads/Logos/' + imgSource)
						.load(function () {
							var CurrImage = $(this).attr("src");
							$(CurrImage).css("opacity","0");
								
							$("#HImage-" + imgPos)
								.append("[img]/Uploads/Logos/"+imgSource+"[/img]")
								.animate({ opacity: 1 },"slow",function(){
									CleanArrays(intRandom,imgSource,imgPos,imgLink);
							});
					}).error(function () { 
						alert("Error loading image => " + imgSource); 
					
					});
				}	

				function CleanArrays(intRandom,szImageSrc,RandomPos,szImageLink){
					
					arrImages.splice(intRandom,1);
					arrRandRand.splice(intRandom,1);
					arrPositions.splice(RandomPos,1);
					GenerateRand();
				}

				GenerateRand();

[Imnotdead]

Nessuno?!

[artorius]

mmm, se ho capito bene gli elementi dell'array sono 33, giusto?

[Imnotdead]

ciao artorius,
allora: l'array delle immagini contiene 32 elementi, ma ho 16 divs in cui devo farle apparire (ovviamente non tutte, ma 16 per volta).

[artorius]

domanda, da un milione di dollari:

Se togli gli elementi dall'array, otterrai un array, il totale degli elementi sarà più piccolo, quindi perché continui ad usare 33 (o 32 a seconda di come la vedi)?

Mi spiego, tu visualizzi la prima immagine, la rimuovi dall'array (l'array ora ha 31 elementi), al secondo ciclo il Math.Random ti ritorna 32 e lo script va in palla perché becca una eccezione outOfIndex.

[Imnotdead]

Ok, ho capito il punto: il fatto è che le 16 immagini successive (quindi dalla 16 alla 32) mi servono in un secondo momento, ovvero dopo che tutte le prime 16 sono state visualizzate.
Il problema sta nel fatto che a volte il mio splice() cancella l'indice corretto, a volte quello successivo...

Non sono molto afferrata di javascript, perdonami.
Lau

[artorius]

ehm, ovviamente tu sai come funziona l'oggetto Image, vero?

[Imnotdead]

Mmmm...mi viene il dubbio che no?!?

[artorius]

il termine Caricamento Asincrono ti dice qualcosa?

Allora, facciamo l'esempio:

tu lanci i tuoi script in sequenza.
Dato che Image carica le immagini in maniera asincrona, lo script non si interrompe quando carica l'immagine (quella è l'idea dietro all'onload dell'oggetto Image).

Bene, metti che l'immagine uno sia l'indice 3 dell'array e l'immagine due sia l'indice 1.

L'immagini sono in caricamento, ma, per qualche paperocchio con il thread di connessioni, il browser carica prima la due della uno.

Che succede all'array? l'immagine in posizione 1 viene rimossa dall'array, mentre l'immagine in posizione 3 non è ancora stata caricata. L'immagine in posizione 3 viene caricata e lo script tenta di rimuoverla, peccato che rimuova quella in posizione 3 che, visto che la uno non c'è più, è in realtà la 4. Hai capito che succede?

Devi fare in modo che quando rimuovi l'immagine dall'array, non usi l'indice, ma lo scansioni controllando gli url delle immagini, fino a quando non trova quello uguale al src dell'oggetto this.