Blogger Javascript with JSON error on Posts > 500

Question

I would like to show random posts to my blogger.

I got a javascript from googling and tried it, but the number of random posts are not correct (should be 10 but sometimes 4, sometimes 2, etc). I tried to check what's happening and found out that json.feed.entry [500] throws error.

Here is the javascript that I used

<script type="text/javascript">

function randomposts(json) {
  var randarray = new Array();
  var l=0;
  var flag;
  var numofpost=10;

  var total = parseInt(json.feed.openSearch$totalResults.$t,10);

  for(var i=0;i < numofpost;) {
    flag=0;
    randarray.length=numofpost;
    l=Math.floor(Math.random()*total);
    for(j in randarray){
      if(l==randarray[j]){
        flag=1;}
    }
    if(flag==0&&l!=0){
      randarray[i++]=l;
    }
  }
  // correct output
  // alert(randarray);

  document.write('<ul>');

  // dummy for testing 500 limit 
  //for (var x = 0; x < numofpost; x++) {
  //  randarray[x]= 495 + x;
  //}

  for(var n in randarray){
    var p=randarray[n];
    var entry=json.feed.entry[p-1];
    var posttitle = entry.title.$t;
    for(var k=0; k < entry.link.length; k++){
      if(entry.link[k].rel=='alternate'){
        document.write('<li> ' + posttitle.link(entry.link[k].href) + '</li>');

      }
    }
  }
  document.write('</ul>');
}
</script>
<script src="/feeds/posts/default?alt=json-in-script&start-index=1&max-results=1000&callback=randomposts" type="text/javascript"></script>

Currently I set var total = 500; so that the random works only for first 500 posts.

How to solve this issue?

UPDATE: I added try catch block and the error is TypeError: Cannot read property 'title' of undefined

UPDATE 2: The following picture is snapshot of console. The json.feed.entry 500 is undefined.

Answer 1

So it seems that the feed entry at the randomized index is null, in that case add another condition to ensure that every entry in randomized indexes is not null.

Replace:

if(flag==0&&l!=0){

with:

if(flag==0&&l!=0&&json.feed.entry[l-1]!=null){
  randarray[i++]=l;
}

I hope that solves your problem.

Regards,

PP

EDIT: Then you can call the feed url twice, this is the quick and dirty way to achieve so:

<script type="text/javascript">
var a=0;
var b=0;
var entries = new Array();
function randomposts(json) {
  for (var i in json.feed.entry) {
    var entry = json.feed.entry[i];
    if (entry != null) {
        entries[b++] = entry;
    }
  }
  a++;
  if (a < 2) return;
  var randarray = new Array();
  var l=0;
  var flag;
  var numofpost=10;

  var total = entries.length;

  for(var i=0;i < numofpost;) {
    flag=0;
    randarray.length=numofpost;
    l=Math.floor(Math.random()*total);
    for(j in randarray){
      if(l==randarray[j]){
        flag=1;}
    }
    if(flag==0&&l!=0){
      randarray[i++]=l;
      //alert(l);
    }
  }
  // correct output
  // alert(randarray);

  document.write('<ul>');

  // dummy for testing 500 limit 
  //for (var x = 0; x < numofpost; x++) {
  //  randarray[x]= 495 + x;
  //}

  for(var n in randarray){
    var p=randarray[n];
    var entry=entries[p-1];
    var posttitle = entry.title.$t;
    for(var k=0; k < entry.link.length; k++){
      if(entry.link[k].rel=='alternate'){
        document.write('<li> ' + posttitle.link(entry.link[k].href) + '</li>');

      }
    }
  }
  document.write('</ul>');
}
</script>

<script src="/feeds/posts/default?alt=json-in-script&start-index=1&max-results=500&callback=randomposts" type="text/javascript"></script>
<script src="/feeds/posts/default?alt=json-in-script&start-index=501&max-results=500&callback=randomposts" type="text/javascript"></script>

Answer 2

While you set the max-results to 1000, the entries returned from the server will be capped to 500. It will still return the right total number of entries, however, as you can see if you access json.feed.openSearch$totalResults.$t.

Source