I have created an app, in which whenever a user clicks on the Search button it should navigate to a url/website.
Here is the code for main.js
document.addEventListener("DOMContentLoaded", function(event) {
var session = new QiSession();
session.socket().on('connect', function () {
console.log("Connected!");
// Subscribe to the TabChosen/Name event
session.service("ALMemory").done(function(mem) {
mem.subscriber("TabChosen/Name").done(function (sub) {
sub.signal.connect(tabCallback);
});
});
}).on('disconnect', function () {
console.log("Disconnected");
});
function showWebviewURL(url) {
console.log("Showing webview with URL: ", url);
session.service("ALTabletService").done(function (tablet) {
tablet.ALTabletService::showWebview(url); // Use the showWebview method with URL
});
}
function showWebviewWithEncodedURL() {
var encodedURL = encodeURIComponent('https:www.google.com');
showWebviewURL(encodedURL);
}
function tabCallback(tab) {
console.log("A new tab has been selected:", tab);
// Handle tab selection as needed
}
// Other functions and event handlers...
});
and here is html file
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=1280, user-scalable=no" />
<script src="/libs/qi/2/qi.js"></script>
<script src="main.js"></script>
<link media="screen" href="styles.css" rel="stylesheet" type="text/css">
</head>
<body>
<nav class="nav">
<button id="welcome" class="tab_buttons" onclick="tabCallback('welcome')" style="width:100%" type="button">Welcome</button>
</nav>
<div class="row">
<div class="column">
<button id="PositionD" class="tab_buttons" onclick="showWebviewURL('https://www.google.com')" style="width:100%" type="button">Book Search</button>
</div>
<div class="column">
<!-- Encode the URL using JavaScript's encodeURIComponent() in the onclick attribute -->
<button id="ShowWebviewButton" class="tab_buttons" onclick="showWebviewWithEncodedURL()" style="width:100%" type="button">Book Search</button>
</div>
</div>
</body>
</html>
I have used ALTabletService::showWebview to open the provided url, but whenever the user clicks on that button - it shows a white screen. I am using NAOqi 2.5.
What can I do to display the given url/webpage?
I can spot a typo in the URL to Google. It should rather be
https://www.google.com.For custom URLs, it will depend on where it is hosted. Make sure it is hosted such as it is available to the tablet (listening on public IPs, on the same network...).