Filter information on a chat iframe that's never fully loaded

Question

I use a chat and i want to change the way msgs are displayed, so i would like to be able to ignore some of them.

The problem is that this chat uses an iframe where information (msgs, left, joined) is displayed, and its never loaded (its always getting html added to it).

I would like to use greasemonkey to change the incoming information, but i cant since the iframe never finish the loading, i can only change it when i press the STOP button on the browser.

I want to hide the iframe, filter, and get other iframe (my own) with the information filtered. Is this possible?

Answer 1

You could hide the original iframe and inject your own iframe on page load and add a listener for new posts. And add the new posts after filtering to your own injected iframe.

I had to do something like that myself for a plugin I'm creating for SO chat. I ended up using an aggressive listener. Something like:

function PostListener() {
  var self = this;

  this.listen = function() {
    // check for new messages in hidden iframe and do stuff you want to do with them

    setTimeout(self.listen, 1000);
  };
}

(function() {
  var postListener = new PostListener();
  postListener.listen();
})();

Which basically checks every 1 second for new messages. This was my first attempt, because I thought there were no DOMlisteners available.

However in a question of mine it seems like there actually is a DOM listener. I still need to implement it so I do not know the browser support of it, but it is worth the try (or you have to wait till I have implemented it ;) ).