The Do Not Allow and Allow buttons are always displayed on the screen in the WP7 Facebook OAUTH browser

I developed a WP7 client that uses the Facebook C # SDK using OAUTH and a web browser.

Everything works fine, except on the page where the user is asked to accept / reject the access permissions that I ask, the "Do not allow" and "Allow" buttons are at the bottom of the browser screen, and it is not obvious that the user should scroll down to click on them.

I tried using all the different display modes (touch, wap, page, popup), and the "page" is the only one that shows the buttons on the same page, but then the fonts are tiny. I also tried different sizes to control the browser.

An example in the SDK has the same behavior.

Has anyone found a workaround for this?

+3
source share
2 answers

The solution I found is to use Javascript to change the CSS properties for an element:

private void FacebookLoginBrowser_Navigated(object sender, System.Windows.Navigation.NavigationEventArgs e)
{
        // check for when this approve page has been navigated to
        if (FacebookLoginBrowser.Source.AbsolutePath == "/connect/uiserver.php")
        {
            showBrowser();
            // do the script injection on the LoadCompleted event - doing it here will appear to work when you have a fast connection, but almost certainly fails over 3G because the elements aren't ready in time to be modified
            FacebookLoginBrowser.LoadCompleted += new System.Windows.Navigation.LoadCompletedEventHandler(FacebookLoginBrowser_LoadCompleted);
        }
        // etc ...
}

        void FacebookLoginBrowser_LoadCompleted(object sender, System.Windows.Navigation.NavigationEventArgs e)
{
    FacebookLoginBrowser.LoadCompleted -= FacebookLoginBrowser_LoadCompleted;
    // Facebook will likely change this and break our code soon, so make sure you  anticipates this
    try
    {
        FacebookLoginBrowser.InvokeScript("eval", "document.getElementById('platform_dialog_bottom_bar').style.position = 'relative';document.getElementById('platform_dialog_bottom_bar').style.top = '-60px';");
    }
    catch
    {
        // TODO: display instruction to scroll down if we ever end up here
    }
}

Hope this helps. Feel free to contact me if you have any problems.

+1
source

I have not tried this, but could you use the SizeF method for WebBrowser to change the zoom level of the page?

0
source

All Articles