ihm_client/src/services/modal.service.ts

146 lines
4.5 KiB
TypeScript
Executable File

import Services from './service';
import { addressToEmoji } from '../utils/sp-address.utils';
import { RoleDefinition } from '../../pkg/sdk_client';
// Import des composants pour s'assurer qu'ils sont enregistrés
import '../components/modal/ValidationModal';
import '../components/modal/LoginModal';
import '../components/modal/ConfirmationModal';
interface ConfirmationModalOptions {
title: string;
content: string;
confirmText?: string;
cancelText?: string;
}
export default class ModalService {
private static instance: ModalService;
private currentModal: HTMLElement | null = null;
private constructor() {}
public static async getInstance(): Promise<ModalService> {
if (!ModalService.instance) {
ModalService.instance = new ModalService();
}
return ModalService.instance;
}
// --- Gestion LOGIN MODAL ---
public openLoginModal(myAddress: string, receiverAddress: string) {
this.closeCurrentModal(); // Sécurité
const modal = document.createElement('login-modal') as any;
// On passe les données au composant
modal.devices = { device1: myAddress, device2: receiverAddress };
document.body.appendChild(modal);
this.currentModal = modal;
}
public async closeLoginModal() {
if (this.currentModal && this.currentModal.tagName === 'LOGIN-MODAL') {
this.currentModal.remove();
this.currentModal = null;
}
}
public confirmLogin() {
console.log('=============> Confirm Login');
// Logique de confirmation à implémenter si besoin
}
// --- Gestion VALIDATION MODAL ---
async injectValidationModal(processDiff: any) {
this.closeCurrentModal();
const modal = document.createElement('validation-modal') as any;
modal.processDiffs = processDiff;
document.body.appendChild(modal);
this.currentModal = modal;
}
async closeValidationModal() {
if (this.currentModal && this.currentModal.tagName === 'VALIDATION-MODAL') {
this.currentModal.remove();
this.currentModal = null;
}
}
// --- Gestion CONFIRMATION MODAL (Generic) ---
// Utilisé pour la confirmation d'appairage
public async openPairingConfirmationModal(roleDefinition: Record<string, RoleDefinition>, processId: string, stateId: string) {
let members;
if (roleDefinition['pairing']) {
members = roleDefinition['pairing'].members;
} else {
throw new Error('No "pairing" role');
}
// On veut afficher les émojis des autres membres
const service = await Services.getInstance();
const localAddress = service.getDeviceAddress();
let contentHtml = `<p>Confirmation de l'appairage pour le processus ${processId.substring(0, 8)}...</p>`;
// Récupération des emojis (simplifié)
// Note: Dans ton ancien code, tu récupérais les membres et affichais les emojis.
// Ici on utilise notre modale générique.
const confirmAction = async () => {
console.log('Pairing confirmed via Modal');
// Ajouter ici la logique de confirmation si nécessaire
};
const cancelAction = async () => {
console.log('Pairing cancelled via Modal');
await this.closeConfirmationModal();
};
// On utilise showConfirmationModal qui fait tout le travail
await this.showConfirmationModal({
title: 'Confirm Pairing',
content: contentHtml,
confirmText: 'Valider',
cancelText: 'Refuser',
});
}
async showConfirmationModal(options: ConfirmationModalOptions, fullscreen: boolean = false): Promise<boolean> {
return new Promise((resolve) => {
const modal = document.createElement('confirmation-modal') as any;
modal.configure(
options.title,
options.content,
() => {
resolve(true);
}, // Confirm
() => {
resolve(false);
}, // Cancel
);
document.body.appendChild(modal);
// Note: ConfirmationModal se supprime lui-même du DOM après clic, pas besoin de le stocker dans currentModal
// sauf si on veut pouvoir le fermer par programme.
});
}
async closeConfirmationModal() {
const service = await Services.getInstance();
await service.unpairDevice();
// Le composant ConfirmationModal se gère lui-même, mais on peut ajouter une logique ici si on le stocke.
}
private closeCurrentModal() {
if (this.currentModal) {
this.currentModal.remove();
this.currentModal = null;
}
}
}