190 lines
5.6 KiB
HTML
190 lines
5.6 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>🔐 NOSTR_LOGIN_LITE - All Login Methods Test</title>
|
|
<style>
|
|
body {
|
|
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
|
margin: 0;
|
|
padding: 20px;
|
|
background: #ffffff;
|
|
min-height: 100vh;
|
|
color: #000000;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<div id="login-section">
|
|
<!-- Login UI if needed -->
|
|
</div>
|
|
<div id="profile-section">
|
|
<img id="profile-picture">
|
|
<div id="profile-pubkey"></div>
|
|
<div id="profile-name"></div>
|
|
<div id="profile-about"></div>
|
|
</div>
|
|
|
|
<!-- Load the official nostr-tools bundle first -->
|
|
<script src="../lite/nostr.bundle.js"></script>
|
|
|
|
<!-- Load NOSTR_LOGIN_LITE main library (now includes NIP-46 extension) -->
|
|
<script src="../lite/nostr-lite.js"></script>
|
|
|
|
<script>
|
|
|
|
|
|
// Global variables
|
|
let nlLite = null;
|
|
let userPubkey = null;
|
|
let relayUrl = 'wss://relay.laantungir.net';
|
|
|
|
// Initialize NOSTR_LOGIN_LITE
|
|
async function initializeApp() {
|
|
// console.log('INFO', 'Initializing NOSTR_LOGIN_LITE...');
|
|
|
|
try {
|
|
await window.NOSTR_LOGIN_LITE.init({
|
|
theme: 'default',
|
|
darkMode: false,
|
|
methods: {
|
|
extension: true,
|
|
local: true,
|
|
seedphrase: true,
|
|
connect: true, // Enables "Nostr Connect" (NIP-46)
|
|
remote: true, // Also needed for "Nostr Connect" compatibility
|
|
otp: true // Enables "DM/OTP"
|
|
},
|
|
floatingTab: {
|
|
enabled: true,
|
|
hPosition: .98, // 95% from left
|
|
vPosition: 0, // 50% from top (center)
|
|
getUserInfo: true, // Fetch user profiles
|
|
getUserRelay: ['wss://relay.laantungir.net'], // Custom relays for profiles
|
|
appearance: {
|
|
style: 'minimal',
|
|
theme: 'auto',
|
|
icon: '',
|
|
text: 'Login',
|
|
iconOnly: false
|
|
},
|
|
behavior: {
|
|
hideWhenAuthenticated: false,
|
|
showUserInfo: true,
|
|
autoSlide: false,
|
|
persistent: false
|
|
},
|
|
animation: {
|
|
slideDirection: 'right' // Slide to the right when hiding
|
|
}
|
|
},
|
|
debug: true
|
|
});
|
|
|
|
nlLite = window.NOSTR_LOGIN_LITE;
|
|
console.log('SUCCESS', 'NOSTR_LOGIN_LITE initialized successfully');
|
|
|
|
window.addEventListener('nlMethodSelected', handleAuthEvent);
|
|
|
|
} catch (error) {
|
|
console.log('ERROR', `Initialization failed: ${error.message}`);
|
|
|
|
}
|
|
}
|
|
|
|
|
|
function handleAuthEvent(event) {
|
|
const { pubkey, method, error } = event.detail;
|
|
console.log('INFO', `Auth event received: method=${method}`);
|
|
|
|
if (method && pubkey) {
|
|
userPubkey = pubkey;
|
|
console.log('SUCCESS', `Login successful! Method: ${method}, Pubkey: ${pubkey}`);
|
|
|
|
loadUserProfile();
|
|
|
|
} else if (error) {
|
|
console.log('ERROR', `Authentication error: ${error}`);
|
|
|
|
}
|
|
}
|
|
|
|
// Load user profile using nostr-tools pool
|
|
async function loadUserProfile() {
|
|
if (!userPubkey) return;
|
|
|
|
console.log('INFO', `Loading profile for: ${userPubkey}`);
|
|
document.getElementById('profile-name').textContent = 'Loading profile...';
|
|
document.getElementById('profile-pubkey').textContent = userPubkey;
|
|
|
|
try {
|
|
// Create a SimplePool instance
|
|
const pool = new window.NostrTools.SimplePool();
|
|
const relays = [relayUrl, 'wss://relay.laantungir.net'];
|
|
|
|
// Get profile event (kind 0) for the user using querySync
|
|
const events = await pool.querySync(relays, {
|
|
kinds: [0],
|
|
authors: [userPubkey],
|
|
limit: 1
|
|
});
|
|
|
|
pool.close(relays); // Clean up connections
|
|
|
|
if (events.length > 0) {
|
|
console.log('SUCCESS', 'Profile event received');
|
|
const profile = JSON.parse(events[0].content);
|
|
displayProfile(profile);
|
|
} else {
|
|
console.log('INFO', 'No profile found');
|
|
document.getElementById('profile-name').textContent = 'No profile found';
|
|
document.getElementById('profile-about').textContent = 'User has not set up a profile yet.';
|
|
}
|
|
|
|
} catch (error) {
|
|
console.log('ERROR', `Profile loading failed: ${error.message}`);
|
|
document.getElementById('profile-name').textContent = 'Error loading profile';
|
|
document.getElementById('profile-about').textContent = error.message;
|
|
}
|
|
}
|
|
|
|
// Display profile data
|
|
function displayProfile(profile) {
|
|
const name = profile.name || profile.display_name || profile.displayName || 'Anonymous User';
|
|
const about = profile.about || '';
|
|
const picture = profile.picture || '';
|
|
|
|
document.getElementById('profile-name').textContent = name;
|
|
document.getElementById('profile-about').textContent = about;
|
|
|
|
if (picture) {
|
|
document.getElementById('profile-picture').src = picture;
|
|
}
|
|
|
|
console.log('SUCCESS', `Profile displayed: ${name}`);
|
|
}
|
|
|
|
// Logout function
|
|
async function logout() {
|
|
console.log('INFO', 'Logging out...');
|
|
try {
|
|
await nlLite.logout();
|
|
console.log('SUCCESS', 'Logged out successfully');
|
|
} catch (error) {
|
|
console.log('ERROR', `Logout failed: ${error.message}`);
|
|
}
|
|
}
|
|
|
|
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
// Initialize the app
|
|
setTimeout(initializeApp, 100);
|
|
});
|
|
</script>
|
|
</body>
|
|
|
|
</html> |