Hi Everyone, I came across an unexpected behavior while trying to figure out another issue, I have a webview in landscape mode where I am loading a youtube video, I finally figured out how to get the player to cover the full screen.
The problem I just caught is that if I compile and run the application in regular Release Mode, the video will play fine and cover the full screen, I am using B4XPages, a page in portrait mode is shown at first with a button to start playing the video, then the orientation is forced to landscape mode and a panel with the webview is set to visible = true.
If I compile in Release (obfuscated) mode and I repeat the steps above the player will only cover half of the screen's width, Not sure what the difference is, but i've never seen this before.
This image shows the issue when compiling in Release (obfuscated) mode.
Here's the image when compiling in regular Release mode.
I mean WTH, is there something I am missing, below is my js script I am using to load the video on my webview.
Has anyone else seen this problem before?
The problem I just caught is that if I compile and run the application in regular Release Mode, the video will play fine and cover the full screen, I am using B4XPages, a page in portrait mode is shown at first with a button to start playing the video, then the orientation is forced to landscape mode and a panel with the webview is set to visible = true.
If I compile in Release (obfuscated) mode and I repeat the steps above the player will only cover half of the screen's width, Not sure what the difference is, but i've never seen this before.
This image shows the issue when compiling in Release (obfuscated) mode.
Here's the image when compiling in regular Release mode.
I mean WTH, is there something I am missing, below is my js script I am using to load the video on my webview.
JavaScript:
Dim html As String = $"<!DOCTYPE html>
<html style="height: 100%; margin: 0;">
<body>
<div id="player" style="height: 100%; width: 100%;"></div>
<script>
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
var player;
function onYouTubeIframeAPIReady() {
player = new YT.Player('player', {
height: '100%',
width: '100%',
videoId: '${videoID}',
playerVars: {
'autoplay': 0,
'mute': 0, // Start muted to bypass autoplay restriction
'controls': 1,
'playsinline': 1
},
events: {
'onReady': onPlayerReady
}
});
}
function onPlayerReady(event) {
// event.target.playVideo();
// setTimeout(function() {
// player.unMute(); // Unmute after 500 milliseconds
// }, 500);
B4X.CallSub("Player_Ready", true);
}
function playVideo() {
player.playVideo();
}
// This function will stop the video when called from B4X
function stopVideo() {
player.stopVideo();
}
function unMuteVideo() {
player.unMute();
}
function getPlayerDimensions() {
var playerElement = document.getElementById('player');
var height = playerElement.offsetHeight;
var width = playerElement.offsetWidth;
callB4aSub('Player_Dimensions', { Dimensions: [height, width] } )
}
function callB4aSub(b4xSubName, values) {
setTimeout(function() {
if (!values) {
return B4X.CallSub('CallB4xUiSub_Async', true, b4xSubName, "");
}
return B4X.CallSub('CallB4xUiSub_Async', true, b4xSubName, JSON.stringify(values));
}, 0);
}
</script>
</body>
</html>
"$Has anyone else seen this problem before?