Fix SDK timeout and improve text contrast
SDK Loading Improvements: - Increased timeout from 5 to 15 seconds for slower connections - Added progressive status messages during SDK loading - Enhanced console logging for debugging - Added fallback SDK loading mechanism with inline script - Better error diagnostics showing Twilio object status Text Contrast Fixes: - Updated all #333 colors to #212529 for better readability - Fixed browser phone title, dial buttons, timer, queue headings - Enhanced dark mode support for all text elements - Improved readability on both light and dark backgrounds Technical Changes: - waitForTwilioSDK() now waits 150 attempts (15 seconds) - Progressive status updates at 3s, 6s, 10s intervals - Backup SDK loading via document.createElement - Comprehensive dark mode color coverage - Better error messaging for network issues Accessibility Improvements: - Higher contrast ratios for WCAG compliance - Consistent text color hierarchy - Better visibility in all lighting conditions - Enhanced mobile readability 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -26,7 +26,7 @@ class TWP_Shortcodes {
|
||||
global $post;
|
||||
|
||||
if (is_a($post, 'WP_Post') && has_shortcode($post->post_content, 'twp_browser_phone')) {
|
||||
// Enqueue Twilio Voice SDK
|
||||
// Enqueue Twilio Voice SDK with multiple fallbacks
|
||||
wp_enqueue_script(
|
||||
'twilio-voice-sdk',
|
||||
'https://sdk.twilio.com/js/voice/2.11.1/twilio.min.js',
|
||||
@@ -35,6 +35,23 @@ class TWP_Shortcodes {
|
||||
false // Load in head to ensure it's available
|
||||
);
|
||||
|
||||
// Add backup SDK loading
|
||||
wp_add_inline_script('twilio-voice-sdk', "
|
||||
window.twpLoadTwilioSDK = function() {
|
||||
if (typeof Twilio === 'undefined') {
|
||||
console.warn('Primary Twilio SDK failed, attempting fallback load');
|
||||
var script = document.createElement('script');
|
||||
script.src = 'https://sdk.twilio.com/js/voice/2.11.1/twilio.min.js';
|
||||
script.onload = function() { console.log('Fallback Twilio SDK loaded'); };
|
||||
script.onerror = function() { console.error('Fallback Twilio SDK failed'); };
|
||||
document.head.appendChild(script);
|
||||
}
|
||||
};
|
||||
|
||||
// Try loading after a delay if not available
|
||||
setTimeout(window.twpLoadTwilioSDK, 2000);
|
||||
", 'after');
|
||||
|
||||
// Enqueue our browser phone script
|
||||
wp_enqueue_script(
|
||||
'twp-browser-phone-frontend',
|
||||
|
Reference in New Issue
Block a user