Random photos in your 23 badge

As a follow-up and an answer to a comment to the previous post, let me just write a note about randomizing and caching.

Basically, our caching strategy mean that the badge photos won’t be different on every page update, even if you choose to randomize in the badge setup guide. The data which produces the JS object — upon which the badge is programmed — is cached for 30 minutes — and accordingly, this means that the badge ought to be reproduced randomly every half hour.

The problem is that producing the more advanced datasets for the JS objects requires some doing on our server, and if a 23 badge were put on a busy site this might be an issue for us — that is, if we hadn’t cached the data.

That doesn’t mean that you can get a random-every-time effect though. You’ll just have to randomize data through JavaScript instead. This will do the trick:

<script type="text/javascript"
  src="http://www.23hq.com/resources/um-style/general.js">
</script>
<script type="text/javascript"
  src="http://www.23hq.com/TheRatRace/script/data.js?mode=basic">
</script>
<script type="text/javascript"
  src="http://www.23hq.com/TheRatRace/script/functions.js">
</script>
<script>
    function rnd(myArray) {
        var i = myArray.length;
        if ( i == 0 ) return false;
        while ( --i ) {
            var j = Math.floor( Math.random() * ( i + 1 ) );
            var tempi = myArray[i];
            var tempj = myArray[j];
            myArray[i] = tempj;
            myArray[j] = tempi;
        }
    }
    var i = 0;
    var tmpArr = new Array();
    for (photo_id in photos) tmpArr[i++]=photo_id;
    rnd(tmpArr);
    var tmpArr2 = new Array();
    for (i in tmpArr) tmpArr2[tmpArr[i]] = photos[tmpArr[i]];
    photos = tmpArr2;

    display23['linkToAccount'] = 0;
    display23['size'] = ’standard’;
    display23['layout'] = ‘horizontal’;
    display23['photoinfoTaken'] = 0;
    display23['photoinfoTags'] = 0;
    display23['photoinfoAlbums'] = 0;
    display23['photoinfoWords'] = 0;

    writePhotos(4);
</script>

This example uses TheRatRace’s photos − and also take a look a his web page which uses the 23 badge in a very cool fashion!

Comments are closed.