<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Nostr Login - OIDC Bridge v2.1</title>
</head>
<body>
    <div id="login-container">
        <!-- Hidden data for backend processing -->
        <div id="challenge" style="display: none;"><%= challenge %></div>
        <div id="session-id" style="display: none;"><%= uid %></div>
        <div id="return-to" style="display: none;"><%= returnTo %></div>
        
        <!-- Error display if needed -->
        <% if (typeof error !== 'undefined') { %>
            <div id="error-message" style="color: #dc3545; background-color: #f8d7da; border: 1px solid #f5c6cb; padding: 15px; border-radius: 8px; margin: 20px; text-align: center;">
                <strong>Authentication Error:</strong> <%= error %>
            </div>
        <% } %>
        
        <!-- Version header -->
        <div style="text-align: center; margin: 10px 0; padding: 8px; background: #e3f2fd; border: 1px solid #2196f3; border-radius: 4px; font-weight: bold; color: #1976d2;">
            🚀 Nostr OIDC Bridge v2.1 - Form Auth + event_json fix
        </div>
        
        <!-- Target div for nostr-login widget -->
        <div id="nostr-login"></div>
        
        <!-- Version info -->
        <div style="position: fixed; bottom: 10px; right: 10px; font-size: 14px; color: #333; background: rgba(255,255,255,0.95); padding: 6px 12px; border-radius: 6px; border: 1px solid #ddd; font-weight: bold;">
            v2.1 - Form Auth + event_json fix
        </div>
    </div>

        <!-- Load your hosted nostr-login with full permissions -->
        <script src='https://laantungir.net/nostr-login/unpkg.js'></script>
        
        <!-- Import nostr-tools for proper npub encoding -->
        <script type="module">
            import { nip19 } from 'https://esm.sh/nostr-tools@2.16.2';
            window.nip19 = nip19;
        </script>

    <!-- Integration bridge to handle authentication -->
    <script>
        let isProcessing = false;
        
        // Initialize nostr-login widget
        window.addEventListener('DOMContentLoaded', () => {
            console.log('Initializing nostr-login widget...');
            
            // Create nostr-login options
            const nostrLoginOptions = {
                bunkers: 'all',
                methods: 'all',
                noBanner: true,
                startScreen: 'welcome-login',
                theme: 'default'
            };
            
            console.log('nostr-login options', nostrLoginOptions);
            
            // Initialize the widget
            if (window.NostrLogin) {
                window.NostrLogin.init(nostrLoginOptions);
            } else {
                console.error('NostrLogin not found on window object');
                
                // Fallback: try to initialize after a delay
                setTimeout(() => {
                    if (window.NostrLogin) {
                        console.log('Retrying NostrLogin initialization...');
                        window.NostrLogin.init(nostrLoginOptions);
                    }
                }, 1000);
            }
        });
        
        // Listen for nostr-login authentication events
        document.addEventListener('nlAuth', async (e) => {
            console.log('nostr-login auth event:', e.detail);
            
            if ((e.detail.type === 'login' || e.detail.type === 'signup') && !isProcessing) {
                isProcessing = true;
                await handleNostrLogin();
            }
        });

        async function handleNostrLogin() {
            try {
                console.log('Handling Nostr login...');
                
                // Get the challenge and session info
                const challenge = document.getElementById('challenge').textContent.trim();
                const sessionId = document.getElementById('session-id').textContent.trim();
                const returnTo = document.getElementById('return-to').textContent.trim();
                
                console.log('Challenge:', challenge);
                console.log('Session ID:', sessionId);
                
                if (!window.nostr) {
                    throw new Error('window.nostr not available after login');
                }
                
                // Get the user's public key
                const pubkey = await window.nostr.getPublicKey();
                console.log('Got pubkey:', pubkey);
                
                // Properly encode pubkey to npub format using nip19
                let npub;
                try {
                    if (window.nip19) {
                        npub = window.nip19.npubEncode(pubkey);
                        console.log('Encoded npub:', npub);
                    } else {
                        console.warn('nip19 not available, using raw pubkey');
                        npub = pubkey; // Fallback to raw hex pubkey
                    }
                } catch (error) {
                    console.error('Error encoding npub:', error);
                    npub = pubkey; // Fallback to raw hex pubkey
                }
                
                // Create and sign the challenge event
                const eventTemplate = {
                    kind: 1,
                    content: challenge,
                    created_at: Math.floor(Date.now() / 1000),
                    tags: []
                };
                
                console.log('Signing event template:', eventTemplate);
                const signedEvent = await window.nostr.signEvent(eventTemplate);
                console.log('Signed event:', signedEvent);
                
                // Verify the signature locally before sending
                if (signedEvent.pubkey !== pubkey) {
                    throw new Error('Signed event pubkey mismatch');
                }
                
                if (signedEvent.content !== challenge) {
                    throw new Error('Signed event content mismatch');
                }
                
                // Submit to backend
                await submitAuthToBackend(sessionId, pubkey, signedEvent);
                
            } catch (error) {
                console.error('Authentication error:', error);
                isProcessing = false;
                
                // Show user-friendly error
                showError('Authentication failed: ' + error.message);
            }
        }

        async function submitAuthToBackend(sessionId, pubkey, signedEvent) {
            try {
                console.log('Submitting auth to backend...');
                
                // Create a form and submit it traditionally to allow proper redirects
                // This avoids CORS issues when redirecting to external domains like Gitea
                const form = document.createElement('form');
                form.method = 'POST';
                form.action = `/complete-auth/${sessionId}`;
                
                // Add form fields
                const npubField = document.createElement('input');
                npubField.type = 'hidden';
                npubField.name = 'npub';
                npubField.value = npub; // Use the properly encoded npub
                form.appendChild(npubField);
                
                const eventField = document.createElement('input');
                eventField.type = 'hidden';
                eventField.name = 'event_json';
                eventField.value = JSON.stringify(signedEvent);
                form.appendChild(eventField);
                
                // Add form to document and submit
                document.body.appendChild(form);
                console.log('Submitting form for authentication...');
                form.submit();
                
            } catch (error) {
                console.error('Backend submission error:', error);
                throw error;
            }
        }

        function showError(message) {
            // Create or update error display
            let errorDiv = document.getElementById('error-message');
            if (!errorDiv) {
                errorDiv = document.createElement('div');
                errorDiv.id = 'error-message';
                errorDiv.style.cssText = 'color: #dc3545; background-color: #f8d7da; border: 1px solid #f5c6cb; padding: 15px; border-radius: 8px; margin: 20px; text-align: center;';
                document.getElementById('login-container').insertBefore(errorDiv, document.getElementById('login-container').firstChild);
            }
            
            errorDiv.innerHTML = `<strong>Authentication Error:</strong> ${message}`;
            
            // Reset processing flag after showing error
            setTimeout(() => {
                isProcessing = false;
            }, 2000);
        }

        // Handle any initialization errors
        window.addEventListener('error', (e) => {
            console.error('Global error:', e.error);
            if (e.error && e.error.message.includes('nostr')) {
                showError('Nostr login initialization failed. Please refresh the page.');
            }
        });

        console.log('Nostr OIDC Bridge login page initialized');
    </script>
</body>
</html>
