1

Like others, I'm trying to tell the difference between javascript code running in a mobile browser and in a phonegap webuiview. The standard solution is to wait for the deviceready event to fire, because after it fires, you know you're in phonegap. But how long do you wait?

I have code I want to run as early as possible because I don't want my users to sit around waiting. But I don't want to run it before phonegap is initialized, if it's going to initialize. What I'm looking for is something like a devicenotready event which fires when the after cordova.js code has run and determined there's nothing for it to attach to. Or some variable I can poll to tell the difference between cordova still loading and cordova having given up trying to load. Is there a difference?

I hate this solution, but it's the best I've come up with. Please tell me there's something better than this:

function whenLoaded(callback,timeout) {
    var when_loaded_needs_running = true;
    document.addEventListener('deviceready', function() {
        if( when_loaded_needs_running ) {
            when_loaded_needs_running = false;
            callback();
        } else {
            console.log("deviceready fired too late. whenLoaded already ran.");
        }
    });
    window.setTimeout(function() {
        if( when_loaded_needs_running ) {
            when_loaded_needs_running = false;
            console.log("deviceready didn't fire after "+timeout+"ms. running whenLoaded anyway.");
            callback();
        }
    }, timeout);
}
Community
  • 1
  • 1
Leopd
  • 41,333
  • 31
  • 129
  • 167

1 Answers1

2

A simpler test would be to see if the cordova JavaScript global is available - no waiting on an event, you can execute immediately (as long as it executes after the theoretical <script> include of cordova.js). Depending on which version of PhoneGap you are running, you may need to test one of several global variables.

Should be as simple as:

if(cordova || Cordova || PhoneGap) {
  alert('hey im in a phonegap webview!');
} else {
  alert('regular old browser, aw shucks');
}
fil maj
  • 2,260
  • 16
  • 16
  • Nope. Those variables get set when you load the script, regardless of whether it's working or not. So that would only work if the server somehow knew whether or not to include the cordova `script` tag, which AFAICT is impossible since the user-agents are the same. – Leopd Jun 05 '12 at 22:01
  • It seems silly to me to load the script file in regardless of client. I assume you are loading all of your assets in remotely? i.e. your phonegap webview grabs index.html, phonegap.js, etc. from your server, just like mobile web page views? If so, consider not doing that for your phonegap clients. Your phonegap users are already waiting for the assets to come in, so your initial solution won't delay them much more than they already experience. Phonegap gives you a "compile" step - you package your app before you submit to app store. Take advantage of that. – fil maj Jun 10 '12 at 22:55
  • If there's a way for a server-generated HTML page to load local assets, please tell me how, because my understanding is that it's impossible. As for moving all the logic that interacts with the database and generates the pages from my server into client-side javascript, well that's actually not trivial. – Leopd Jun 11 '12 at 06:13
  • can you package your HTML with the app as well? presumably you have some/all parts of the app hosted on your web-accessible server. when you compile the native apps via phonegap, take a snapshot of the index.html from your server and add a – fil maj Jun 11 '12 at 06:53
  • Not that simple. As with most of the web, the HTML is dynamically generated by the server. Can't run server-code in the app, so packaging all the HTML into the app would requiring re-writing much of the app from scratch. – Leopd Jul 17 '12 at 17:55