Home > kruimelpad

vorige 54 volgende

inhoud

Twitter invoegen (9)

(reset)

Nu moet gekeken worden of alle twitterberichten gearriveerd zijn, zodat daarna de linkerkolom in volle glorie getoond kan worden. Om er achter te komen wanneer dat moment is, wordt een kleine list toegepast:

  • Van de tijdelijk weggezette #tempTwit wordt met hele kleine tussenpozen (0,1 sec.) de hoogte opgemeten.
  • Telkens wordt de gemeten hoogte vergeleken met de vorige gemeten hoogte. Als daar verschil in zit, is twitter nog bezig de berichten naar de pagina te sturen, en mag de linkerkolom niet getoond worden.
  • Als de hoogte hetzelfde blijft, is twitter kennelijk klaar.
  • Om te vermijden dat het twitterblok voortijdig incompleet getoond wordt door een hapering bij twitter (waardoor het doorgeven van de berichten stokt, en de hoogte hetzelfde blijft), wordt nog 5 keer gecheckt of de hoogte inderdaad hetzelfde is gebleven.
  • Daarna kan het tonen van de hele linkerkolom getriggerd worden.

In javascript gezet ziet dit er uit als:

    var oldTwitblokH = -1; // inhoud twitterblok heeft nog geen hoogte
    var count = 1;         // teller voor als bijna klaar
function getTwitblokH() {
    // kijken in hoeverre de twitter-berichten al gedownload zijn
    // door opmeten hoogte van de inhoud van het twitterblok:
    var twitblokH = document.getElementById('tempTwit').offsetHeight;
    // vergelijken met vorige gemeten waarde, en doorgaan zolang er verschil is: 
    if (twitblokH > oldTwitblokH){
        oldTwitblokH=twitblokH; // huidige waarde is oude waarde voor volgende ronde 
        t = clearTimeout('getTwitblokH()');
        t = setTimeout('getTwitblokH()', 100); // wachttijd in millisec.
    }
    // als hoogte gelijk is, paar keer controleren of dat zo blijft:
    else if (twitblokH==oldTwitblokH && count<5){
        count=count+1;
        oldTwitblokH=twitblokH;
        t = clearTimeout('getTwitblokH()');
        t = setTimeout('getTwitblokH()', 100);
    }
    else { // als hoogte niet meer verandert, en twitterblok compleet is gedownload: 
        alert('Alle Twitter-berichten zijn binnen!');
	}
}

In plaats van de hoera-boodschap zal later een functie aangezet worden om de linkerkolom te tonen.

Gerealiseerd in deze stap

  • Dit script toegevoegd aan het javascript-blok op het eind van de pagina.
  • De functie footerposition() op de automaat gezet.
  • De nieuwe functie wordt automatisch ingeschakeld als de footer op de goede hoogte staat: aan het eind van de functie footerposition().

Soms doet twitter er wat langer over; als de berichten eenmaal gedownload zijn (zoals hier al een aantal stappen geleden is gebeurd) kan het ook razendsnel gaan!
(Maar ook dan zou de linkerkolom even verspringen.)

vorige 54 volgende

Twitter

[vultekst]
[vultekst]
[vultekst]
[vultekst]
[vultekst]
[vultekst]
[vultekst]
[vultekst]
[vultekst]
[vultekst]
[vultekst]
[laatste kolomregel]
[rechterkolom]
[vultekst]
[vultekst]
[laatste kolomregel]