Playing with Apache Cordova, I could not help but many people having issue wrapping a live hosted website into a mobile application. Most of the issues were related to toolbars still being shown up even after the inAppBrowser options were set.

The code below should be used to replace index.js so it will launch a fresh Cordova Mobile application with no browser signs.

var app = {
    // Application Constructor
    initialize: function () {
        //document.addEventListener("deviceready", onDeviceReady, false);
        document.addEventListener("deviceready", function () {
            var ref = cordova.InAppBrowser.open('http://xpo6.com','_blank','location=no,zoom=no,hidden=yes,hideurlbar=yes,toolbar=no');
            ref.addEventListener("loadstop", function () {
                ref.show();
            });
        }, false);
    },


    onDeviceReady: function () {
        window.open = cordova.InAppBrowser.open;
        this.receivedEvent('deviceready');

    },
    receivedEvent: function (id) {
        var parentElement = document.getElementById(id);
        var listeningElement = parentElement.querySelector('.listening');
        var receivedElement = parentElement.querySelector('.received');

        listeningElement.setAttribute('style', 'display:none;');
        receivedElement.setAttribute('style', 'display:block;');

        console.log('Received Event: ' + id);
    }
};

app.initialize();

This also avoids issues such as InAppBrowser blank screen or how to remove toolbar from Cordova window.open in browser.

Posted by xpo6

Software developer in the realm of AI, NLP and black magic.