Accessing Current URL using Prototype

Question

Hi folks,

following Ryan Bates Screencast #114 I'm trying to generate endless pages using prototype. In difference to Ryan's showcase my URL called via the AJAX request shall be handled dynamically, cause I do not always call the same URL when the user reaches the end of my page.

So my JS running in backround looks like that and uses document.location.href instead a fixed URL:

var currentPage = 1;

function checkScroll() {
  if (nearBottomOfPage()) {
    currentPage++;
    new Ajax.Request(document.location.href + '?page=' + currentPage, {asynchronous:true, evalScripts:true, method:'get'});
  }
  else {
    setTimeout("checkScroll()", 250);
  }
}

function nearBottomOfPage() {
  return scrollDistanceFromBottom() < 10;
}

function scrollDistanceFromBottom(argument) {
  return pageHeight() - (window.pageYOffset + self.innerHeight);
}

function pageHeight() {
  return Math.max(document.body.scrollHeight, document.body.offsetHeight);
}

document.observe('dom:loaded', checkScroll);

The question is: The code seems to work in Safari but fails in FF 3.6. It seems that FF calculates scrollHeight or offsetHeight differently. How can I prevent that?

Thx in advance. Jason

Answer 1

I've not used them myself but i'm guessing that pageHeight() could use document.viewport.getHeight() which should be a more accurate/cross browser alternative.