I tried to do this with WebView:
- I load into my app an html file that contains the following code:
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
#player {pointer-events: none}
</style>
</head>
<body>
<script>
var player;
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
function onYouTubeIframeAPIReady() {
player = new YT.Player('player', {
height: '175',
width: '300',
videoId: 'GnYaxuGcpyE',
playerVars: {
'autoplay': 0,
'mute': 0,
'controls': 0,
},
events: {
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange
}
});
}
function onPlayerReady(event) {
event.target.playVideo();
}
function stopVideo() {
player.stopVideo();
}
function onPlayerStateChange() {
}
function pause() {
var state = player.getPlayerState();
if (state === 2) {
player.playVideo();
document.getElementById("playPause").innerText = "Pausa"
} else if (state === 1) {
player.pauseVideo();
document.getElementById("playPause").innerText = "Play"
}
}
function changeVideo(videoId){
player.loadVideoById(videoId)
}
function visualizza_pausa(){
document.getElementById('pausa').style.visibility = 'visible';
}
function visualizza_play(){
document.getElementById('play').style.visibility = 'visible';
}
function nascondi_pausa(){
document.getElementById('pausa').style.visibility = 'hidden';
}
function nascondi_play(){
document.getElementById('play').style.visibility = 'hidden';
}
</script>
<button id="pausa" onclick="player.pauseVideo();nascondi_pausa();visualizza_play()">
Pausa
</button>
<button id="play" onclick="player.playVideo();nascondi_play();visualizza_pausa();">
Play
</button>
<div id="player"></div>
</body>
</html>
this file :
a) embed youtube video,
b) inhibits the play / pause by pressing on the video itself
c) has two buttons outside the video for play and pause!
2) when this file is launched on my PC, or on web site (http://ricorda.altervista.org/segnAAudio/webviewstring.html) it works PERFECTLY!
3) when I upload the file to the app media and view it with WebViewer, the buttons (play and pause) DO NOT work !!
it starts to work ONLY if I DO NOT inhibit the play and pause on the click of the video itself by removing the following code from the page:
<head>
<style type="text/css">
#player {pointer-events: none}
</style>
</head>
ONLY in this way after having given the FIRST PLAY by pressing on the video, the external buttons start to work! but if the click on the video is blocked everything remains stationary and not working!
does anyone know how this problem can be solved ??
grazie
