diff --git a/src/pages/home/home.html b/src/pages/home/home.html index 2a7c2f2..70fe5c9 100755 --- a/src/pages/home/home.html +++ b/src/pages/home/home.html @@ -10,8 +10,7 @@
-
- Initializing secure pairing... +
@@ -20,12 +19,4 @@ - -
-
-
-

Initializing...

-

Setting up secure pairing

-
-
diff --git a/src/pages/home/home.ts b/src/pages/home/home.ts index d7ebf43..fa6081b 100755 --- a/src/pages/home/home.ts +++ b/src/pages/home/home.ts @@ -1,9 +1,7 @@ -import Routing from '../../services/modal.service'; import Services from '../../services/service'; import { addSubscription } from '../../utils/subscription.utils'; import { displayEmojis, generateCreateBtn, addressToEmoji, prepareAndSendPairingTx } from '../../utils/sp-address.utils'; import { getCorrectDOM } from '../../utils/html.utils'; -// import { navigate, registerAllListeners } from '../../router'; // Unused imports import { IframePairingComponent } from '../../components/iframe-pairing/iframe-pairing'; // Extend WindowEventMap to include custom events @@ -16,97 +14,11 @@ declare global { } } -// Home page loading spinner functions -function showHomeLoadingSpinner(message: string = 'Loading...') { - // Remove existing spinner if any - hideHomeLoadingSpinner(); - - // Create spinner overlay - const overlay = document.createElement('div'); - overlay.id = 'home-loading-overlay'; - overlay.style.cssText = ` - position: fixed; - top: 0; - left: 0; - width: 100%; - height: 100%; - background: rgba(0, 0, 0, 0.7); - display: flex; - flex-direction: column; - justify-content: center; - align-items: center; - z-index: 9998; - backdrop-filter: blur(3px); - `; - - // Create spinner content - const spinnerContent = document.createElement('div'); - spinnerContent.style.cssText = ` - background: rgba(255, 255, 255, 0.95); - border-radius: 12px; - padding: 30px; - text-align: center; - box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2); - border: 1px solid rgba(255, 255, 255, 0.2); - max-width: 350px; - width: 90%; - `; - - // Create spinner - const spinner = document.createElement('div'); - spinner.style.cssText = ` - width: 40px; - height: 40px; - border: 3px solid #f3f3f3; - border-top: 3px solid #3a506b; - border-radius: 50%; - animation: spin 1s linear infinite; - margin: 0 auto 15px auto; - `; - - // Create message - const messageEl = document.createElement('div'); - messageEl.textContent = message; - messageEl.style.cssText = ` - font-size: 14px; - color: #3a506b; - font-weight: 500; - `; - - // Add CSS animation if not already present - if (!document.getElementById('home-spinner-styles')) { - const style = document.createElement('style'); - style.id = 'home-spinner-styles'; - style.textContent = ` - @keyframes spin { - 0% { transform: rotate(0deg); } - 100% { transform: rotate(360deg); } - } - `; - document.head.appendChild(style); - } - - // Assemble spinner - spinnerContent.appendChild(spinner); - spinnerContent.appendChild(messageEl); - overlay.appendChild(spinnerContent); - - // Add to document - document.body.appendChild(overlay); -} - -function hideHomeLoadingSpinner() { - const overlay = document.getElementById('home-loading-overlay'); - if (overlay) { - overlay.remove(); - } -} export async function initHomePage(): Promise { console.log('INIT-HOME'); - // Show loading spinner during home page initialization - showHomeLoadingSpinner('Initializing pairing interface...'); + // No loading spinner - let the interface load naturally // Initialize iframe pairing, content menu, and communication only if in iframe if (window.parent !== window) { @@ -153,82 +65,13 @@ export async function initHomePage(): Promise { console.log('πŸ” Auto-triggering WebAuthn authentication...'); await handleMainPairing(); - // Hide loading spinner after initialization - console.log('πŸ”§ Hiding loading spinner...'); - hideHomeLoadingSpinner(); console.log('βœ… Home page initialization completed'); } catch (error) { console.error('❌ Error initializing home page:', error); - hideHomeLoadingSpinner(); throw error; } } -//// Modal -export async function openModal(myAddress: string, receiverAddress: string) { - const router = await Routing.getInstance(); - router.openLoginModal(myAddress, receiverAddress); -} - -// const service = await Services.getInstance() -// service.setNotification() - -function scanDevice() { - const container = getCorrectDOM('login-4nk-component') as HTMLElement; - const scannerImg = container.querySelector('#scanner') as HTMLElement; - if (scannerImg) scannerImg.style.display = 'none'; - const scannerQrCode = container.querySelector('.qr-code-scanner') as HTMLElement; - if (scannerQrCode) scannerQrCode.style.display = 'block'; - const scanButton = container?.querySelector('#scan-btn') as HTMLElement; - if (scanButton) scanButton.style.display = 'none'; - // QR scanner functionality removed -} - -async function populateMemberSelect() { - const container = getCorrectDOM('login-4nk-component') as HTMLElement; - const memberSelect = container.querySelector('#memberSelect') as HTMLSelectElement; - - if (!memberSelect) { - console.error('Could not find memberSelect element'); - return; - } - - const service = await Services.getInstance(); - const members = await service.getAllMembersSorted(); - - for (const [processId, member] of Object.entries(members)) { - // Use member variable - console.log('Processing member:', member); - const process = await service.getProcess(processId); - let memberPublicName; - - if (process) { - const publicMemberData = service.getPublicData(process); - if (publicMemberData) { - const extractedName = publicMemberData['memberPublicName']; - if (extractedName !== undefined && extractedName !== null) { - memberPublicName = extractedName; - } - } - } - - if (!memberPublicName) { - memberPublicName = 'Unnamed Member'; - } - - // RΓ©cupΓ©rer les emojis pour ce processId - const emojis = await addressToEmoji(processId); - - const option = document.createElement('option'); - option.value = processId; - option.textContent = `${memberPublicName} (${emojis})`; - memberSelect.appendChild(option); - } -} - -(window as any).populateMemberSelect = populateMemberSelect; - -(window as any).scanDevice = scanDevice; // Initialize iframe pairing component let iframePairing: IframePairingComponent | null = null; @@ -526,19 +369,7 @@ export function setupIframePairingButtons() { // Main Pairing Interface - Automatic WebAuthn trigger export function setupMainPairing(): void { - const container = getCorrectDOM('login-4nk-component') as HTMLElement; - const mainStatus = container.querySelector('#main-status') as HTMLElement; - - if (mainStatus) { - mainStatus.innerHTML = ` -
-

πŸ” Secure authentication required

-
- Initializing secure authentication... -
- `; - } - + // Don't set any initial content - let handleMainPairing handle the UI console.log('πŸ” Main pairing setup - authentication will be automatic'); } diff --git a/src/services/service.ts b/src/services/service.ts index d4fddcd..8cbcb10 100755 --- a/src/services/service.ts +++ b/src/services/service.ts @@ -903,13 +903,12 @@ export default class Services { throw new Error('No members available - handshake not completed yet'); } - // Convert to map format for WebAssembly (keep original structure) - const members = membersObj; - console.log('πŸ” DEBUG: Members map keys:', Object.keys(members)); - console.log('πŸ” DEBUG: Members map sample:', Object.keys(members).slice(0, 3).reduce((acc, key) => { - acc[key] = members[key]; - return acc; - }, {} as any)); + // Convert to array format for WebAssembly (it expects a sequence, not a map) + const members = Object.values(membersObj).map(member => ({ + sp_addresses: member.sp_addresses + })); + console.log('πŸ” DEBUG: Members array length:', members.length); + console.log('πŸ” DEBUG: Members array sample:', members.slice(0, 3)); const result = this.sdkClient.create_new_process( encodedPrivateData,