trent_larson/daily-notification-plugin
4
0
Fork 0
Code Issues Pull Requests 2 Projects Releases Wiki Activity

feat(ios): enhance permission UI feedback with detailed logging

Browse Source 
Enhanced permission request/check UI with better feedback:

Permission UI Enhancements:
- Added detailed console logging for permission operations
- Enhanced status display with emoji indicators
- Shows detailed permission results (status, granted, alert, badge, sound)
- Better error messages with full error details
- Visual feedback with color-coded status backgrounds

Console Logging:
- Logs when permission functions are called
- Logs plugin availability status
- Logs permission request/check results
- Logs errors with full details

Fixes:
- Permission visibility: Users can now see detailed permission status
- Error debugging: Full error messages help diagnose issues
- User feedback: Clear visual and text feedback for permission state

Result: Permission operations now provide comprehensive feedback in both UI and console
This commit is contained in:
Matthew Raymer
2025-11-11 22:25:52 -08:00
parent 4412838c74
commit 328311281c
1 changed files with 159 additions and 135 deletions
Download Patch File Download Diff File Expand all files Collapse all files

70
test-apps/ios-test-app/App/App/public/index.html
View File

@@ -1,8 +1,10 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="viewport-fit=cover, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta name="viewport"
content="viewport-fit=cover, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Expires" content="0">
@@ -16,15 +18,18 @@
min-height: 100vh;
color: white;
}
.container {
max-width: 600px;
margin: 0 auto;
text-align: center;
}
h1 {
margin-bottom: 30px;
font-size: 2.5em;
}
.button {
background: rgba(255, 255, 255, 0.2);
border: 2px solid rgba(255, 255, 255, 0.3);
@@ -36,10 +41,12 @@
font-size: 16px;
transition: all 0.3s ease;
}
.button:hover {
background: rgba(255, 255, 255, 0.3);
transform: translateY(-2px);
}
.status {
margin-top: 30px;
padding: 20px;
@@ -49,12 +56,9 @@
}
</style>
</head>
<body>
<div class="container">
<!-- Immediate visibility test - should appear even if JS fails -->
<div style="background: red; color: white; padding: 20px; margin-bottom: 20px; font-size: 24px; font-weight: bold; text-align: center;">
✅ HTML IS LOADING - If you see this, the WebView is working!
</div>
<h1>🔔 DailyNotification Plugin Test</h1>
<p>Test the DailyNotification plugin functionality</p>
<p style="font-size: 12px; opacity: 0.8;">Build: 2025-10-14 05:00:00 UTC</p>
@@ -349,55 +353,72 @@
// Permission management functions
function checkPermissions() {
console.log('checkPermissions called');
console.log('🔐 checkPermissions called');
console.log('🔐 Plugin available:', !!window.DailyNotification);
const status = document.getElementById('status');
status.innerHTML = 'Checking permissions...';
status.innerHTML = '🔐 Checking permissions...';
status.style.background = 'rgba(255, 255, 0, 0.3)'; // Yellow background
try {
if (!window.DailyNotification) {
status.innerHTML = 'DailyNotification plugin not available';
console.error('❌ DailyNotification plugin not available');
status.innerHTML = '❌ DailyNotification plugin not available<br>Check console for details.';
status.style.background = 'rgba(255, 0, 0, 0.3)'; // Red background
return;
}
console.log('🔐 Calling checkPermissionStatus...');
window.DailyNotification.checkPermissionStatus()
.then(result => {
status.innerHTML = `Permission Status:<br>
Notifications: ${result.notificationsEnabled ? '✅' : '❌'}<br>
Exact Alarm: ${result.exactAlarmEnabled ? '✅' : '❌'}<br>
Wake Lock: ${result.wakeLockEnabled ? '✅' : '❌'}<br>
All Granted: ${result.allPermissionsGranted ? '✅' : '❌'}`;
console.log('✅ Permission status result:', result);
status.innerHTML = `🔐 Permission Status:<br>
Notifications: ${result.notificationsEnabled ? '✅ YES' : '❌ NO'}<br>
Exact Alarm: ${result.exactAlarmEnabled ? '✅ YES' : '❌ NO'}<br>
Wake Lock: ${result.wakeLockEnabled ? '✅ YES' : '❌ NO'}<br>
All Granted: ${result.allPermissionsGranted ? '✅ YES' : '❌ NO'}`;
status.style.background = result.allPermissionsGranted ?
'rgba(0, 255, 0, 0.3)' : 'rgba(255, 165, 0, 0.3)'; // Green or orange
})
.catch(error => {
status.innerHTML = `Permission check failed: ${error.message}`;
console.error('❌ Permission check error:', error);
status.innerHTML = `❌ Permission check failed:<br>${error.message || error}`;
status.style.background = 'rgba(255, 0, 0, 0.3)'; // Red background
});
} catch (error) {
status.innerHTML = `Permission check failed: ${error.message}`;
console.error('❌ Permission check exception:', error);
status.innerHTML = `❌ Permission check failed:<br>${error.message || error}`;
status.style.background = 'rgba(255, 0, 0, 0.3)'; // Red background
}
}
function requestPermissions() {
console.log('requestPermissions called');
console.log('🔐 requestPermissions called');
console.log('🔐 Plugin available:', !!window.DailyNotification);
const status = document.getElementById('status');
status.innerHTML = 'Requesting permissions...';
status.innerHTML = '🔐 Requesting permissions...<br>You should see a system permission dialog.';
status.style.background = 'rgba(255, 255, 0, 0.3)'; // Yellow background
try {
if (!window.DailyNotification) {
status.innerHTML = 'DailyNotification plugin not available';
console.error('❌ DailyNotification plugin not available');
status.innerHTML = '❌ DailyNotification plugin not available<br>Check console for details.';
status.style.background = 'rgba(255, 0, 0, 0.3)'; // Red background
return;
}
console.log('🔐 Calling requestNotificationPermissions...');
window.DailyNotification.requestNotificationPermissions()
.then(() => {
status.innerHTML = 'Permission request completed! Check your device settings if needed.';
status.style.background = 'rgba(0, 255, 0, 0.3)'; // Green background
.then(result => {
console.log('✅ Permission request result:', result);
const granted = result.granted || result.status === 'granted';
status.innerHTML = `🔐 Permission Request Result:<br>
Status: ${result.status || 'unknown'}<br>
Granted: ${granted ? '✅ YES' : '❌ NO'}<br>
Alert: ${result.alert ? '✅' : '❌'}<br>
Badge: ${result.badge ? '✅' : '❌'}<br>
Sound: ${result.sound ? '✅' : '❌'}`;
status.style.background = granted ?
'rgba(0, 255, 0, 0.3)' : 'rgba(255, 165, 0, 0.3)'; // Green or orange
// Check permissions again after request
setTimeout(() => {
@@ -405,11 +426,13 @@
}, 1000);
})
.catch(error => {
status.innerHTML = `Permission request failed: ${error.message}`;
console.error('❌ Permission request error:', error);
status.innerHTML = `❌ Permission request failed:<br>${error.message || error}`;
status.style.background = 'rgba(255, 0, 0, 0.3)'; // Red background
});
} catch (error) {
status.innerHTML = `Permission request failed: ${error.message}`;
console.error('❌ Permission request exception:', error);
status.innerHTML = `❌ Permission request failed:<br>${error.message || error}`;
status.style.background = 'rgba(255, 0, 0, 0.3)'; // Red background
}
}
@@ -613,4 +636,5 @@
});
</script>
</body>
</html>