Using Browserfield.displayContent with that has an external url

Question

I am trying to create a screen for a blackberry 5.0+ app that has a banner at the top and then a Browserfield underneath that views an external site. The banner is hosted on one site and the content for the BrowserField is hosted on another.

Originally I tried using 2 BrowserFields but had issues when several devices did not display the banner and only showed the content underneath. Furthermore when another screen with the same setup was displayed the app would crash with an IllegalStateException. I did a bit of research and it seems that BrowserField seems to have some trouble when several instances of it exist at once.

So in order to get around this issue I have combined both BrowserFields into one, using the frame tag in html, with the hopes of displaying the Banner ad in the first frame and the content underneath in the second frame.

The html I made works in a normal browser:

<!DOCTYPE html>
<html>
      <frameset rows="10%,90%">
             <frame scrolling="no" src="http://4.bp.blogspot.com/_CZ1HhhanNgc/TI0xscVLW8I/AAAAAAAABps/sfeO4E3234k/s1600/head-mp-700x88.jpg" noresize="noresize" frameborder="0">
              <frame src="http://www.penny-arcade.com"  frameborder="0">
      </frameset>
</html>

What I am doing is reading the html in as text, removing the \n and \rs and then putting it in the following method: browserField.displayContent(html,"http://localhost");

This method is supposed to display the html in the browser, but instead on the simulator I get this:

enter image description here

On the device I get a blank screen. I don't know whats going on with the displayContent() method, so I would assume that it doesn't allow external sites? I don't really know what my options are from this point on. Is there some kind of fix for this, some library that I can use or some other way to implement this?

Edit:

So @Nate suggested a change to the DOCTYPE tag, and posted a screenshot of the html working. However I did this and I still get the same results, so I am going to post the code I'm using to make the screen. Here it is:

public final class MyScreen extends MainScreen
{
   /**
    * Creates a new MyScreen object
    */
   private BrowserField browserField;
   public MyScreen()
   {        
        // Set the displayed title of the screen       
        setTitle("MyTitle");
        BrowserFieldConfig config = new BrowserFieldConfig();
    config.setProperty(BrowserFieldConfig.VIEWPORT_WIDTH, new   Integer(Display.getWidth()));
        config.setProperty(BrowserFieldConfig.NAVIGATION_MODE,
    BrowserFieldConfig.NAVIGATION_MODE_POINTER);

    config.setProperty(BrowserFieldConfig.INITIAL_SCALE, new Float(1.0));

    config.setProperty(BrowserFieldConfig.USER_SCALABLE, Boolean.FALSE);

    //supposed to prevent InvalidStateException from refreshing sometimes
    ProtocolController eventsProtocolController = new ProtocolController(browserField)
    {
      public void handleNavigationRequest(BrowserFieldRequest request) throws Exception
      {
        browserField.setFocus();
        super.handleNavigationRequest(request);
      }
   };

   config.setProperty(BrowserFieldConfig.CONTROLLER, eventsProtocolController);
   browserField = new BrowserField(config);

    
   try
   {
      String embeddedLinkFrame = readTextFile("frame.html");
      browserField.displayContent(embeddedLinkFrame, "http://localhost");
   }
   catch (Exception e)
   {
      System.out.println(e.getMessage());
   }
   add(browserField);
   }

   public String readTextFile(String fName) 
   {
     String result = null;
    
     DataInputStream is = null;
     try  
         {
      is = new DataInputStream(getClass().getResourceAsStream("/" + fName));
               byte[] data = IOUtilities.streamToBytes(is);
       result = new String(data);
     } 
     catch (IOException e) 
     {
           System.out.println(e.getMessage());
     } 
     finally 
         {
      try 
              {
          if (null != is)
                      is.close();
     
       } 
               catch (IOException e) 
               {
            System.out.println(e.getMessage());
       }
     }
      return result;
 }
 }

score 2 · Accepted Answer · edited Jun 20 '20 at 09:12

Ok, my apologies for the first answer. I think DOCTYPE was a red herring (but I didn't have your Java code at the time).

I see a few potential problems:

Network Connectivity

First, as is always the case, make sure you have network connectivity for your device, or simulator. That may include the MDS simulator running. You can always test connectivity with the normal Browser app, checking a website you know to be running. I believe that if you have a total lack of connectivity (i.e. network disabled), then you will get your frames showing just the text / URLs. However, I believe it will also have something like this:

Could not select proper Transport Descriptor for: http://www.penny-arcade.com

instead of showing null, as you show.

Adding BrowserField

Next, I think there is a problem with you asking the browser field to display content before you've added the field. Simply switch the order of those two lines of code to this:

   add(browserField);

   try
   {
      String embeddedLinkFrame = readTextFile("frame.html");
      browserField.displayContent(embeddedLinkFrame, "http://localhost");
   }
   catch (Exception e)
   {
      System.out.println(e.getMessage());
   }

I believe the behaviour if you have these lines out of order, however, is just to get a blank browser field.

Viewport Properties

Lastly, I would not recommend setting page properties programmatically, as you've done. Although this is not going to keep your page from displaying, I'd recommend putting those properties in HTML meta elements:

<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"> 
</head>

Source: BlackBerry.com

Update: Protocol Controller

Unfortunately, my simulator is acting up, and declining to support hot-swap right now. So, it's hard for me to run many times, and collect decisive results. But, it looks to me like removing your ProtocolController object prevents this problem from happening for me. (maybe you can clarify why you're using the protocol controller in this situation?). If this answer was a motivation, you might look carefully at the poster's full comments about it's usefulness.

Neither of these 3 suggestions worked. The network is definitely running because I tried it on device (where some of my other apps load their browserfields fine). I reversed the add(browserField); and browserField.displayContent() to no avail. I removed the page properties from the code and placed the meta tag as suggested. Were you able to get the browserfield to work? — Jason Ridge, May 22 '13 at 13:46
Yes, I did run it. I assume you're asking if I was able to get your code to work? If you're still having problems, I need to know **exactly** what your configuration is. It would be better to start with the simulator, because that's easier for me to replicate. So, what device / simulator? 9550? Which OS version? Are you running with the MDS simulator? On your device / simulator, are cellular and WiFi networks both enabled? Can you browse with the normal **Browser** app to both of those links before running your app? Are you always seeing the screenshot, or sometimes just blank? — Nate, May 22 '13 at 22:42
Great got it to work. Could have sworn that I tried taking that out... Thank you so much for the help! — Jason Ridge, May 23 '13 at 06:54