Visionneuses communes
Le moteur validé dans e-Justice-Wiki-16 devient un composant réutilisable par tous les produits Mellentaane.
Trois modes, un même contrat
Démonstration par profil
Parcours ordonné, lecture automatique, étapes, zoom, plein écran et panneaux d’information.
Maquettes UI/UX
Navigation par lot ou groupe, affichage largeur/écran, zoom et renderer fourni par le produit.
Présentation
Étapes linéaires, progression, clavier, tactile, plein écran et URL partageables.
Répartition des responsabilités
| Shared | Produit |
|---|---|
| Barres, chevrons, panneaux, responsive, zoom, plein écran, clavier, tactile, état et URL. | Données, profils, parcours, contenus, écrans et renderer métier. |
| Contrat DOM et API JavaScript stables. | Configuration MELLENTAANE_VIEWER_CONFIG. |
Activation automatique
<body data-layout="viewer" data-shared-viewer="journey"> ... contrat HTML de la visionneuse ... <script data-source="[chemin absolu vers les données]"></script> <script data-source="[chemin absolu vers le moteur]"></script> <script src="https://shared.mellentaane.sn/content/stable/js/shared-ui.js"></script> </body>
shared-ui.js charge automatiquement shared-viewer.js, viewer-exit.js et l’adaptateur demandé.
Configuration du produit
window.MELLENTAANE_VIEWER_CONFIG = {
product: { name: 'e-Justice', slug: 'e-justice', homeUrl: '../../index.html' },
routes: window.PRODUCT_ROUTES,
information: { guides: window.PRODUCT_SCREEN_GUIDES, learning: window.PRODUCT_SCREEN_LEARNING },
journey: { journeys: window.PRODUCT_JOURNEYS, renderer: window.PRODUCT_JOURNEY_RENDERER },
mockups: { bundle: window.PRODUCT_MOCKUPS, renderer: window.PRODUCT_MOCKUP_RENDERER },
presentation: { bundle: window.PRODUCT_PRESENTATION, parameterName: 'etape' }
};Contrat de renderer
window.PRODUCT_JOURNEY_RENDERER = {
renderScreen(screen, journey) {
const root = document.createElement('article');
root.className = 'product-screen';
root.dataset.viewerScreen = '';
// Le produit rend ici sa véritable maquette HTML.
return root;
}
};Le premier élément rendu doit être un élément HTML. Shared ajoute automatiquement data-viewer-screen si nécessaire.
Compatibilité e-Justice
Les adaptateurs acceptent encore les données historiques EJUSTICE_JOURNEYS, EJUSTICE_MOCKUPS, EJUSTICE_PRESENTATION, les guides et le renderer de maquettes. La prochaine version e-Justice devra toutefois déclarer explicitement le contrat générique.