Skip to content

M
MBetterc
Commit 1e837e54 authored by Stefy Lanza (nextime / spora )'s avatar Stefy Lanza (nextime / spora )
Browse files
Options

results.html fixed

parent a39779c3
Show whitespace changes
Inline Side-by-side
Showing with 291 additions and 128 deletions
mbetterclient/qt_player/templates/results.html
View file @ 1e837e54
...@@ -4,7 +4,6 @@ ...@@ -4,7 +4,6 @@
<meta charset="utf-8"> <meta charset="utf-8">
<title>Results Overlay</title> <title>Results Overlay</title>
<script src="qrc:///qtwebchannel/qwebchannel.js"></script> <script src="qrc:///qtwebchannel/qwebchannel.js"></script>
<script src="overlay://overlay.js"></script>
<style> <style>
* { * {
margin: 0; margin: 0;
...@@ -745,7 +744,7 @@ ...@@ -745,7 +744,7 @@
<!-- Combined Result Display --> <!-- Combined Result Display -->
<div class="combined-result-display" id="combinedResultDisplay"> <div class="combined-result-display" id="combinedResultDisplay">
<div class="combined-result-text" id="combinedResultText"> <div class="combined-result-text" id="combinedResultText">
<span id="mainResult">WIN1</span> - <span id="underOverResult">UNDER</span> <span id="mainResult">WIN1</span>
</div> </div>
</div> </div>
...@@ -776,9 +775,250 @@ ...@@ -776,9 +775,250 @@
let lastPositionLogTime = 0; let lastPositionLogTime = 0;
const POSITION_LOG_THROTTLE_MS = 500; // Throttle position logs to max 1 per 500ms const POSITION_LOG_THROTTLE_MS = 500; // Throttle position logs to max 1 per 500ms
// Define showLoadingState for compatibility (results template doesn't use loading state) // Apply console.log override immediately with buffering
function showLoadingState() { (function() {
console.log('DEBUG: showLoadingState called (no-op for results template)'); var originalConsoleLog = console.log;
var messageBuffer = [];
console.log = function(...args) {
var message = args.map(String).join(' ');
if (window.overlay && window.overlay.log) {
window.overlay.log('[LOG] ' + message);
} else {
messageBuffer.push('[LOG] ' + message);
}
originalConsoleLog.apply(console, args);
};
// Function to flush buffer when overlay becomes available
window.flushConsoleBuffer = function() {
if (window.overlay && window.overlay.log) {
messageBuffer.forEach(function(msg) {
window.overlay.log(msg);
});
messageBuffer = [];
}
};
// Check periodically for overlay availability
var checkInterval = setInterval(function() {
if (window.overlay && window.overlay.log) {
window.flushConsoleBuffer();
clearInterval(checkInterval);
}
}, 50);
// Clear interval after 5 seconds to avoid infinite polling
setTimeout(function() {
clearInterval(checkInterval);
}, 5000);
})();
// Test console override
console.log('TEST: Console override applied and buffering');
// Debug timing helper
function getTimestamp() {
return new Date().toISOString();
}
function debugTime(label) {
const now = Date.now();
const elapsed = startTime ? ` (+${now - startTime}ms)` : '';
console.log(`🔍 DEBUG [${getTimestamp()}] ${label}${elapsed}`);
}
// WebChannel results data functions
async function fetchResultsData(retryCount = 0) {
const maxRetries = 10;
const baseDelay = 1000; // 1 second
try {
debugTime('Fetching results data via WebChannel');
// Check if WebChannel is available
if (!window.overlay || typeof window.overlay.getCurrentData !== 'function') {
console.log('DEBUG: WebChannel not ready, retrying...');
if (retryCount < maxRetries) {
const delay = baseDelay * Math.pow(2, retryCount);
console.log(`DEBUG: Retrying in ${delay}ms (attempt ${retryCount + 1}/${maxRetries + 1})`);
setTimeout(() => {
fetchResultsData(retryCount + 1);
}, delay);
} else {
console.log('DEBUG: Max retries reached, using fallback data');
debugTime('Max retries reached for WebChannel connection');
showFallbackResults();
}
return;
}
console.log('DEBUG: WebChannel available, calling getCurrentData()');
// Call WebChannel method to get current overlay data
const currentDataJson = await window.overlay.getCurrentData();
console.log('DEBUG: WebChannel response received');
console.log('DEBUG: Raw response =', currentDataJson);
let data;
try {
data = JSON.parse(currentDataJson);
console.log('DEBUG: WebChannel response JSON parsed successfully');
console.log('DEBUG: WebChannel response data =', data);
} catch (parseError) {
console.log('DEBUG: Failed to parse WebChannel response as JSON');
throw new Error(`JSON parse error: ${parseError.message}`);
}
debugTime('Results data received via WebChannel');
if (data && (data.outcome || data.result)) {
console.log('DEBUG: WebChannel returned results data');
updateOverlayData(data);
} else {
console.log('DEBUG: WebChannel response did not contain results data');
debugTime('No results data in WebChannel response');
// Keep checking for data
setTimeout(() => fetchResultsData(0), 1000);
}
} catch (error) {
console.log('DEBUG: Exception caught in fetchResultsData');
console.log('DEBUG: Error message =', error.message);
console.log('DEBUG: Error stack =', error.stack);
debugTime(`Failed to fetch results data: ${error.message}`);
// Check if we should retry
if (retryCount < maxRetries) {
// Calculate delay with exponential backoff
const delay = baseDelay * Math.pow(2, retryCount);
console.log(`DEBUG: Retrying in ${delay}ms (attempt ${retryCount + 2}/${maxRetries + 1})`);
setTimeout(() => {
fetchResultsData(retryCount + 1);
}, delay);
} else {
console.log('DEBUG: Max retries reached, using fallback data');
debugTime('Max retries reached for results data fetch');
// Show fallback data instead of error message
showFallbackResults();
}
}
}
// WebChannel configuration - no HTTP requests needed
let webChannelReady = false;
// Debug logging function that sends messages to Qt application logs
function debugLog(message, level = 'info') {
try {
// Try to send to Qt WebChannel if available
if (typeof qt !== 'undefined' && qt.webChannelTransport) {
// Send debug message to Qt application
if (window.sendDebugMessage) {
window.sendDebugMessage(`[RESULTS] ${message}`);
}
}
} catch (e) {
// Fallback to console if WebChannel not available - use original console to avoid recursion
originalConsoleLog(`[RESULTS FALLBACK] ${message}`);
}
// Always log to console as well for browser debugging - use original to avoid recursion
originalConsoleLog(`🔍 DEBUG: ${message}`);
}
// Store original console.log before overriding
const originalConsoleLog = console.log;
// Setup WebChannel communication
function setupWebChannel() {
// Check if WebChannel is already set up by overlay.js
if (window.overlay) {
console.log('🔍 DEBUG: WebChannel already set up by overlay.js');
// Test WebChannel
if (window.overlay && window.overlay.log) {
window.overlay.log('TEST: WebChannel connection successful');
}
// Listen for data updates from Python
if (window.overlay.dataUpdated) {
window.overlay.dataUpdated.connect(function(data) {
console.log('🔍 DEBUG: Received data update from Python:', data);
if (data && (data.outcome || data.result)) {
updateOverlayData(data);
}
});
}
// Connect positionChanged signal
if (window.overlay.positionChanged) {
window.overlay.positionChanged.connect(function(position, duration) {
if (position !== null && duration !== null) {
handlePositionChange(position, duration);
}
});
}
webChannelReady = true;
return;
}
// Fallback: setup WebChannel if overlay.js didn't do it
if (typeof qt !== 'undefined' && qt.webChannelTransport) {
try {
new QWebChannel(qt.webChannelTransport, function(channel) {
console.log('🔍 DEBUG: WebChannel connected successfully (fallback)');
// Connect to overlay object
window.overlay = channel.objects.overlay;
// Listen for data updates from Python
if (window.overlay && window.overlay.dataUpdated) {
window.overlay.dataUpdated.connect(function(data) {
console.log('🔍 DEBUG: Received data update from Python:', data);
if (data && (data.outcome || data.result)) {
updateOverlayData(data);
}
});
}
// Connect positionChanged signal
if (window.overlay && window.overlay.positionChanged) {
window.overlay.positionChanged.connect(function(position, duration) {
if (position !== null && duration !== null) {
handlePositionChange(position, duration);
}
});
}
webChannelReady = true;
console.log('🔍 DEBUG: WebChannel ready for results data');
});
} catch (e) {
console.log('🔍 DEBUG: Failed to setup WebChannel:', e);
}
} else {
console.log('🔍 DEBUG: WebChannel not available, will retry');
}
}
// Console override is now applied at the beginning of the script with buffering
// Show fallback results data when API is not available yet
function showFallbackResults() {
console.log('🔍 DEBUG: Showing fallback results data - API not available yet');
const fallbackData = {
outcome: 'WIN1',
under_over_result: 'OVER',
match: {
fighter1_township: 'Fallback Fighter 1',
fighter2_township: 'Fallback Fighter 2'
},
match_id: 1
};
console.log('🔍 DEBUG: Fallback results data loaded, processing');
updateOverlayData(fallbackData);
} }
// Outcome categories for styling // Outcome categories for styling
...@@ -861,9 +1101,9 @@ ...@@ -861,9 +1101,9 @@
prepareResultsAnimation(); prepareResultsAnimation();
} else { } else {
console.log('RESULTS TEMPLATE: No valid data received, showing loading state'); console.log('RESULTS TEMPLATE: No valid data received, will retry fetching');
// No valid data, show loading state // Keep trying to fetch data
showLoadingState(); setTimeout(() => fetchResultsData(0), 1000);
} }
} }
...@@ -1006,22 +1246,10 @@ ...@@ -1006,22 +1246,10 @@
// Update combined result display // Update combined result display
function updateCombinedResultDisplay() { function updateCombinedResultDisplay() {
const mainResultSpan = document.getElementById('mainResult'); const mainResultSpan = document.getElementById('mainResult');
const underOverSpan = document.getElementById('underOverResult');
const combinedDisplay = document.getElementById('combinedResultDisplay'); const combinedDisplay = document.getElementById('combinedResultDisplay');
if (currentMainResult || currentUnderOverResult) {
if (currentMainResult) { if (currentMainResult) {
mainResultSpan.textContent = currentMainResult; mainResultSpan.textContent = currentMainResult;
} else {
mainResultSpan.textContent = '';
}
if (currentUnderOverResult) {
underOverSpan.textContent = currentUnderOverResult;
} else {
underOverSpan.textContent = '';
}
combinedDisplay.style.display = 'block'; combinedDisplay.style.display = 'block';
} else { } else {
combinedDisplay.style.display = 'none'; combinedDisplay.style.display = 'none';
...@@ -1103,107 +1331,42 @@ ...@@ -1103,107 +1331,42 @@
} }
} }
// Request current data from backend (now handled by WebChannel signals)
function requestCurrentData() {
console.log('RESULTS TEMPLATE: requestCurrentData called - data is received via WebChannel signals');
// Data is handled by dataUpdated signal connection, no need to manually request
}
// Initialize when DOM is loaded // Initialize when DOM is loaded
document.addEventListener('DOMContentLoaded', function() { document.addEventListener('DOMContentLoaded', function() {
console.log('RESULTS TEMPLATE: DOM loaded and initialized'); startTime = Date.now();
console.log('RESULTS TEMPLATE: sessionStorage available:', typeof sessionStorage !== 'undefined'); debugTime('DOM Content Loaded - Starting results overlay initialization');
// Setup WebChannel communication (includes data polling) // Setup WebChannel first
setupWebChannel(); setupWebChannel();
// Panel and content will be shown after 5 seconds when video starts playing // Show initial state
console.log('RESULTS TEMPLATE: Waiting for results data to be received via WebChannel signals'); console.log('RESULTS TEMPLATE: DOM loaded, starting data fetch');
// Fallback: show test results after 5 seconds if no data received via signals // Wait briefly for WebChannel to connect
setTimeout(() => { setTimeout(() => {
if (!contentVisible) { console.log('🔍 DEBUG: Starting results data fetch via WebChannel');
console.log('RESULTS TEMPLATE: Fallback - No data received after 5 seconds, showing test results');
// Set test data
currentMainResult = 'WIN1';
currentUnderOverResult = 'OVER';
currentMatch = { fighter1_township: 'Test Fighter 1', fighter2_township: 'Test Fighter 2' };
winningOutcomes = [
{ outcome: 'WIN1', amount: 100.00 },
{ outcome: 'OVER', amount: 50.00 }
];
contentVisible = true;
showResultsPanel();
showResultsContent();
updateFightersDisplay();
updateCombinedResultDisplay();
updateWinningBetsDisplay();
}
}, 5000);
});
// Setup WebChannel communication (wait for overlay.js to set up WebChannel) // Fetch results data via WebChannel
function setupWebChannel() { debugTime('Fetching results data via WebChannel');
console.log('RESULTS TEMPLATE: Waiting for overlay.js WebChannel to be ready...'); fetchResultsData();
// Set up global callback for dataUpdated signal (called by overlay.js) // Set up periodic refresh every 30 seconds
window.onDataUpdated = function(data) { setInterval(() => {
console.log('RESULTS TEMPLATE: onDataUpdated callback called with:', data); debugTime('Periodic refresh: fetching updated results data');
if (data !== null && data !== undefined) { fetchResultsData(0); // Start with retry count 0 for periodic refreshes
updateOverlayData(data); }, 30000);
} else {
console.warn('RESULTS TEMPLATE: onDataUpdated callback received null/undefined data');
}
};
// Wait for overlay.js to set up the WebChannel and overlay object // Show fallback if no data after 5 seconds total
const checkOverlayReady = () => { setTimeout(() => {
if (window.overlay && window.overlayManager && window.overlayManager.webChannelReady) { if (!contentVisible) {
console.log('RESULTS TEMPLATE: overlay.js WebChannel ready'); debugTime('No data received after 5 seconds - showing fallback');
showFallbackResults();
// Connect positionChanged signal if available
if (window.overlay.positionChanged) {
console.log('RESULTS TEMPLATE: Connecting positionChanged signal');
window.overlay.positionChanged.connect(function(position, duration) {
if (position !== null && duration !== null) {
handlePositionChange(position, duration);
} else { } else {
console.warn('RESULTS TEMPLATE: positionChanged signal received null/undefined parameters'); debugTime('Data was received before 5 second timeout');
} }
}, 5000);
}, 50); // Wait 50ms for WebChannel setup
}); });
}
// Try to get current data immediately when WebChannel is ready
console.log('RESULTS TEMPLATE: Attempting to get current data from WebChannel');
try {
if (window.overlay && window.overlay.getCurrentData) {
const currentDataJson = window.overlay.getCurrentData();
console.log('RESULTS TEMPLATE: Got current data JSON:', currentDataJson);
if (currentDataJson) {
const currentData = JSON.parse(currentDataJson);
console.log('RESULTS TEMPLATE: Parsed current data:', currentData);
if (currentData && (currentData.outcome || currentData.result)) {
console.log('RESULTS TEMPLATE: Found valid data in current data, processing');
updateOverlayData(currentData);
} else {
console.log('RESULTS TEMPLATE: No valid result data in current data');
}
}
}
} catch (error) {
console.error('RESULTS TEMPLATE: Failed to get current data:', error);
}
console.log('RESULTS TEMPLATE: WebChannel setup completed, signals connected');
} else {
// Keep checking until overlay.js has set up the WebChannel
setTimeout(checkOverlayReady, 50);
}
};
checkOverlayReady();
}
// Export functions for external use // Export functions for external use
window.setOutcome = setOutcome; window.setOutcome = setOutcome;
...@@ -1211,15 +1374,15 @@ ...@@ -1211,15 +1374,15 @@
</script> </script>
<!-- <!--
IMPORTANT: When creating or editing custom templates, always maintain these script tags: IMPORTANT: When creating or editing custom templates, always maintain this script tag:
1. qrc:///qtwebchannel/qwebchannel.js - Required for Qt WebChannel communication 1. qrc:///qtwebchannel/qwebchannel.js - Required for Qt WebChannel communication
2. overlay://overlay.js - Required for overlay functionality and data updates
These scripts enable communication between the Qt application and the overlay template. This script enables communication between the Qt application and the overlay template.
The results.html template uses overlay.js for WebChannel setup and adds custom dataUpdated signal handling. The results.html template uses inline WebChannel setup with client-initiated data fetching,
similar to fixtures.html, and includes custom dataUpdated signal handling.
NOTE: When editing this template, never remove these script sources! NOTE: When editing this template, never remove the qrc:///qtwebchannel/qwebchannel.js script source!
The overlay:// custom scheme ensures JavaScript files work for both built-in and uploaded templates. The template implements its own WebChannel setup and data polling mechanism.
--> -->
</body> </body>
</html> </html>
\ No newline at end of file
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