Added new captureOnCallback option

README.md

@@ -335,6 +335,9 @@ Few rules:
   <dt>cookies</dt>
   <dd>Configure <a href="http://phantomjs.org/api/phantom/property/cookies.html">cookies</a> that will be contained in request. HTTP message body is the easiest way for sending cookies to Manet (ex: using JSON format).</dd>
 
+  <dt>captureOnCallback</dt>
+  <dd>Allow the page to tell Manet when it's ready for capture. This uses <a href="http://phantomjs.org/api/webpage/handler/on-callback.html">page.onCallback</a> under the hood. (default is `false`)</dd>
+
 </dl>
 
 

public/js/app.js

@@ -9,12 +9,14 @@
         'user', 'password',
         'callback', 'headers', 'clipRect',
         'force', 'selector',
-        'engine'
+        'engine',
+        'captureOnCallback'
     ];
 
     function cleanBoolValue(name, value) {
         return ((value && (name === 'js' || name === 'images')) ||
-                (!value && name === 'force')) ? null : value;
+                (!value && name === 'force') ||
+                (!value && name === 'captureOnCallback')) ? null : value;
     }
 
     function readOptions() {

public/usage.html

@@ -84,6 +84,11 @@ <h2>Website screenshot service</h2>
                     <input id="js" name="js" type="checkbox" checked>
                 </div>
 
+                <div class="pure-control-group">
+                    <label for="captureOnCallback" class="pure-checkbox">Capture on callback</label>
+                    <input id="captureOnCallback" name="captureOnCallback" type="checkbox">
+                </div>
+
                 <div class="pure-control-group">
                     <label for="images" class="pure-checkbox">Enable images</label>
                     <input id="images" name="images" type="checkbox" checked>

src/options.js

@@ -41,7 +41,8 @@ function createSchema() {
                 secure: joi.boolean(),
                 expires: joi.string()
             })
-        )
+        ),
+        captureOnCallback: joi.boolean()
     });
 }
 

src/scripts/screenshot.js

@@ -221,29 +221,46 @@
         try {
             var page = createPage(options, captureScreenshot);
 
+            var addStylesAndRender = function() {
+                try {
+                    addStyles(page, DEF_STYLES);
+                    renderScreenshotFile(page, options);
+                } catch (e) {
+                    exit(page, e);
+                }
+            };
+
+            if (options.captureOnCallback === true) {
+                page.onCallback = function(data) {
+                    log('CALLBACK: '+ JSON.stringify(data));
+                    addStylesAndRender();
+                };
+            }
+
             page.open(options.url, function (status) {
-                var onPageReady = function() {
-                    try {
-                        addStyles(page, DEF_STYLES);
-                        renderScreenshotFile(page, options);
-                    } catch (e) {
-                        exit(page, e);
-                    }
-                },
-                checkDomElementAvailable = function() {
+
+                if (status !== 'success') {
+                    exit();
+                }
+
+                if (options.captureOnCallback === true) {
+                    return;
+                }
+
+                var checkDomElementAvailable = function() {
                     if (options.selector) {
                         var interval = setInterval(function () {
                             var element = page.evaluate(function (selector) {
                                 return document.querySelector(selector);
                             }, options.selector);
 
                             if (element !== null && typeof element === 'object') {
-                                onPageReady();
+                                addStylesAndRender();
                                 clearInterval(interval);
                             }
                         }, 250);
                     } else {
-                        onPageReady();
+                        addStylesAndRender();
                     }
                 },
                 checkReadyState = function() {