Sviluppo di un applicazione di front-end per il monitoraggio di un Isola Ecologica

Transcript

1 Sviluppo di un applicazione di front-end per il monitoraggio di un Isola Ecologica Candidato: Lorenzo D Eri Relatore: Prof. Sergio Carrato Correlatore: Ing. Vojko Croselli 2 dicembre 2015 Università degli Studi di Trieste

2 Descrizione del problema

3 Presentazione dell impianto - alcune definizioni Isola Ecologica: Area per il conferimento di rifiuti urbani EECO Check System: Impianto per la gestione degli accessi all Isola Ecologica del comune di Varedo (MB) Permette di: Identificare gli utenti all accesso Gestire il flusso di utenze in entrata ed uscita Controllare il numero massimo di utenze presenti nell impianto Pesare il materiale conferito

4 Architettura di EECO Check System Figura 1: Architettura di EECO Check System

5 Le componenti di EECO Check System (I) EECO Check Server: Servizio NT Comunicazione con il database, gestione dei varchi e comunicazione con il servizio di notifiche ai client EECO Db: Database + DBMS + Librerie.NET Espone un interfaccia di accesso e modifica dei dati EpCore: Controllori HW + Sistema operativo embedded Uno per ogni sistema sbarre-bilancia Gestisce sbarre, bilancia, lettore di badge e display EECO Check Push Service: Servizio NT Intermediario tra EECO Check Server ed EECO Check App Invia notifiche push tramite WebSocket

6 Le componenti di EECO Check System (II) EECO Check UI: Applicazione WPF + Applicazione Silverlight Interfaccia utente per controllo e gestione dei varchi e per visualizzazione dello storico degli eventi Comprende il sottosistema EECO Check Configuration UI (per funzioni amministrative) EECO Check App: Applicazione Android (prototipo) Stesse funzionalità di EECO Check UI (senza EECO Check Configuration UI) EECO Check Web Server: Server IIS Web Server (hosting di EECO Check UI)

7 Diagramma UML Figura 2: Diagramma UML dell impianto nello stato iniziale

8 Requisiti di sviluppo È stata richiesta una nuova versione di EECO Check UI: Senza installazioni di software sul dispositivo Con aggiunta di funzionalità specifiche: Lettura del peso corrente su ogni bilancia Visualizzazione di eventuali errori all accesso al varco Miglioramento delle prestazioni della lista degli eventi Presenza di un modulo per funzioni amministrative (attualmente EECO Check Configuration UI) Rinnovamento dell interfaccia grafica

9 Applicazione Android EECO Check App

10 Tecnologie di sviluppo Sviluppata come applicazione ibrida Tramite tecnologie web: HTML, CSS e JavaScript Utilizzando AngularJS Framework JavaScript Usato per lo sviluppo di Single-Page Applications Implementa il pattern MVC

11 La struttura di EECO Check App Suddivisa in due moduli: Gestione dei varchi Inoltre: Informazioni sui singoli varchi Funzionalità di controllo (alzamento sbarre, messa fuori servizio,...) Lista degli eventi Storico degli eventi Funzionalità di stampa Menù Modulo per i parametri di connessione ad EECO Check Push Service

12 Gestione Varchi Figura 3: Schermata della Gestione Varchi di EECO Check App

13 Lista Eventi Figura 4: Schermata della Lista Eventi di EECO Check App

14 Applicazione Web EECO Check Web App

15 Motivazioni e risultato Perché sviluppare EECO Check Web App? Necessità di un applicazione platform-independent (requisito di sviluppo) Facile da ottenere riutilizzando il codice di EECO Check App Risultato EECO Check Web App Applicazione Web, quindi accessibile tramite browser Hosting su EECO Check Web Server Suddivisa in 2 versioni: Mobile: per tablet Desktop: per PC

16 Differenze rispetto ad EECO Check App Differenze rispetto ad EECO Check App: Aggiunta funzionalità: Visualizzazione del peso nella Gestione Varchi Aggiornamento automatico Lista Eventi Refactoring interno miglioramento prestazioni

17 Gestione Varchi Figura 5: Schermata della Gestione Varchi di EECO Check Web App

18 Lista Eventi Figura 6: Schermata della Lista Eventi di EECO Check Web App

19 Conclusioni

20 Stato iniziale dello sviluppo - Diagramma UML Figura 7: Diagramma UML dell impianto nello stato iniziale

21 Stato finale dello sviluppo - Diagramma UML Figura 8: Diagramma UML dell impianto nello stato finale

22 Riepilogo requisiti di sviluppo! Senza installazioni di software sul dispositivo! Con aggiunta di funzionalità specifiche:! Lettura del peso corrente su ogni bilancia! Visualizzazione di eventuali errori all accesso! Miglioramento delle prestazioni della lista degli eventi % Presenza di un modulo per funzioni amministrative (attualmente EECO Check Configuration UI)! Rinnovamento dell interfaccia grafica

23 Sviluppi futuri Implementazione di EECO Check Configuration UI Dismissione di EECO Check UI Istituzione di un apparato sistematico per il testing Aggiunta di funzionalità di controllo del sistema

24 Dimostrazione pratica