<?php
// Identify the user before WebPush
$current_user = wp_get_current_user();
if ($current_user->ID) {
    Metrix_SDK::authorize_user($current_user->user_login);
}
 
// Add the Service Worker
Metrix_SDK::add_sdk_script(); // Your method that adds the JS SDK file
?>
 
<script>
// Initialize the SDK with WebPush
Metrix.init("<?php echo $wp_settings['app_id'] ?>", "<?php echo $wp_settings['api_key'] ?>", {
    push: {
        enabled: true,
        publicKey: "<?php echo $wp_settings['push_public_key'] ?>",
        hasSW: true,
        showBell: true,
        showBackdrop: true,
        backdropText: "Do you want to receive push notifications?",
        backdropDelay: 1000
    }
});
 
// Request push permission on button click
document.getElementById('subscribePushBtn').addEventListener('click', () => {
    Metrix.subscribePush().then(state => {
        console.log('Push state:', state); // 'subscribed', 'blocked', or 'closed'
    });
});
</script>
 
<button id="subscribePushBtn">Subscribe to Push Notifications</button>