trying to make it works

parent d4927b64
......@@ -2151,6 +2151,7 @@ class WebPlayerWindow(QMainWindow):
this.transport = transport;
this.objects = {};
this.execCallbacks = {};
this.signalHandlers = {}; // Store signal handlers
// Setup transport
if (transport) {
......@@ -2176,8 +2177,12 @@ class WebPlayerWindow(QMainWindow):
var signalName = data.signal;
var args = data.args;
if (this.objects[objectName] && this.objects[objectName][signalName]) {
this.objects[objectName][signalName].apply(this.objects[objectName], args);
// Check if we have handlers for this signal
var signalKey = objectName + '.' + signalName;
if (this.signalHandlers[signalKey]) {
for (var i = 0; i < this.signalHandlers[signalKey].length; i++) {
this.signalHandlers[signalKey][i].apply(null, args);
}
}
}
} catch (e) {
......@@ -2200,6 +2205,15 @@ class WebPlayerWindow(QMainWindow):
this.transport.postMessage(JSON.stringify(message));
};
// Add connect method for signal handling
QWebChannel.prototype.connect = function(objectName, signalName, callback) {
var signalKey = objectName + '.' + signalName;
if (!this.signalHandlers[signalKey]) {
this.signalHandlers[signalKey] = [];
}
this.signalHandlers[signalKey].push(callback);
};
return QWebChannel;
})();
......@@ -2229,14 +2243,14 @@ class WebPlayerWindow(QMainWindow):
// Set up data update handler
if (window.updateOverlayData) {
window.overlay.dataUpdated.connect(function(data) {
channel.connect('overlay', 'dataUpdated', function(data) {
window.updateOverlayData(data);
});
}
// Set up video play handler
if (window.playVideo) {
window.overlay.playVideo.connect(function(filePath) {
channel.connect('overlay', 'playVideo', function(filePath) {
console.log('WebChannel playVideo signal received:', filePath);
window.playVideo(filePath);
});
......@@ -2244,7 +2258,7 @@ class WebPlayerWindow(QMainWindow):
// Set up overlay data update handler
if (window.updateOverlayData) {
window.overlay.updateOverlayData.connect(function(data) {
channel.connect('overlay', 'updateOverlayData', function(data) {
console.log('WebChannel updateOverlayData signal received:', data);
window.updateOverlayData(data);
});
......
......@@ -39,6 +39,11 @@
background: black;
visibility: visible !important; /* Ensure video is visible */
opacity: 1 !important; /* Ensure video is not transparent */
display: block !important; /* Ensure video is displayed */
position: absolute !important; /* Ensure proper positioning */
top: 0 !important;
left: 0 !important;
z-index: 100 !important; /* Ensure video is above background */
}
/* Overlay container */
......@@ -266,7 +271,7 @@
<body>
<!-- Video container -->
<div class="video-container">
<video id="webVideoPlayer" controls playsinline muted>
<video id="webVideoPlayer" playsinline muted autoplay>
<source src="" type="video/mp4">
Your browser does not support the video tag.
</video>
......
......@@ -164,6 +164,35 @@ class WebPlayerAPI {
console.log('Playing video:', filePath);
this.currentVideoPath = filePath;
// CRITICAL FIX: Ensure video element is always visible and properly configured
// This fixes the grey background issue
this.videoElement.style.display = 'block';
this.videoElement.style.visibility = 'visible';
this.videoElement.style.opacity = '1';
this.videoElement.style.width = '100%';
this.videoElement.style.height = '100%';
this.videoElement.style.objectFit = 'contain';
this.videoElement.style.backgroundColor = 'black';
this.videoElement.style.position = 'absolute';
this.videoElement.style.top = '0';
this.videoElement.style.left = '0';
this.videoElement.style.zIndex = '100';
// Force video container to be visible
const videoContainer = document.querySelector('.video-container');
if (videoContainer) {
videoContainer.style.display = 'block';
videoContainer.style.visibility = 'visible';
videoContainer.style.opacity = '1';
videoContainer.style.zIndex = '100';
videoContainer.style.backgroundColor = 'black';
videoContainer.style.position = 'absolute';
videoContainer.style.top = '0';
videoContainer.style.left = '0';
videoContainer.style.width = '100%';
videoContainer.style.height = '100%';
}
// Set video source and load
this.videoElement.src = filePath;
......@@ -191,26 +220,6 @@ class WebPlayerAPI {
console.log('Video readyState:', this.videoElement.readyState);
console.log('Video networkState:', this.videoElement.networkState);
console.log('Video error:', this.videoElement.error);
// For debug mode, ensure video is visible and properly sized
if (window.location.href.includes('debug') || window.location.href.includes('debug-player')) {
console.log('DEBUG MODE: Ensuring video visibility');
this.videoElement.style.display = 'block';
this.videoElement.style.visibility = 'visible';
this.videoElement.style.opacity = '1';
this.videoElement.style.width = '100%';
this.videoElement.style.height = '100%';
this.videoElement.style.objectFit = 'contain';
// Force video element to be visible in debug mode
const videoContainer = document.querySelector('.video-container');
if (videoContainer) {
videoContainer.style.display = 'block';
videoContainer.style.visibility = 'visible';
videoContainer.style.opacity = '1';
videoContainer.style.zIndex = '100';
}
}
}
// Attempt playback with autoplay policy handling
......@@ -221,13 +230,13 @@ class WebPlayerAPI {
if (this.videoElement.readyState >= HTMLMediaElement.HAVE_FUTURE_DATA) {
console.log('Video ready, attempting playback...');
// For debug mode, ensure video is visible before attempting playback
if (window.location.href.includes('debug') || window.location.href.includes('debug-player')) {
console.log('DEBUG MODE: Ensuring video is visible before playback');
this.videoElement.style.display = 'block';
this.videoElement.style.visibility = 'visible';
this.videoElement.style.opacity = '1';
}
// CRITICAL FIX: Always ensure video is visible before playback
this.videoElement.style.display = 'block';
this.videoElement.style.visibility = 'visible';
this.videoElement.style.opacity = '1';
// CRITICAL FIX: Set muted to true to allow autoplay in modern browsers
this.videoElement.muted = true;
// Try to play with autoplay policy handling
this.videoElement.play().then(() => {
......@@ -243,13 +252,10 @@ class WebPlayerAPI {
this.videoElement.controls = true;
this.videoElement.muted = true; // Muted videos can often autoplay
// For debug mode, ensure video is visible even if autoplay fails
if (window.location.href.includes('debug') || window.location.href.includes('debug-player')) {
console.log('DEBUG MODE: Forcing video visibility despite autoplay block');
this.videoElement.style.display = 'block';
this.videoElement.style.visibility = 'visible';
this.videoElement.style.opacity = '1';
}
// CRITICAL FIX: Always ensure video is visible even if autoplay fails
this.videoElement.style.display = 'block';
this.videoElement.style.visibility = 'visible';
this.videoElement.style.opacity = '1';
// Try again with muted
this.videoElement.play().catch(e2 => {
......@@ -259,13 +265,11 @@ class WebPlayerAPI {
});
} else {
console.log('Video not ready yet, waiting for more data...');
// For debug mode, ensure video is visible even while waiting
if (window.location.href.includes('debug') || window.location.href.includes('debug-player')) {
console.log('DEBUG MODE: Ensuring video is visible while waiting for data');
this.videoElement.style.display = 'block';
this.videoElement.style.visibility = 'visible';
this.videoElement.style.opacity = '1';
}
// CRITICAL FIX: Always ensure video is visible even while waiting
this.videoElement.style.display = 'block';
this.videoElement.style.visibility = 'visible';
this.videoElement.style.opacity = '1';
}
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment