Phonegap build - Open external page in InAppBrowser or childbrowser with no toolbar and close it?

Question

1. I want to open an external page in the InAppBrowser or childbrowser, where I don't show any toolbar and where I can have a button in my externalpage that closes the browser and returns to the app from where I opened the browser. So how to close when you don ́t have a DONE button? I have seen that if I have var ref = window.open(encodeURI(url), '_self', 'location=yes'); then it is possible to close the browser with ref.close(); but if I use that in the externalpage that I opened it doesn't work, it is not closing the browser?

2. Is there any way to autorotate any of them if I have set the orientation to portrait in the config file? I know that you can autorotate the child browser if you do it manually, not through the build service. Or do I have to set the orientation to both?

3. I have tested all different ways to open the ChildBrowser and the InAppBrowser and I cant really see any big difference between them? Can the InAppBrowser use native feature wile the ChildBrowser can't or?

Tulatulip

Answer 1

OK, problem 1 to close is solved. This is what I use to open an external page in the InAppBrowser. From the page that I load in the InAppBrowser, I can close the InAppBrowser itself, returning to my app from where I opened the browser.

Create a page on your server - closeInAppBrowser.html that is just an empty html page, it doesn´t do anything

I open the browser with this:

<a href="#" onclick="openInAppBrowserBlank('http://www.mypage.asp?userId=1');">open InAppBrowser</a>

var ref = null;
function openInAppBrowserBlank(url)
{
    try {
ref = window.open(encodeURI(url),'_blank','location=no'); //encode is needed if you want to send a variable with your link if not you can use ref = window.open(url,'_blank','location=no');
         ref.addEventListener('loadstop', LoadStop);
         ref.addEventListener('exit', Close);
    }
    catch (err)    
    {
        alert(err);
    }
}
function LoadStop(event) {
         if(event.url == "http://www.mypage.com/closeInAppBrowser.html"){
            // alert("fun load stop runs");
             ref.close();
         }    
    }
function Close(event) {
         ref.removeEventListener('loadstop', LoadStop);
         ref.removeEventListener('exit', Close);
    } 

And to close the InAppBrowser from the page that I opened in the browser(http://www.mypage.asp) I have a button-link like this.

<a href="http://www.mypage.com/closeInAppBrowser.html"></a>

I hope it helps somebody else!

Tulatulip

Here's the answer to #2, it appears to be "No". community.phonegap.com/nitobi/topics/… – Engrain

This closes the browser but also causes the hardware back button on Android to do same. Is there a way to preserve the back button's default functionality? – Knight

Answer 2

Here's a simpler solution that may help someone.

// open win and turn off location 
var ref = window.open('http://myloginapp.com', '_blank', 'location=no');

// attach listener to loadstart
ref.addEventListener('loadstart', function(event) { 
    var urlSuccessPage = "http://myloginapp/success/";
    if (event.url == urlSuccessPage) {
    ref.close();    
    }
});

Engrain

Thanks a lot. Maybe would be good to add the comment that the close button in the inapp browser should be an anchor tag with href="myloginapp/success". But worked like a charm – Koralie