Compare commits
2 Commits
2026.01.24
...
2026.01.24
| Author | SHA1 | Date | |
|---|---|---|---|
| 59df695530 | |||
| 03b6e5d70f |
@@ -7016,7 +7016,8 @@ class TWP_Admin {
|
|||||||
<div class="phone-interface">
|
<div class="phone-interface">
|
||||||
<div class="phone-display">
|
<div class="phone-display">
|
||||||
<div id="phone-status">Ready</div>
|
<div id="phone-status">Ready</div>
|
||||||
<div id="device-connection-status" style="font-size: 12px; color: #999; margin-top: 5px;">Connecting...</div>
|
<div id="device-connection-status" style="font-size: 12px; color: #999; margin-top: 5px;">Loading...</div>
|
||||||
|
<div id="twp-debug-info" style="font-size: 10px; color: #666; margin-top: 3px;"></div>
|
||||||
<div id="phone-number-display"></div>
|
<div id="phone-number-display"></div>
|
||||||
<div id="call-timer" style="display: none;">00:00</div>
|
<div id="call-timer" style="display: none;">00:00</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -7674,6 +7675,7 @@ class TWP_Admin {
|
|||||||
|
|
||||||
// Initialize the browser phone
|
// Initialize the browser phone
|
||||||
function initializeBrowserPhone() {
|
function initializeBrowserPhone() {
|
||||||
|
debugLog('initializeBrowserPhone called');
|
||||||
$('#phone-status').text('Initializing...');
|
$('#phone-status').text('Initializing...');
|
||||||
updateConnectionStatus('connecting');
|
updateConnectionStatus('connecting');
|
||||||
|
|
||||||
@@ -7751,13 +7753,16 @@ class TWP_Admin {
|
|||||||
}
|
}
|
||||||
|
|
||||||
async function setupTwilioDevice(token) {
|
async function setupTwilioDevice(token) {
|
||||||
|
debugLog('setupTwilioDevice called');
|
||||||
try {
|
try {
|
||||||
// Check if Twilio SDK is available
|
// Check if Twilio SDK is available
|
||||||
|
debugLog('Twilio check: ' + (typeof Twilio) + ', Device: ' + (typeof Twilio !== 'undefined' ? typeof Twilio.Device : 'N/A'));
|
||||||
if (typeof Twilio === 'undefined' || !Twilio.Device) {
|
if (typeof Twilio === 'undefined' || !Twilio.Device) {
|
||||||
throw new Error('Twilio Voice SDK not loaded');
|
throw new Error('Twilio Voice SDK not loaded');
|
||||||
}
|
}
|
||||||
|
|
||||||
console.log('Setting up Twilio Device...');
|
console.log('Setting up Twilio Device...');
|
||||||
|
debugLog('Creating Twilio.Device...');
|
||||||
updateConnectionStatus('connecting');
|
updateConnectionStatus('connecting');
|
||||||
|
|
||||||
// Request media permissions before setting up device
|
// Request media permissions before setting up device
|
||||||
@@ -7807,11 +7812,13 @@ class TWP_Admin {
|
|||||||
});
|
});
|
||||||
|
|
||||||
console.log('Twilio Device created with audio constraints:', audioConstraints);
|
console.log('Twilio Device created with audio constraints:', audioConstraints);
|
||||||
|
debugLog('Device created, setting up handlers...');
|
||||||
|
|
||||||
// Set up event handlers BEFORE registering
|
// Set up event handlers BEFORE registering
|
||||||
// Device registered and ready
|
// Device registered and ready
|
||||||
device.on('registered', function() {
|
device.on('registered', function() {
|
||||||
console.log('Device registered successfully');
|
console.log('Device registered successfully');
|
||||||
|
debugLog('Device REGISTERED!');
|
||||||
$('#phone-status').text('Ready').css('color', '#4CAF50');
|
$('#phone-status').text('Ready').css('color', '#4CAF50');
|
||||||
$('#call-btn').prop('disabled', false);
|
$('#call-btn').prop('disabled', false);
|
||||||
updateConnectionStatus('connected');
|
updateConnectionStatus('connected');
|
||||||
@@ -7893,10 +7900,13 @@ class TWP_Admin {
|
|||||||
});
|
});
|
||||||
|
|
||||||
// Register device AFTER setting up event handlers
|
// Register device AFTER setting up event handlers
|
||||||
|
debugLog('Calling device.register()...');
|
||||||
await device.register();
|
await device.register();
|
||||||
|
debugLog('device.register() completed');
|
||||||
|
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('Error setting up Twilio Device:', error);
|
console.error('Error setting up Twilio Device:', error);
|
||||||
|
debugLog('ERROR: ' + error.message);
|
||||||
showError('Failed to setup device: ' + error.message);
|
showError('Failed to setup device: ' + error.message);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -8232,17 +8242,51 @@ class TWP_Admin {
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// Debug helper
|
||||||
|
function debugLog(msg) {
|
||||||
|
console.log('TWP Debug: ' + msg);
|
||||||
|
var debugEl = $('#twp-debug-info');
|
||||||
|
if (debugEl.length) {
|
||||||
|
debugEl.append(msg + '<br>');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// Check if SDK loaded and initialize
|
// Check if SDK loaded and initialize
|
||||||
|
debugLog('jQuery ready');
|
||||||
|
|
||||||
|
// Don't wait for window.load - it may not fire on mobile
|
||||||
|
// Instead, poll for Twilio SDK availability
|
||||||
|
var sdkCheckAttempts = 0;
|
||||||
|
var maxSdkCheckAttempts = 50; // 5 seconds max
|
||||||
|
|
||||||
|
function checkAndInitialize() {
|
||||||
|
sdkCheckAttempts++;
|
||||||
|
debugLog('SDK check #' + sdkCheckAttempts + ': ' + (typeof Twilio));
|
||||||
|
|
||||||
|
if (typeof Twilio !== 'undefined' && Twilio.Device) {
|
||||||
|
console.log('Twilio SDK loaded successfully');
|
||||||
|
debugLog('SDK OK, initializing...');
|
||||||
|
initializeBrowserPhone();
|
||||||
|
} else if (sdkCheckAttempts < maxSdkCheckAttempts) {
|
||||||
|
// Keep checking every 100ms
|
||||||
|
setTimeout(checkAndInitialize, 100);
|
||||||
|
} else {
|
||||||
|
showError('Twilio Voice SDK failed to load. Please check your internet connection and try refreshing the page.');
|
||||||
|
console.error('Twilio SDK not found after ' + sdkCheckAttempts + ' attempts.');
|
||||||
|
debugLog('SDK FAILED after ' + sdkCheckAttempts + ' attempts');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Start checking after a brief delay
|
||||||
|
setTimeout(checkAndInitialize, 500);
|
||||||
|
|
||||||
|
// Also keep the window.load as backup for desktop
|
||||||
$(window).on('load', function() {
|
$(window).on('load', function() {
|
||||||
setTimeout(function() {
|
debugLog('Window loaded (backup)');
|
||||||
if (typeof Twilio === 'undefined') {
|
if (typeof Twilio !== 'undefined' && !device) {
|
||||||
showError('Twilio Voice SDK failed to load. Please check your internet connection and try refreshing the page.');
|
debugLog('Backup init triggered');
|
||||||
console.error('Twilio SDK not found. Script may be blocked or failed to load.');
|
initializeBrowserPhone();
|
||||||
} else {
|
}
|
||||||
console.log('Twilio SDK loaded successfully');
|
|
||||||
initializeBrowserPhone();
|
|
||||||
}
|
|
||||||
}, 1000);
|
|
||||||
});
|
});
|
||||||
|
|
||||||
// Clean up on page unload
|
// Clean up on page unload
|
||||||
|
|||||||
Reference in New Issue
Block a user