Web Browser example

The index.html file containing JavaScript that makes use of the Web Browser API functionality is listed below.

<!DOCTYPE html>
<html manifest="manifest.appcache">
  <head>
    <title>Browser API sample usage</title>
    <link rel="x-antenna-managed-webapp-descriptor" href="webapp-descriptor.xml" />

    <script type="text/javascript">

    function printText(str) {
      var d = document.getElementById('text-box');
      d.appendChild(document.createTextNode(str));
      d.appendChild(document.createElement('br'));
      d.scrollTop = d.scrollHeight;
    }

    function addL() {
      printText("Browser Listener Added");
      var callback = {
        onLoadFinished: function (url) {
          printText("Finished loading "+url);
        },
        onLoadStarted: function (url) {
          printText("Started loading "+url);
        },
        onClosed: function (url) {
          printText("Closed  "+url);
        },
        onLoadFailure: function (url, error) {
          printText("Failure loading "+url +"/n Error: "+error.description);
        }
      };
      launchbox.Browser.addListener(callback);
    }

    function openPage() {
      var external;
        var page_choice = document.getElementsByName('page_choice');
          for ( var i = 0; i < page_choice.length; i++) {
            if(page_choice[i].checked) {
              external = page_choice[i].value;
              break;
            }
          }

      window.launchbox.Browser.start("http://websitetips.com/articles/copy/lorem/ipsum.txt", {'external':Boolean(external)});
    }

    function clearOutput(){
      var d = document.getElementById('text-box');         
      d.innerHTML = "";
    }

    </script>
  </head>

  <body>
    <header>
      <h3>AMP Hybrid Client <span>Browser API test</span>
      </h3>
    </header>
    <input type="button" onclick="addL();" value="Register a listener"/>

    <input type="button" onclick="openPage();" value="Open test page"/>

    <p>Internal <input type="radio" name="page_choice" value="" checked="checked"/></p>

    <p>External (in browser)<input type="radio" name="page_choice" value="1"/></p>

    <input type="button" onclick="clearOutput();" value="clear"/>
    <div id="text-box"></div>
  </body>
</html>

The contents of the cache manifest file called manifest.appcache for this application are listed below:

CACHE MANIFEST

CACHE:
index.html

NETWORK:
*

The webapp-descriptor.xml file for this application is defined in the following way:

<?xml version="1.0" encoding="UTF-8"?>
<webapp-descriptor xmlns="http://www.pega.com/application-hosting/
web-app-descriptor/2.0">
    <id>com.pega.sample.WebBrowser</id>
    <version>1.0.0</version>
    <name>Sample Web Browser api usage</name>
</webapp-descriptor>

Web Browser

Web Browser example

Related topics