Organizzazione del codice

• domain: Rappresenta il cuore della logica applicativa, modellando i concetti fondamentali del sistema.

• state: Si occupa della gestione dello stato dell'applicazione e delle sue transizioni. Questo package suggerisce l'uso di un approccio reattivo, dove lo stato è centrale e gli aggiornamenti vengono propagati automaticamente.

• view: Si concentra sulla presentazione e l'interazione con l'utente. La suddivisione in sottopackage rende evidente l'uso del Component-Based Design, dove ogni componente ha una responsabilità specifica. Questo favorisce il riuso e la manutenibilità del codice.

• api: Definisce le interfacce e i parser per comunicare con l'esterno.

Dettagli del package view

Il package view è ulteriormente suddiviso in:

• components: Contiene componenti grafici riutilizzabili, seguendo un approccio modulare.

• config: Gestisce le configurazioni necessarie per personalizzare e parametrizzare l'applicazione.

• player: Include il player per gestire l'esecuzione del grafo, con funzionalità di Play, Pausa e regolazione della velocità.

• graph: Contiene il visualizzatore 3D del grafo.

Dominio

Il dominio è il cuore dell'applicazione ed è formato da due concetti: le entità e i comandi ad esse associate. Le entità sono rappresentate da nodi e archi, mentre i comandi sono azioni che possono essere eseguite sul grafo. In particolare è stato usato il Command Pattern per definire le operazioni sul grafo in modo flessibile e mantenere la coerenza dello stato. Il dominio non ha alcuna dipendenza da librerie esterne, garantendo la sua indipendenza e facilitando la sua testabilità.

Command Pattern

Il Command Pattern è un pattern di design comportamentale che incapsula una richiesta come un oggetto, i principali vantaggi sono:

• Separazione tra mittente e ricevitore → Il client che invoca un'azione non ha bisogno di conoscere i dettagli della sua esecuzione.
• Estensibilità → Nuovi comandi possono essere aggiunti senza modificare il codice esistente.
• Modularità → I comandi possono essere combinati, messi in coda e ripetuti in modo flessibile.

Struttura del Dominio del Grafo

• GraphType: Definisce i tipi di base per il grafo, come Id, Color e Label.
• Position: Rappresenta la posizione di un nodo nel grafo, con coordinate x, y e z.
• GraphNode: Rappresenta un nodo del grafo, con un Id, una Position, una Label e un Color.
• GraphEdge: Rappresenta un arco del grafo, con due nodi collegati.
• SetNodes: Comando per aggiungere nodi al grafo.
• SetEdges: Comando per aggiungere archi al grafo.
• SetEdgesByIds: Comando per aggiungere archi al grafo specificando gli Id dei nodi.

Struttura del Dominio dell'Animazione

• ViewMode: Enumerazione per rappresentare la modalità di visualizzazione dell'animazione, con Mode2D e Mode3D.
• SetEngine~Engine~: Comando per impostare il motore di animazione.
• StartAnimation~Engine~: Comando per avviare l'animazione.
• PauseAnimation~Engine~: Comando per mettere in pausa l'animazione.
• NextTick~Engine~: Comando per aggiungere un tick all'animazione.
• NextTickAdd~Engine~: Comando per aggiungere un numero specifico di tick all'animazione.
• AnimationBatch~Engine~: Comando per specificare la grandezza del batch da eseguire.
• Reset~Engine~: Comando per resettare l'animazione.
• SwitchMode~Engine~: Comando per cambiare la modalità di visualizzazione.

State

Il package state si occupa di gestire lo stato dell'app andando a definire le strutture dati e le interfacce necessarie. Inoltre, vengono implementati i comandi definiti precedentemente del dominio. Lo stato dell'applicazione è totalmente reattivo, in modo da garantire una gestione efficiente e coerente degli aggiornamenti. Lo stato è modificabile solo tramite comandi. In particolare è stato usato il pattern Observer per notificare gli aggiornamenti dello stato.

Observer Pattern

L'Observer Pattern è un pattern di design comportamentale che definisce una dipendenza uno-a-molti tra oggetti, in modo che, quando un oggetto cambia stato, tutti i suoi osservatori vengano notificati e aggiornati automaticamente.

Api

Il package api definisce le interfacce e i parser necessari per comunicare con l'esterno. In particolare, definisce le interfacce per l'aggiunta di nodi e archi, e i relativi parser per convertire i dati in input in strutture dati utilizzabili dall'applicazione.

View

La view è tenuta aggiornata in maniera totalmente reattiva dallo stato dell'applicazione. In particolare, il package view è suddiviso in sotto package per gestire in modo modulare le diverse parti dell'interfaccia grafica. Ogni componente ha il suo controller responsabile della comunicazione con lo stato dell'applicazione.

Graph

Il package graph si occupa di visualizzare il grafo in 3D e definisce le interfacce per la gestione della visualizzazione di nodi e archi. È stato usato il pattern Adapter per adattare le interfacce del dominio a quelle della libreria Three.js. In questo modo è stato possibile separare la logica dell'applicazione dalla libreria grafica.