CB-7697 Add locationBar support to InAppBrowser windows platform version

src/windows/InAppBrowserProxy.js

@@ -29,7 +29,12 @@ var cordova = require('cordova'),
     urlutil = require('cordova/urlutil');
 
 var browserWrap,
-    popup;
+    popup,
+    navigationButtonsDiv,
+    navigationButtonsDivInner,
+    backButton,
+    forwardButton,
+    closeButton;
 
 // x-ms-webview is available starting from Windows 8.1 (platformId is 'windows')
 // http://msdn.microsoft.com/en-us/library/windows/apps/dn301831.aspx
@@ -40,14 +45,23 @@ function attachNavigationEvents(element, callback) {
         element.addEventListener("MSWebViewNavigationStarting", function (e) {
             callback({ type: "loadstart", url: e.uri}, {keepCallback: true} );
         });
+
         element.addEventListener("MSWebViewNavigationCompleted", function (e) {
             callback({ type: e.isSuccess ? "loadstop" : "loaderror", url: e.uri}, {keepCallback: true});
         });
+
         element.addEventListener("MSWebViewUnviewableContentIdentified", function (e) {
             // WebView found the content to be not HTML.
             // http://msdn.microsoft.com/en-us/library/windows/apps/dn609716.aspx
             callback({ type: "loaderror", url: e.uri}, {keepCallback: true});
         });
+
+        element.addEventListener("MSWebViewContentLoading", function (e) {
+            if (navigationButtonsDiv) {
+                backButton.disabled = !popup.canGoBack;
+                forwardButton.disabled = !popup.canGoForward;
+            }
+        });
     } else {
         var onError = function () {
             callback({ type: "loaderror", url: this.contentWindow.location}, {keepCallback: true});
@@ -56,6 +70,7 @@ function attachNavigationEvents(element, callback) {
         element.addEventListener("unload", function () {
             callback({ type: "loadstart", url: this.contentWindow.location}, {keepCallback: true});
         });
+
         element.addEventListener("load", function () {
             callback({ type: "loadstop", url: this.contentWindow.location}, {keepCallback: true});
         });
@@ -118,7 +133,83 @@ var IAB = {
             popup = document.createElement(isWebViewAvailable ? "x-ms-webview" : "iframe");
             popup.style.borderWidth = "0px";
             popup.style.width = "100%";
-            popup.style.height = "100%";
+
+            browserWrap.appendChild(popup);
+
+            if (features.indexOf("location=yes") !== -1 || features.indexOf("location") === -1) {
+                popup.style.height = "calc(100% - 60px)";
+
+                navigationButtonsDiv = document.createElement("div");
+                navigationButtonsDiv.style.height = "60px";
+                navigationButtonsDiv.style.backgroundColor = "#404040";
+                navigationButtonsDiv.style.zIndex = "999";
+                navigationButtonsDiv.onclick = function (e) {
+                    e.cancelBubble = true;
+                };
+
+                navigationButtonsDivInner = document.createElement("div");
+                navigationButtonsDivInner.style.paddingTop = "10px";
+                navigationButtonsDivInner.style.height = "50px";
+                navigationButtonsDivInner.style.width = "160px";
+                navigationButtonsDivInner.style.margin = "0 auto";
+                navigationButtonsDivInner.style.backgroundColor = "#404040";
+                navigationButtonsDivInner.style.zIndex = "999";
+                navigationButtonsDivInner.onclick = function (e) {
+                    e.cancelBubble = true;
+                };
+
+
+                backButton = document.createElement("button");
+                backButton.style.width = "40px";
+                backButton.style.height = "40px";
+                backButton.style.borderRadius = "40px";
+
+                backButton.innerText = "<-";
+                backButton.addEventListener("click", function (e) {
+                    if (popup.canGoBack)
+                        popup.goBack();
+                });
+
+                forwardButton = document.createElement("button");
+                forwardButton.style.marginLeft = "20px";
+                forwardButton.style.width = "40px";
+                forwardButton.style.height = "40px";
+                forwardButton.style.borderRadius = "40px";
+
+                forwardButton.innerText = "->";
+                forwardButton.addEventListener("click", function (e) {
+                    if (popup.canGoForward)
+                        popup.goForward();
+                });
+
+                closeButton = document.createElement("button");
+                closeButton.style.marginLeft = "20px";
+                closeButton.style.width = "40px";
+                closeButton.style.height = "40px";
+                closeButton.style.borderRadius = "40px";
+
+                closeButton.innerText = "x";
+                closeButton.addEventListener("click", function (e) {
+                    setTimeout(function () {
+                        IAB.close();
+                    }, 0);
+                });
+               
+                if (!isWebViewAvailable) {
+                    // iframe navigation is not yet supported
+                    backButton.disabled = true;
+                    forwardButton.disabled = true;
+                }
+
+                navigationButtonsDivInner.appendChild(backButton);
+                navigationButtonsDivInner.appendChild(forwardButton);
+                navigationButtonsDivInner.appendChild(closeButton);
+                navigationButtonsDiv.appendChild(navigationButtonsDivInner);
+
+                browserWrap.appendChild(navigationButtonsDiv);
+            } else {
+                popup.style.height = "100%";
+            }
 
             // start listening for navigation events
             attachNavigationEvents(popup, win);
@@ -127,8 +218,6 @@ var IAB = {
                 strUrl = strUrl.replace("ms-appx://", "ms-appx-web://");
             }
             popup.src = strUrl;
-
-            browserWrap.appendChild(popup);
         }
     },