Home

Home

The wiki docs are broken up into a few different sections:

• Usage - How to use writeCapture.js
• Options - Common Options accepted by all calls to writeCapture
• WriteCaptureSupport - How to implement the internal helpers that writeCapture needs.
• ControlJS - Details about ControlJS support.

Common Problems

Google AdSense

Doing dynamic loads and reloads of AdSense almost certainly violates the program policy. You could get your account and earnings frozen by trying to do so. Therefore, there is no plan to support AdSense in writeCapture. If you do get it working, we will accept a patch, but it could very well cost you your ad revenue. You've been warned.

Content appears multiple times

You're doing this:

var html = $('#ad').html();
$('#ad').writeCapture().html(html);

What you have forgotten is that while your source may look like this:

<div id="ad"><script src="whatever.js"> </script></div>

.html() returns the live HTML. e.g.,

<div id="ad">
 <script src="whatever.js"> </script>`
 <script src="anotherScriptThatWasDocumentWrittenIn.js"> </script>`
 <iframe id="theActualAd">...</iframe>`
</div>`

So when you pass that HTML to write capture, you end up with 3 copies of the same ad. The orignal script loads another copy of the 2nd script, which loads the ad, the 2nd script also loads the ad, and you've also passed a full copy of the ad HTML. You need to give writeCapture the clean, original source:

$('#ad').writeCapture().html('<div id="ad"><script src="whatever.js"> </script></div>');

Reloading Too Much

A common scenario is to have a sequence of things, like pictures, for the user to page through. You want to show a new ad when the user goes to a new image (your ad provider may or may not be OK with this, you should probably check if you don't want your account frozen.)

A naive implementation would do something like this:

function onNext() {
    $("#ad").writeCapture().html(adData);
}

This can cause problems if the user clicks too fast, because you will queue up multiple requests to load an ad. They may interfere with each other, or your ad provider may not fulfill some of the requests and you get a blank ad.

Anytime you are refreshing in response to an action that a user can repeat, you shoud limit how often the ad is reloaded. e.g.,

var canLoad = true, nextData;

function refreshAd(data) {
   if(!canLoad) {
       nextData = data;
       return;
   }
   nextData = null;
   canLoad = false;
   setTimeout(canRefresh,30000);
   $("#ad").writeCapture().html(data);
}

function canRefresh() {
    canLoad = true;
    if(nextData) {
        refreshAd(nextData);
    }
}

What to try when writeCapture fails

Unfortunately, writeCapture wont work 100% of the time. It's simply not feasible to emulate every feature of a loading document.

If you've tried all the different Options and writeCapture still isn't working, there are some alternatives that may work:

Write to an iframe.

If you create an iframe element and place it where you want the content to render, you can do something like this:

var doc = iframe.contentWindow.document;
doc.open();
doc.write(badHTML);
doc.close();

Note that an iframe is not an ideal solution, but it should work as a last resort in most cases.

Capture document.write yourself

Again, this is not the most robust solution, but if you only have one script to dynamically reload, you may be able to overwrite document.write yourself:

var html = '';
document.write = document.writeln = function(s) {
	html += s;
};

// after the script runs
$('#whatever').html(html);

Unfortunately, this approach is prone to breaking if the remote script changes significantly. If it was this easy, you wouldn't need writeCapture.