Compare commits
3 Commits
2026.01.24
...
2026.01.24
| Author | SHA1 | Date | |
|---|---|---|---|
| 03692608cc | |||
| b95d1dc461 | |||
| 59df695530 |
@@ -7017,7 +7017,6 @@ class TWP_Admin {
|
||||
<div class="phone-display">
|
||||
<div id="phone-status">Ready</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="call-timer" style="display: none;">00:00</div>
|
||||
</div>
|
||||
@@ -7446,6 +7445,11 @@ class TWP_Admin {
|
||||
}
|
||||
</style>
|
||||
|
||||
<!-- Preload and preconnect for faster loading -->
|
||||
<link rel="preload" href="https://unpkg.com/@twilio/voice-sdk@2.11.0/dist/twilio.min.js" as="script">
|
||||
<link rel="dns-prefetch" href="//unpkg.com">
|
||||
<link rel="dns-prefetch" href="//chunderw-vpc-gll.twilio.com">
|
||||
<link rel="preconnect" href="https://chunderw-vpc-gll.twilio.com" crossorigin>
|
||||
<!-- Twilio Voice SDK v2 from unpkg CDN -->
|
||||
<script src="https://unpkg.com/@twilio/voice-sdk@2.11.0/dist/twilio.min.js"></script>
|
||||
<script>
|
||||
@@ -7675,7 +7679,6 @@ class TWP_Admin {
|
||||
|
||||
// Initialize the browser phone
|
||||
function initializeBrowserPhone() {
|
||||
debugLog('initializeBrowserPhone called');
|
||||
$('#phone-status').text('Initializing...');
|
||||
updateConnectionStatus('connecting');
|
||||
|
||||
@@ -7753,16 +7756,13 @@ class TWP_Admin {
|
||||
}
|
||||
|
||||
async function setupTwilioDevice(token) {
|
||||
debugLog('setupTwilioDevice called');
|
||||
try {
|
||||
// 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) {
|
||||
throw new Error('Twilio Voice SDK not loaded');
|
||||
}
|
||||
|
||||
console.log('Setting up Twilio Device...');
|
||||
debugLog('Creating Twilio.Device...');
|
||||
updateConnectionStatus('connecting');
|
||||
|
||||
// Request media permissions before setting up device
|
||||
@@ -7812,13 +7812,11 @@ class TWP_Admin {
|
||||
});
|
||||
|
||||
console.log('Twilio Device created with audio constraints:', audioConstraints);
|
||||
debugLog('Device created, setting up handlers...');
|
||||
|
||||
// Set up event handlers BEFORE registering
|
||||
// Device registered and ready
|
||||
device.on('registered', function() {
|
||||
console.log('Device registered successfully');
|
||||
debugLog('Device REGISTERED!');
|
||||
$('#phone-status').text('Ready').css('color', '#4CAF50');
|
||||
$('#call-btn').prop('disabled', false);
|
||||
updateConnectionStatus('connected');
|
||||
@@ -7900,13 +7898,10 @@ class TWP_Admin {
|
||||
});
|
||||
|
||||
// Register device AFTER setting up event handlers
|
||||
debugLog('Calling device.register()...');
|
||||
await device.register();
|
||||
debugLog('device.register() completed');
|
||||
|
||||
} catch (error) {
|
||||
console.error('Error setting up Twilio Device:', error);
|
||||
debugLog('ERROR: ' + error.message);
|
||||
showError('Failed to setup device: ' + error.message);
|
||||
}
|
||||
}
|
||||
@@ -8242,31 +8237,41 @@ 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
|
||||
// Poll for Twilio SDK availability (window.load may not fire on mobile)
|
||||
var sdkCheckAttempts = 0;
|
||||
var maxSdkCheckAttempts = 100; // 5 seconds max (100 * 50ms)
|
||||
|
||||
function checkAndInitialize() {
|
||||
sdkCheckAttempts++;
|
||||
|
||||
if (typeof Twilio !== 'undefined' && Twilio.Device) {
|
||||
console.log('Twilio SDK loaded successfully');
|
||||
initializeBrowserPhone();
|
||||
} else if (sdkCheckAttempts < maxSdkCheckAttempts) {
|
||||
// Keep checking every 50ms for faster response
|
||||
setTimeout(checkAndInitialize, 50);
|
||||
} 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.');
|
||||
}
|
||||
}
|
||||
|
||||
// Check if SDK loaded and initialize
|
||||
debugLog('jQuery ready');
|
||||
$(window).on('load', function() {
|
||||
debugLog('Window loaded');
|
||||
setTimeout(function() {
|
||||
debugLog('Checking Twilio: ' + (typeof Twilio));
|
||||
if (typeof Twilio === 'undefined') {
|
||||
showError('Twilio Voice SDK failed to load. Please check your internet connection and try refreshing the page.');
|
||||
console.error('Twilio SDK not found. Script may be blocked or failed to load.');
|
||||
debugLog('SDK FAILED');
|
||||
// Check immediately - SDK script is synchronous so should be loaded
|
||||
// If not ready yet (mobile), polling will catch it
|
||||
if (typeof Twilio !== 'undefined' && Twilio.Device) {
|
||||
console.log('Twilio SDK already loaded');
|
||||
initializeBrowserPhone();
|
||||
} else {
|
||||
console.log('Twilio SDK loaded successfully');
|
||||
debugLog('SDK OK, initializing...');
|
||||
// Start polling immediately
|
||||
checkAndInitialize();
|
||||
}
|
||||
|
||||
// Also keep the window.load as backup for desktop
|
||||
$(window).on('load', function() {
|
||||
if (typeof Twilio !== 'undefined' && !device) {
|
||||
initializeBrowserPhone();
|
||||
}
|
||||
}, 1000);
|
||||
});
|
||||
|
||||
// Clean up on page unload
|
||||
|
||||
Reference in New Issue
Block a user