UNIVERSITÀ DEGLI STUDI DI TRIESTE


                  FACOLTÀ DI INGEGNERIA

    CORSO DI LAUREA TRIENNALE IN INGEGNERIA I...
INDICE


1 INTRODUZIONE                                               3

2 ANALISI                                        ...
5.2.4 CREAZIONE DI UN PORTALE                                                             26
5.3 PERSONALIZZAZIONE SEMPLIC...
1 Introduzione

Il lavoro svolto consiste nell’utilizzo della tecnologia SharePoint Services per la progettazione e
realiz...
2 Analisi
2.1 Analisi generale

L’obiettivo è quello di realizzare un portale contente tutti i progetti riguardanti i prog...
Figura 1. Homepage portale Nanotech




                                      Figura 2. Homepage portale MOSE


2.2 Obiett...
Area contenente una raccolta di documenti;
       Delle pagine contenenti la descrizione dettagliata di ogni progetto.

Qu...
3 Progettazione Database
3.1 Raccolta e analisi dei requisiti

3.1.1 Requisiti del Database

Il database deve soddisfare i...
11. Visualizzare tutti i progetti di un dipartimento;
   12. Visualizzare tutte le persone;
   13. Visualizzare tutti i pr...
Codice
                            ID                                                                                     ...
Concetto                   Costrutto                  Volume
      Dipartimento                   Entità                  ...
Al termine di questa fase si ottiene il seguente schema E-R ristrutturato:

          ID
          Nome
          Telefono...
Schema 4. Schema relazionale.




           TblDepartments (ID, Name, City, Adress, Number, CAP, Hide);
           TblPeo...
Queste invece sono le query parametriche:


       vwProjectOfPeople (ID, Name, Surname, ProjectID, ProjectName, Title, Sh...
4 Requisiti interfaccia web
4.1 Elenco requisiti interfaccia web:

Riepilogando le caratteristiche che si vogliono svilupp...
Figura 3. Struttura della homepage di MOSE.

La nostra homepage prenderà spunto da questa con alcune piccole differenze, c...
Figura 4. Struttura della homepage del progetto.

4.2.2 Creazioni elenchi

Come già detto in precedenza, il portale deve c...
Figura 5. Elenco delle persone.

L’elenco dei dipartimenti rappresenta i risultati della query “vwDepartments”, già analiz...
4.2.3 Creazioni raccolte

Una raccolta è una pagina nella quale è possibile creare, aggiungere e modificare documenti di
v...
5 Realizzazione
5.1 Preparazione Macchina virtuale

Come già discusso in precedenza, lo sviluppo del portale deve soddisfa...
l’installazione del sistema operativo, i passaggi di questa fase non verranno però trattati in questo
elaborato.

5.2 Inst...
Figura 11. Installazione ASP.NET e IIS

E’ possibile scaricare gratuitamente le estensioni del Framework.NET 3.0 al seguen...
Figura 12.Modalità installazione WSS

Utilizzando la modalità “Advanced” si potrà poi scegliere il tipo di installazione s...
Figura 13. Tipologia del tipo di installazione del server

Al termine dell’installazione di SharePoint verrà richiesto se ...
Figura 14. Configurazione database

Il passo successivo consiste nello specificare il numero di porta per accedere a “Shar...
Figura 15. Riepilogo informazioni inseriti durante la configurazione WSS

Al termine della configurazione si aprirà automa...
Figura 16. Pagina iniziale SharePoint CentralAdministration

5.2.4 Creazione di un portale

La creazione di un nuovo porta...
Per questa operazione sarà necessario fornire le seguenti informazioni:

       Il nome del nuovo portale Web IIS, che per...
Figura 22. OpzioneRestart IIS

       Database e autenticazione (Figura 23).




                                   Figura...
Figura 25. Selezione della web application

       Il titolo e la descrizione della raccolta del nuovo sito(Figura 26);


...
Figura 29. Menu SiteActions

La modifica di questi elementi avviene dal pulsante “SiteActions” che si trova in alto a dest...
Figura 31. Collegamento nella Barra laterale

       La presenza di una cronologia delle versioni dei documenti (Figura 32...
La presenza di un collegamento alla lista nel menu laterale del sito (QuickLaunch).




                           Figura ...
Figura 37. Informazioni necessarie per creazione lista di annunci

Terminato l’inserimento dei dati richiesti, la lista si...
Figura 40. Percorso logo del portale

Come si può notare SharePoint non permette di selezionare una foto o un’immagine, ma...
Figura 42. Percorso logo del portale

5.3.5 Cambiare tema del portale

Il cambio del tema del portale permette di rendere ...
Figura 44.Aggiunta Web Part nella pagina iniziale

Una volta terminata la personalizzazione di tutte le Web Part cliccando...
2007, un altro prodotto della famiglia SharePoint, il quale grazie ai suoi strumenti avanzati,
permette un maggiore contro...
Figura 47.Pannello Data Source Library

Cliccando su “Connectto a database” posto in “Database Connections”, verrà aperta ...
Figura 49. Configurazione per accedere al DB

Se i dati sono corretti SharePoint visualizzerà tutti i DB presenti nel serv...
Figura51.Alcuni collegamenti alle viste presenti nel nostro DB

5.4.2 Creazione liste personalizzate

Per creare una lista...
Figura 54. Aprire le liste in SharepointDesigner

5.4.3 Personalizzazione liste personalizzate

Per personalizzare una lis...
Figura 56.Selezione della web part

La pagina si presenterà nel seguente modo:




                                  Figur...
E’ così possibile selezionare i campi che si vogliono avere presenti nella lista e trascinarli nella
pagina vuota, ottenen...
Figura 61. Ordinamento campi.

Un’altra modifica che si vuole fare alla lista è quella di unire il nome e il cognome in un...
Figura 62: Cognome e Nome uniti nella stessa cella

Analogamente a come appena fatto per il nome, si andrà a modificare la...
Figura 63. Codice relativo alle colonne

e successivamente si eseguono le seguenti modifiche:




                        ...
Questa parte di codice visualizza un’immagine caricata nella cartella images che fungerà da link a
una pagina dinamica di ...
Figura 68. Pagina lista dei dipartimenti


5.5 Personalizzazione avanzata SharePoint Designer

5.5.1 Lista dei progetti

P...
La Lista visualizzata andrà cancellata, il risultato sarà come inFigura 70. Questa operazione è stata
eseguita perché così...
5.5.2 Analisi pagine dinamiche

Come già accennato, per la realizzazione del portale è necessario creare delle pagine dina...
Per prima cosa vediamo come aggiungere la query-string al link della pagina sorgente, come si
nota guardando il codice rel...
Designer, questa scelta è stata fatta perché così SharePoint è in grado di utilizzare il parametro
ricevuto dalla query st...
Figura 77. Creazione della nuova query

Nel primo campo viene inserito il codice SQL, si può notare che dopo la clausola W...
Figura 78. Pagina dei progetti in cui partecipa una persona

5.5.4 Lista dei progetti di un dipartimento e lista dei proge...
Figura 80. Pagina dei progetti che fanno riferimento a una stessa tipologia di progetti

5.5.5 Pagina dettaglio progetto

...
Figura 81. Query pagina dettaglio di un progetto

L’aspetto finale della pagina è il seguente:




                       ...
Come si nota sul lato sinistro è presente una foto rappresentativa e sotto di essa alcune info quali
sito web, data inizio...
6 Conclusioni

Gli obiettivi sulla realizzazione del portale e del database riguardante i progetti relativi all’energia e
...
7 Bibliografia

    Microsoft MSDN Windows SharePoint Services 3.0
    http://msdn.microsoft.com/en-us/library/bb931737.as...
Tesi di laurea - Progettazione e realizzazione di un portale per la gestione di progetti relativi all’energia e all’ambien...
Upcoming SlideShare
Loading in...5
×

Tesi di laurea - Progettazione e realizzazione di un portale per la gestione di progetti relativi all’energia e all’ambiente con tecnologia WSS 3.0

1,028

Published on

0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,028
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
23
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Tesi di laurea - Progettazione e realizzazione di un portale per la gestione di progetti relativi all’energia e all’ambiente con tecnologia WSS 3.0

  1. 1. UNIVERSITÀ DEGLI STUDI DI TRIESTE FACOLTÀ DI INGEGNERIA CORSO DI LAUREA TRIENNALE IN INGEGNERIA INFORMATICA Progettazione e realizzazione di un portale per la gestione di progetti relativi all’energia e all’ambiente con tecnologia WSS 3.0 Laureando: Relatore: Davide BRAVIN Prof. Maurizio FERMEGLIA Anno Accademico 2009-2010
  2. 2. INDICE 1 INTRODUZIONE 3 2 ANALISI 4 2.1 ANALISI GENERALE 4 2.1.1 PORTALI DI RIFERIMENTO ESISTENTI 4 2.2 OBIETTIVI 5 2.3 VINCOLI 6 2.3.1 SISTEMA 6 2.3.2 VINCOLO SISTEMA OPERATIVO E DBMS 6 2.3.3 VINCOLO WINDOWS SHAREPOINT SERVICES 6 3 PROGETTAZIONE DATABASE 7 3.1 RACCOLTA E ANALISI DEI REQUISITI 7 3.1.1 REQUISITI DEL DATABASE 7 3.1.2 GLOSSARIO DEI TERMINI 7 3.1.3 OPERAZIONE SUI DATI 7 3.2 PROGETTAZIONE DELLA BASE DI DATI 8 3.2.1 PROGETTAZIONE CONCETTUALE 8 3.2.2 PROGETTAZIONE LOGICA 9 3.2.2.1 RISTRUTTURAZIONE DELLO SCHEMA E-R 9 3.2.2.2 TRADUZIONE VERSO IL MODELLO LOGICO 11 3.2.3 REALIZZAZIONE DATABASE 13 4 REQUISITI INTERFACCIA WEB 14 4.1 ELENCO REQUISITI INTERFACCIA WEB: 14 4.2 SVILUPPO REQUISITI 14 4.2.1 PAGINA INIZIALE 14 4.2.2 CREAZIONI ELENCHI 16 4.2.3 CREAZIONI RACCOLTE 18 4.2.4 CREAZIONE PAGINA DEI DETTAGLI DI UN SINGOLO PROGETTO 18 5 REALIZZAZIONE 19 5.1 PREPARAZIONE MACCHINA VIRTUALE 19 5.2 INSTALLAZIONE E CONFIGURAZIONE AMBIENTE DI LAVORO 20 5.2.1 REQUISITI PER L’INSTALLAZIONE DI WSS 20 5.2.2 INSTALLAZIONE MICROSOFT SQL SERVER 2005 21 5.2.3 INSTALLAZIONE WSS 21 1
  3. 3. 5.2.4 CREAZIONE DI UN PORTALE 26 5.3 PERSONALIZZAZIONE SEMPLICE VIA WEB 29 5.3.1 CREAZIONE DI UNA LIBRERIA DI DOCUMENTI 30 5.3.2 CREAZIONE DI UNA LISTA DI LINK 31 5.3.3 CREAZIONE DI UNA LISTA DI ANNUNCI 32 5.3.4 AGGIUNGERE UN LOGO PORTALE E MODIFICARE L’INTESTAZIONE DEL PORTALE 33 5.3.5 CAMBIARE TEMA DEL PORTALE 35 5.3.6 GESTIONE WEB PART NELLA HOME PAGE 35 5.4 PERSONALIZZAZIONE BASE SHAREPOINT DESIGNER 36 5.4.1 CONNESSIONE AL DATABASE 37 5.4.2 CREAZIONE LISTE PERSONALIZZATE 40 5.4.3 PERSONALIZZAZIONE LISTE PERSONALIZZATE 41 5.4.3.1 LISTA DELLE PERSONE 41 5.4.3.2 LISTA DEI TIPI DI PROGETTO E DIPARTIMENTI 47 5.5 PERSONALIZZAZIONE AVANZATA SHAREPOINT DESIGNER 48 5.5.1 LISTA DEI PROGETTI 48 5.5.2 ANALISI PAGINE DINAMICHE 50 5.5.3 LISTA DEI PROGETTI DELLE PERSONE 50 5.5.4 LISTA DEI PROGETTI DI UN DIPARTIMENTO E LISTA DEI PROGETTI DI UN TIPO DI PROGETTO 54 5.5.5 PAGINA DETTAGLIO PROGETTO 55 5.5.6 PAGINA INIZIALE 57 6 CONCLUSIONI 58 7 BIBLIOGRAFIA 59 2
  4. 4. 1 Introduzione Il lavoro svolto consiste nell’utilizzo della tecnologia SharePoint Services per la progettazione e realizzazione di un portale che permetta di gestire tutti i progetti universitari inerenti all’energia e all’ambiente. L’obiettivo finale della tesi è la realizzazione di un portale di facile aggiornamento, che permetta di visualizzare i dati presenti in una base di dati e di condividere informazioni con l’esterno. La presenza di molti progetti relativi all’energia e all’ambiente, referenti a diversi dipartimenti, ha portato alla necessità di realizzare una base di dati e un portale, che permettano di memorizzare, raggruppare e condividere le informazioni riguardanti questi progetti. Le fasi principali dello sviluppo del portale sono le seguenti: Analisi degli obiettivi e delle funzionalità richieste dal portale; Raccolta e analisi dei requisiti della base di dati; Progettazione della base di dati; Realizzazione della base di dati; Analisi e studio della tecnologia utilizzata per la realizzazione e personalizzazione del portale; Realizzazione dell’interfaccia grafica del portale; Realizzazione della documentazione sulle operazioni svolte. Il portale sarà ospitato dal web server del DICAMP e questo porta a definire alcuni vincoli di compatibilità. Il sistema operativo utilizzato nel web server è Microsoft Windows Server 2003, il DBMS installato è Microsoft SQL Server 2005, la tecnologia utilizzata per la creazione del portale è Microsoft Windows SharePoint Services 3.0, il software per la personalizzazione del portale è Microsoft Office SharePoint Designer 2007. La seguente tesi si suddivide in 4 capitoli, che ripercorrono le fasi dello svolgimento del lavoro. Nel capitolo 2 viene descritta la fase di analisi dei requisiti e gli obiettivi che si vogliono ottenere, tenendo conto dei vincoli realizzativi. Nel capitolo 3 viene descritta la fase di realizzazione della base di dati. Questa fase comprende la fase di analisi e di progettazione del Database. Nel capitolo 4 vengono descritti i requisiti dell’interfaccia grafica del portale, compreso il layout della pagina iniziale e delle altre pagine. Nel capitolo 5 viene descritta la fase di realizzazione del portale, in questa fase viene descritta la realizzazione del portale e delle pagine che lo compongono. 3
  5. 5. 2 Analisi 2.1 Analisi generale L’obiettivo è quello di realizzare un portale contente tutti i progetti riguardanti i progetti relativi a energia e ambiente. In seguito ai colloqui col committente si è deciso di realizzare un portale con pagine dinamiche in grado di visualizzare informazioni sempre aggiornate, che permetta una semplice gestione, soprattutto, nella modifica e nell’aggiornamento dei contenuti. I contenuti del portale devono essere presenti in un Database esterno, questo deve essere creato completamente poiché non esiste nessuna base di dati esistente. 2.1.1 Portali di riferimento esistenti Come riferimento, per quanto riguarda il layout e le funzioni, sono stati presi d’esempio i portali Nanotech (Figura 1) e MOSE (Figura 2), più in dettaglio si è scelto di implementare le seguenti funzionalità: Barra superiore contenente logo del portale e logo dell’Università degli Studi di Trieste; Barra laterale contenente link ipertestuali a pagine interne al portale; Elenco a link ipertestuali a siti web esterni; Elenco di News; Raccolta di documenti pubblici e privati. I portali sopra citati sono stati sviluppati utilizzando la stessa tecnologia scelta per lo sviluppo del portale Energia e Ambiente, anche per questa caratteristica sono stati scelti come siti di riferimento, permettendo una semplice realizzazione delle funzionalità implementate. 4
  6. 6. Figura 1. Homepage portale Nanotech Figura 2. Homepage portale MOSE 2.2 Obiettivi L’obiettivo finale è quello di creare il portale contenente le seguenti funzionalità: Homepage contenente le novità e gli annunci; Una pagina contenente l’elenco completo del personale referente ai vari dipartimenti; Una pagina contenente l’elenco dei dipartimenti; Una pagina contenente tutte le tipologie di progetto; Una pagina contenente l’elenco completo dei progetti; 5
  7. 7. Area contenente una raccolta di documenti; Delle pagine contenenti la descrizione dettagliata di ogni progetto. Questi dati devono essere presenti su un database appositamente creato in modo da facilitare la gestione degli stessi. 2.3 Vincoli 2.3.1 Sistema Per motivi di compatibilità con il web server esistente, il portale deve rispettare i seguenti vincoli: Sistema Operativo Microsoft Windows Server 2003; Microsoft SQL Server 2005; Microsoft Windows SharePoint Services 3.0. 2.3.2 Vincolo Sistema Operativo e DBMS Per garantire la portabilità del portale al web server si è vincolati all’utilizzo del sistema operativo MS Windows Server 2003 e del DBMS MS SQL Server 2005, questo permette di evitare problemi legati alla migrazione dall’ambiente di sviluppo al web server. 2.3.3 Vincolo Windows SharePoint Services Un altro importante vincolo è quello all’utilizzo di MS Windows SharePoint Services 3.0, inparticolare è stata utilizzata la versione 12.0.6425.1000 con SP2. WSS 3.0 offre una tecnologia versatile utilizzabile da organizzazioni per migliorare l'efficienza dei processi aziendali e la produttività dei team, questo grazie a strumenti di collaborazione che consentono agli utenti di comunicare indipendentemente dall'ubicazione geografica. 6
  8. 8. 3 Progettazione Database 3.1 Raccolta e analisi dei requisiti 3.1.1 Requisiti del Database Il database deve soddisfare i seguenti requisiti: Nella base di dati devono essere presenti tutti i progetti. Per ogni progetto si vuole memorizzare nome, titolo (acronimo), descrizione breve, descrizione estesa, immagine del progetto, budget, data d’inizio, dattermine, link al sito del progetto ed eventualmente delle note. Ogni progetto ha uno e un solo dipartimento di riferimento, un project manager, un finanziatore e uno o più tipi di progetto (esempio eolico, biomasse, ecc..). Delle persone si vuole memorizzare solamente Nome, Cognome, e-mail e un eventuale link a un sito personale.Di ogni dipartimento si vuole memorizzare Nome, indirizzo e link al sito web. 3.1.2 Glossario dei termini TERMINE DESCRIZIONE SINONIMI COLLEGAMENTI Progetti Piano di lavoro, Persone, dipartimenti, ordinato e finanziatore, tipo di particolareggiato. progetto Persone Dipendenti che Dipartimento,progetto partecipano a uno o più progetti. Dipartimento Struttura fisica nella Persone, progetto quale lavorano dei dipendenti Tipi di progetti Tipologia dei progetti Tipi Progetto 3.1.3 Operazione sui dati 1. Inserimento dati persone; 2. Inserimento dati dipartimenti; 3. Inserimento dati progetti; 4. Inserimento partecipazione delle persone ai progetti; 5. Inserimento tipi di progetto; 6. Inserimento finanziatori; 7. Modifica dati persone; 8. Modifica dati dipartimento; 9. Modifica dati progetto; 10. Visualizzare tutti i progetti; 7
  9. 9. 11. Visualizzare tutti i progetti di un dipartimento; 12. Visualizzare tutte le persone; 13. Visualizzare tutti i progetti di una persona; 14. Visualizzare tutti i dipartimenti; 15. Visualizzare tutti i progetti di un dipartimento; 16. Visualizzare tutti i tipi di progetto; 17. Visualizzare tutti i progetti di un tipo di progetto; 18. Visualizzare i dettagli di un progetto. 3.2 Progettazione della base di dati 3.2.1 Progettazione concettuale Per la progettazione concettuale si è scelto di utilizzare una strategia di progettazione mista. Si parte dallo schema scheletro, si suddividono in sottoproblemi e si applicano successivi raffinamenti (Schema 1). GENERE PERSONE PARTECIPAZIONE PROGETTO AFFERENZA TIPO DIPARTIMENTO PROGETTO Schema 1. Schema scheletro. Al termine della progettazione concettuale si ottiene il seguente schema concettuale con attributi e cardinalità: 8
  10. 10. Codice ID Nome Nome Cognome Telefono Link Note Indirizzo Telefono Link E-mail (0,n) (0,1) DIPARTIMENTO AFFERENZA PERSONE (0,n) ID Capo Progetto Nome Descrizione Breve Dip. Riferimento Descrizione Completa Budget PARTECIPAZIONE Attivo Inizio Fine Link (0,n) Note (1,n) (1,n) GENERE PROGETTO TIPOLOGIA PROGETTO (1,1) Tipo Descrizione ID FINANZIATO (0,n) FINANZIATORE Tipologia ID Schema 2. Schema concettuale con attributi e cardinalità 3.2.2 Progettazione logica 3.2.2.1 Ristrutturazione dello schema E-R Tavola dei volumi: 9
  11. 11. Concetto Costrutto Volume Dipartimento Entità 20 Persone Entità 100 Progetto Entità 500 Tipo Progetto Entità 10 Finanziatore Entità 50 Afferenza Relazione 100 Partecipazione Relazione 4000 Tipologia Relazione 1000 Finanziato Relazione 500 Esempio tavola accessi perl’operazione: Visualizzare tutti i dettagli di un progetto: Tavola accessi: Concetto Costrutto Accessi Tipo Progetto Entità 1 L Finanziato Relazione 1 L Finanziatore Entità 1 L Tipologia Relazione 2 L Tipo Progetto Entità 2 L Partecipa Relazione 8 L Persone Entità 8 L Afferenza Relazione 1 L Dipartimento Entità 1 L La prima fase della progettazione logica consiste nella ristrutturazione dello schema E-R ottenuto dalla progettazione concettuale. In questa fase, utilizzando anche le tavole dei volumi e le tavole degli accessi, vengono analizzate le ridondanze, eliminate le generalizzazioni, accorpate o partizionate le relazioni o le entità. 10
  12. 12. Al termine di questa fase si ottiene il seguente schema E-R ristrutturato: ID Nome Telefono Indirizzo Link (0,n) (0,1) DIPARTIMENTO RIFERIMENTO ID Nome (0,n) Descrizione Breve Descrizione Completa Budget AFFERENZA Inizio Fine Link (0,1) Capo Progetto Note (0,n) (0,n) PERSONE PARTECIPAZIONE PROGETTO Codice Nome Cognome (1,1) Link Note (1,n) Telefono E-mail TIPOLOGIA FINANZIATO (0,n) (1,n) GENERE FINANZIATORE PROGETTO Tipologia ID Tipo Descrizione ID Schema 3. Schema E-R ristrutturato 3.2.2.2 Traduzione verso il modello logico La seconda fase della progettazione logica consiste nella traduzione dello schema E-R verso il modello relazionale. Schema logico: 11
  13. 13. Schema 4. Schema relazionale. TblDepartments (ID, Name, City, Adress, Number, CAP, Hide); TblPeople (ID, Name, Surname, E-mail, Link, Notes, Department); TblPartecipate (People, Projects, Projects Manager); TblProjects (ID, Name, Title, Short Description, Long Description, Image, Budget, Start Date, End Date, Notes, Link, Financier, ReferenceDepartment, Home); TblTipology (Projects, ProjectsTypes); TblProjectsTypes (ID, Type, Description); TblSponsor (ID, Name, Type). Inoltre le viste create sono le seguenti: vwDepartments (Name, City, Adress, Number, Cap, Link, ID, Hide); vwPeople (ID, Name, Surname, E-Mail, Link, Notes, Department) Dove “Department”èaliasdi“name” in TblDepartments; vwProjectsType (ID, Type, Description); vwProjectHome(ID, Name, Title, ShortDescription, Link, Image, Type, ReferenceDepartment) Questa vista ha come condizione che l’attributo “Home” di TblProjects sia posto a “true”; spAllProjects (ID, Name, Title, ShortDescription,LongDescription, Link, Image, StartDate, EndDate, ReferenceDepartment) Dove “ReferenceDepartment” è alias di“name” in TblDepartments; 12
  14. 14. Queste invece sono le query parametriche: vwProjectOfPeople (ID, Name, Surname, ProjectID, ProjectName, Title, ShortDescription, Image, Department) dove “ProjectID” è alias di “ID” in TblProjects, “ProjectName” è alias di “Name” in TblProjects, “Department” è alias di“name” in TblDepartments. Il parametro in ingresso è l’ID della persona. vwProjectOfDepartment (ID, Department, ProjectID, ProjectName, Title, ShortDescription, Image) dove “ProjectID” è alias di “ID” in TblProjects, “ProjectName” è alias di “Name” in TblProjects, “Department” è alias di“name” in TblDepartments. Il parametro in ingresso è l’ID del dipartimento. vwProjectOfProjectType (ProjectTypeID, Type, ProjectID, ProjectName, Title, ShortDescription, Image) dove “ProjectID” è alias di “ID” in TblProjects, “ProjectName” è alias di “Name” in TblProjects, “Department” è alias di“name” in TblDepartments, “ProjectTypeID” è alias di “ID” in TblProjectType. Il parametro in ingresso è l’ID del tipo di progetto. ProjectDetail (ID, Name, Title, ShortDescription, Link, Image, Type, ReferenceDepartment) Il parametro in ingresso è l’ID del progetto. 3.2.3 Realizzazione Database Dopo aver tradotto lo schema E-R nel modello logico, la realizzazione fisica è immediata. Si è deciso di adottare un Access Data Project (.ADP) per la realizzazione fisica del Database. Un Microsoft Access project è un file dati di Access che fornisce l'accesso a un database Microsoft SQL Server. Utilizzando un Access project è possibile creare un'applicazione client/server con grande semplicità, infatti è possibile creare maschere e viste del nostro DB in poco tempo. Si è scelto di realizzare delle maschere provvisorie per l’inserimento di dati di prova nella base di dati, tutto questo è stato realizzato utilizzando MS Access 2007. 13
  15. 15. 4 Requisiti interfaccia web 4.1 Elenco requisiti interfaccia web: Riepilogando le caratteristiche che si vogliono sviluppare nel portale sono: 1. Una pagina iniziale; 2. Una pagina contenente l’elenco delle persone; 3. Una pagina contenente l’elenco dei dipartimenti; 4. Una pagina contenente l’elenco di tutti i progetti; 5. Una pagina contenente l’elenco di tutte le tipologie di progetto; 6. Una raccolta di documenti pubblici; 7. Una raccolta di documenti privati; 8. Una raccolta di annunci e dei link; 9. Una pagina dettagliata di ogni progetto. 4.2 Sviluppo requisiti 4.2.1 Pagina iniziale La Pagina iniziale è la prima pagina che appare appena ci si collega al portale, a partire da questa il visitatore si sposterà nelle varie sezioni del portale. Analizzando l’homepage di MOSE, possiamo notare che è presente un’intestazione iniziale contenente logo e nome del portale, sul lato sinistro troviamo un’area riservata al menu, e una parte centrale contente una lista delle pubblicazioni in evidenza. In foto è possibile vedere uno schema semplificato della pagina iniziale (Figura 3). 14
  16. 16. Figura 3. Struttura della homepage di MOSE. La nostra homepage prenderà spunto da questa con alcune piccole differenze, come visibile in Figura 4, tra queste si vuole riservare un’area alla destra della pagina per inserire dei link e degli annunci. Nella parte centrale si vuole inserire un elenco dei progetti in evidenza. 15
  17. 17. Figura 4. Struttura della homepage del progetto. 4.2.2 Creazioni elenchi Come già detto in precedenza, il portale deve contenere una serie di elenchi, i dati presenti in questi elenchi devono essere letti dalla rispettiva vista presente nel database creato, nello specifico per ogni elenco si ha la seguente corrispondenza: Elenco “Persone” visualizza i risultati della vista “vwPeople”; Elenco “Dipartimenti” visualizza i risultati della vista “vwDepartments”; Elenco dei “Progetti” visualizza i risultati della stored procedure “spAllProjects”; Elenco dei “Tipi di Progetto” visualizza i risultati della vista “vwProjectsType”. Analizziamo singolarmente la visualizzazione degli elenchi. L’elenco delle persone rappresenta i risultati della query “vwPeople”, già analizzata in precedenza. Nella pagina sono visualizzati il nome, il cognome, un indirizzo di posta elettronica e un collegamento a un sito web personale (se esistenti), un link a tutti i progetti a cui partecipa o ha partecipato e infine il dipartimento di riferimento. Poiché il numero di persone è elevato, si è deciso di usare una rappresentazione di tipo tabellare, come si può vedere nella Figura 5. 16
  18. 18. Figura 5. Elenco delle persone. L’elenco dei dipartimenti rappresenta i risultati della query “vwDepartments”, già analizzata in precedenza. Nella pagina sono visualizzati il nome del dipartimento, la città in cui si trova, il codice di avviamento postale (CAP) e il suo indirizzo, un collegamento al sito del dipartimento (se esistente) e infine un link a tutti i progetti che fanno riferimento a quel dipartimento. Anche in questo caso, come si vede nellaFigura 6, visto il numero di dipartimenti si è scelta una rappresentazione di tipo tabellare per rendere velocemente leggibile tutti i dati visualizzati. Figura 6. Elenco dei dipartimenti. L’elenco dei tipi di progetto rappresenta i dati della query “vwProjectsType”, già analizzata in precedenza. Nella pagina sono visualizzati il tipo di progetto (Nome), una descrizione e infine il collegamento a tutti i progetti di quel tipo. Come negli elenchi precedenti la rappresentazione è sempre di tipo tabellare, come si può vedere nella Figura 7: Figura 7. Elenco dei tipi di progetti. L’elenco dei progetti rappresenta i dati della query “vwAllProjects”, già analizzata in precedenza. In questo elenco sono visualizzati alcuni dettagli significativi dei progetti, quali il nome e l’acronimo, un’immagine rappresentativa, il dipartimento di riferimento e infine una breve descrizione del progetto. In questo caso si è scelto di utilizzare una rappresentazione personalizzata, come si può vedere nella Figura 8. In alto sono visualizzati il nome e l’acronimo del progetto, sotto di questi sulla sinistra viene visualizzata un’immagine rappresentativa del progetto e a lato di questa vengono visualizzati il dipartimento e la descrizione. Figura 8. Elenco dei progetti. 17
  19. 19. 4.2.3 Creazioni raccolte Una raccolta è una pagina nella quale è possibile creare, aggiungere e modificare documenti di vario genere, così da permettere la condivisione con altri utenti. Per il portale sono necessarie quattro raccolte. Per quanto riguarda l’aspetto, queste non prevedono particolari personalizzazioni dall’aspetto di default. Le due raccolte di documenti permettono, a chi è autorizzato, di condividere documenti di vari formati con l’esterno. Le due raccolte si differenziano tra loro per i permessi di lettura, una sarà pubblica e quindi visibile a tutti, la seconda sarà privata e quindi visibile alle sole persone autorizzate. La raccolta di annunci permette di inserire annunci e novità riguardanti le tematiche del portale, questa raccolta sarà inserita nella homepage in modo da renderla visibile appena si accede al sito. La raccolta di link permette di creare un elenco di collegamenti a siti web e portali affini alle tematiche del sito. Anche questa raccolta sarà inserita nella homepage del portale in modo da permettere un rapido accesso. 4.2.4 Creazione pagina dei dettagli di un singolo progetto Il portale deve avere una pagina contenente una descrizione dettagliata di ogni singolo progetto. Visto il grande numero di progetti sarebbe scomodo creare una pagina per ogni singolo progetto, soprattutto al momento dell’aggiunta di uno nuovo. Quindi si è deciso di sviluppare una pagina dinamica che permetta di avere un unico modello, ma che sia in grado di visualizzare le informazioni corrette (/richieste) inserendo come parametro l’ID del progetto. La pagina del dettaglio progetto, come si nota nellaFigura 9, visualizza il nome del progetto, la foto rappresentativa, il collegamento al sito di riferimento, la data d’inizio e di fine (se presente), il finanziatore, il dipartimento di riferimento e una descrizione estesa. Figura 9. Pagina dettaglio progetto. 18
  20. 20. 5 Realizzazione 5.1 Preparazione Macchina virtuale Come già discusso in precedenza, lo sviluppo del portale deve soddisfare dei vincoli di compatibilità con il server che dovrà ospitarlo, i vincoli riguardano il sistema operativo, il DBMS (Data Base Management System) e Windows SharePoint Services (WSS). Le versioni installate nel server sono: Windows Server 2003; MS SQL Server 2005; Windows SharePoint Services 3.0. Si è scelto di utilizzare un software di virtualizzazione per installare il sistema in una macchina virtuale. Una macchina virtuale permette di creare un ambiente che opera in modo completamente indipendente rispetto al sistema ospitante, rendendo così possibile la realizzazione di un ambiente di sviluppo pronto all’uso. La scelta del software di virtualizzazione è ricaduta sull’ottimo VirtualBox (Figura 10) inizialmente sviluppato da Innotek, successivamente da Sun Microsystem e attualmente distribuito dalla Oracle. La versione utilizzata è la 3.2.6 l’ultima disponibile all’inizio dello sviluppo, scaricabile a questo indirizzo:http://www.virtualbox.org/wiki/Downloads Figura 10. Schermata principale VirtualBox. L’installazione della macchina virtuale è molto semplice: aperto VirtualBox, si clicca sull’icona “Nuova” nella barra degli strumenti, partirà un wizard che renderà possibile la creazione della macchina virtuale in pochi semplici passaggi.Questowizard permette di assegnare alla macchina virtuale un nome, il sistema operativo da installare, il quantitativo di ram da allocare e lo spazio riservato nell’hard disk. Al primo avvio della macchina virtuale si dovrà procedere con 19
  21. 21. l’installazione del sistema operativo, i passaggi di questa fase non verranno però trattati in questo elaborato. 5.2 Installazione e configurazione ambiente di lavoro Dopo aver installato e aggiornato Windows Server 2003 si procede con l’installazione e la configurazione di tutti i software e dei servizi necessari per il perfetto funzionamento del sistema. 5.2.1 Requisiti per l’installazione di WSS I requisiti necessari per installare WSS 3.0 nel sistema utilizzato sono: 1. Sistema Operativo Windows Server 2003; 2. Internet Information Services (IIS) 6.0; 3. ASP.NET 2.0 Framework; 4. Microsoft .NETFramework 3.0; 5. Internet Explorer 6.0 o superiore. Dopo l’installazione del Sistema Operativo si procede con l’installazione dell’IIS e del Framework di ASP.NET. Si entra in “PannelControl”, poi “Add or RemovePrograms” e infine si clicca su “Add/Remove Windows Components”; qui si spuntano le voci “Internet Information Services (IIS)” e “ASP.NET” che si trovano in “Application Server” (Figura 11). 20
  22. 22. Figura 11. Installazione ASP.NET e IIS E’ possibile scaricare gratuitamente le estensioni del Framework.NET 3.0 al seguente indirizzo: http://www.microsoft.com/downloads/en/details.aspx?FamilyID=10cc340b-f857-4a14-83f5- 25634c3bf043 La versione di Internet Explorer utilizzata è la 8, l’ultima disponibile attualmente, scaricabile tramite gli aggiornamenti di Windows. Una volta soddisfatti questi requisiti è possibile procedere con l’installazione di WSS, scaricabile gratuitamente all’indirizzo: http://www.microsoft.com/downloads/en/details.aspx?FamilyID=ef93e453-75f1-45df-8c6f- 4565e8549c2a 5.2.2 Installazione Microsoft SQL Server 2005 La tecnologia WSS utilizza un DB per memorizzare tutte le informazioni e le configurazioni del portale. Durante l’installazione è possibile scegliere se utilizzare un DB interno di SharePoint, oppure se memorizzare su un DB esterno qualeMSSQL Server 2005. Nel primo caso SharePoint si occuperà di installare una versione di SQL Server Express, nell’altro caso invece userà un DBMS già installato nella macchina. Poiché in questo lavoro si è scelto di utilizzare il secondo metodo, prima di procedere con l’installazione di WSS è stato necessario installare SQL Server 2005. 5.2.3 Installazione WSS Durante l’installazione di WSS per prima cosa si dovrà scegliere se procedere con un’installazione di tipo “Basic” o “Advanced” (Figura 12). Nel primo caso SharePoint si occuperà di installare il DB e di configurarlo automaticamente con le impostazioni predefinite, nel secondo caso invece sarà possibile scegliere/decidere le impostazioni per il server. 21
  23. 23. Figura 12.Modalità installazione WSS Utilizzando la modalità “Advanced” si potrà poi scegliere il tipo di installazione sul server tra “Stand-Alone” e “Web Front End”, i quali differiscono per la posizione in cui verrà creato il DB. In questo caso si è deciso di proseguire con un’installazione di tipo “Web Front End” (Figura 13). 22
  24. 24. Figura 13. Tipologia del tipo di installazione del server Al termine dell’installazione di SharePoint verrà richiesto se si desidera avviare il wizard di configurazione delle tecnologie SharePoint. Accettando si aprirà una finestra (Figura 14). Per poter configurare correttamente WSS sarà necessario indicarvi sia il nome del Database Server che del DB in cui saranno memorizzati i dati delle configurazioni. Sempre nella stessa finestra verranno richiesti anche l’username e la password per accedere al motore DB. 23
  25. 25. Figura 14. Configurazione database Il passo successivo consiste nello specificare il numero di porta per accedere a “SharePoint CentralAdministration Web Application”, la Web Application permette di accedere alle opzioni di configurazione. Le porte disponibili sono dalla1 alla 65535, è importante che la porta scelta non sia già utilizzata nel server. In questo caso la porta utilizzata è 44840. Cliccando sul pulsante “Next” apparirà una schermata di riepilogo (Figura 15), la quale permetterà di verificare la correttezza dei dati immessi, verificato ciò si potrà proseguire e iniziare la configurazione dei prodotti SharePoint. 24
  26. 26. Figura 15. Riepilogo informazioni inseriti durante la configurazione WSS Al termine della configurazione si aprirà automaticamente “SharePoint CentralAdministration”. La Web Application è composta principalmente da tre parti: “Home”, “Operations”, “Application Management” (Figura 16). Tralasciando la prima, la pagina “Operations” permette di amministrare il server WSS, gestire le configurazioni di sicurezza, eseguire backup e ripristinare i dati, eseguire una diagnostica dei log, ecc.. La pagina “Application Management”, invece, permette di gestire le opzioni di configurazione dei componenti e delle applicazioni WSS installate nel server, come creare, modificare e cancellare applicazioni, creare o eliminare raccolte di siti, ecc.. 25
  27. 27. Figura 16. Pagina iniziale SharePoint CentralAdministration 5.2.4 Creazione di un portale La creazione di un nuovo portale avviene dalla pagina “Application Management” in “SharePoint CentralAdministration”, come si vede in Figura17 Figura17.Pagina Application ManagmentdelSharepoint Central Administration Per prima cosa è necessario creare o estendere un’applicazione Web, cliccando “Create or extend Web application”. 26
  28. 28. Per questa operazione sarà necessario fornire le seguenti informazioni: Il nome del nuovo portale Web IIS, che permette di identificare il portale (Figura 18); Figura 18. Creazione web site IIS La porta assegnata al portale Web, la quale può essere scelta casualmente ma è importante che non sia già utilizzata (Figura 19); Figura 19. Porta del nuovo web site IIS Configurazioni delle impostazioni di sicurezza (Figura 20); Figura 20. Provider di autenticazione L’indirizzo URL con cui è raggiungibile l’applicazione (Figura 21); Figura 21. URL del nuovo web site IIS Opzionerestart IIS, se settata su “manuale” si dovrà riavviare manualmente l’IIS al termine della creazione dell’applicazione (Figura 22); 27
  29. 29. Figura 22. OpzioneRestart IIS Database e autenticazione (Figura 23). Figura 23. Database e autenticazione Dopo aver completato l’inserimento di tutte le informazioni, avrà inizio la creazione dell’applicazione, al termine della quale verrà visualizzata una schermata di conferma. Nel caso si sia selezionato l’opzione “Restart IIS Manualy” prima di procedere con la creazione della raccolta dei siti sarà necessario eseguire il reset dell’IIS. Dal menù “Start” si apre “Run” (“Esegui”, se il sistema operativo è in Italiano) si digita “iisreset /noforce” cliccando poi su “OK” (Figura 24), in questo modo verrà riavviato il servizio IIS.Questo passaggio è necessario prima di poter utilizzare l’applicazione appena creata. Figura 24. Comando reset IIS A questo punto è necessario creare una nuova “raccolta siti” basata sull’applicazione appena creata, riportandoci nella pagina “Application Management” si seleziona la voce “Create Site collection”. In questo caso si dovranno fornire le seguenti informazioni: Selezionare l’Applicazione Web appena creata (Figura 25); 28
  30. 30. Figura 25. Selezione della web application Il titolo e la descrizione della raccolta del nuovo sito(Figura 26); Figura 26. Titolo e descrizione del nuovo sito Nome utente dell’amministratore della raccolta (Figura 27). Figura 27. Username dell’amministratore Dopo aver completato l’inserimento di tutte le informazioni, la raccolta verrà creata e il portale sarà accessibile (Figura 28). Figura 28. Pagina iniziale nuovo sito 5.3 Personalizzazione semplice via web Il portale appena creato si presenta molto semplice e scarno. Come prima cosa SharePoint mette a disposizione degli strumenti per creare e personalizzare raccolte, liste e altre funzionalità(Figura 29). 29
  31. 31. Figura 29. Menu SiteActions La modifica di questi elementi avviene dal pulsante “SiteActions” che si trova in alto a destra, questo mostra tre diversi sottomenu: “Create”, “EditPage”, “SiteSettings”. Questi sottomenu hanno le seguenti funzioni: “Create” permette di aggiungere vari elementi al portale Web quali liste, librerie di vario genere (documenti, foto, ecc), pagine web, calendari, annunci, ecc.; “EditPage” permette di aggiungere, togliere o aggiornare le Web Part presenti nella pagina; “SiteSettings” permette di gestire tutte le opzioni del portale, ad esempio la gestione degli utenti e dei permessi, l’aspetto del sito (temi, logo, descrizione, gestione del menu laterale, ecc), opzioni di amministrazione, ecc.. 5.3.1 Creazione di una libreria di documenti La libreria di documenti è una pagina nella quale è possibile avere una raccolta, di documenti o altri file, condivisa. Per creare una libreria di documenti si seleziona “Create” dal menu “SiteActions” e nella pagina appena aperta si seleziona “DocumentLibrary”. Le informazioni necessarie per la creazione della raccolta di documenti sono: Il nome della raccolta; Un’eventuale descrizione (Figura 30); Figura 30. Nome e descrizione libreria di documenti La presenza di un link alla raccolta nel menu laterale del sito (QuickLaunch, Figura 31); 30
  32. 32. Figura 31. Collegamento nella Barra laterale La presenza di una cronologia delle versioni dei documenti (Figura 32) Figura 32. Cronologia versione documenti Il modello dei documenti di default per i documenti creati (Figura 33). E’ possibile scegliere tra molti tipi di documenti, come documento di testo (Word), foglio elettronico (Excel), presentazione (Powerpoint), nessun modello, ecc.. Figura 33. FIGURA TEMPLATE Terminato l’inserimento dei dati richiesti la raccolta si presenterà come in Figura 34: Figura 34. Libreria di documenti Com’è possibile notare si possono creare documenti o caricarne di propri dal computer in uso. Inoltre è possibile creare cartelle ed eseguire altre azioni più o meno complesse. 5.3.2 Creazione di una lista di link La lista di link è una lista contenente collegamenti a pagine Web o ad altre risorse che si vuole condividere. Per creare una lista di link si seleziona “Create” dal menu “Site Actions” e nella pagina appena aperta si seleziona “Link” (Figura 35) Le informazioni necessarie per la creazione della collezione di link sono: Il nome della lista; Un’eventuale descrizione; 31
  33. 33. La presenza di un collegamento alla lista nel menu laterale del sito (QuickLaunch). Figura 35. Informazioni necessarie per creazione lista di link Terminato l’inserimento dei dati richiesti, la lista si presenterà come in Figura 36: Figura 36. Lista di link 5.3.3 Creazione di una lista di annunci La lista di annunci permette di condividere notizie, novità o altre brevi informazioni in modo semplice. Per creare una lista di annunci si seleziona “Create” dal menu “SiteActions” e nella pagina appena aperta si seleziona “Announcements” (Figura 37). Le informazioni necessarie per la creazione della lista sono: Il nome della lista; Un’eventuale descrizione; La presenza di un link alla lista nel menu laterale del sito (QuickLaunch). 32
  34. 34. Figura 37. Informazioni necessarie per creazione lista di annunci Terminato l’inserimento dei dati richiesti, la lista si presenterà come in Figura 38. Figura 38. Lista di annunci 5.3.4 Aggiungere un logo portale e modificare l’intestazione del portale SharePoint offre la possibilità di aggiungere un logo al portale e modificare l’intestazione. Di default il nome è quello scelto al momento della creazione. Per variare queste caratteristiche selezionare “SiteSettings” dal menu “SiteActions” e nella pagina appena aperta selezionare “Title, Description and Icon” (Figura 39). In questa pagina si può cambiare il nome e la descrizione del portale. Figura 39. Nome e descrizione del portale E’ possibile anche inserire l’indirizzo al logo voluto per il portale (Figura 40). 33
  35. 35. Figura 40. Percorso logo del portale Come si può notare SharePoint non permette di selezionare una foto o un’immagine, ma permette solo di inserire l’URL all’immagine in questione che deve essere presente nel Web Server. Per caricare l’immagine nelle cartelle del portale si è utilizzato SharePoint Designer, strumento utile anche in seguito per una maggiore personalizzazione del portale. Per prima cosa, dopo aver aperto SharePoint Designer, verrà aperto il nostro sito tramite “Open Site” dal menu “File”, effettuato ciò è possibile vedere tutte le cartelle che compongono il portale. Per caricare l’immagine, la procedura è la seguente: selezionare la cartella nella quale si vuole importare la foto, cliccare la voce “Import” dal menu “File” e selezionare il logo d’interesse. Una volta terminata questa fase, si potrà ritrovare l’immagine all’interno della cartella del nostro portale. Nel nostro caso si è deciso di importare l’immagine nella cartella “images” così da aver riunito tutte le immagini del portale in un’unica cartella (Figura 41). Figura 41. FOTO CARTELLA IMAGES Terminata l’importazione si torna alla pagina “Title, Description and Icon” e si scrive l’url come si può vedere in Figura 42. 34
  36. 36. Figura 42. Percorso logo del portale 5.3.5 Cambiare tema del portale Il cambio del tema del portale permette di rendere il suo layout più piacevole, SharePoint mette a disposizioni vari temi oltre a quello di default. Per cambiare il tema selezionare “SiteSettings” dal menu “SiteActions” e nella pagina appena aperta selezionare “Sitetheme”. Nella pagina aperta sarà visibile sulla sinistra un’anteprima del tema e sulla destra il suo nome, scelto un tema si dovrà cliccare “Apply” per confermare. 5.3.6 Gestione Web Part nella Home Page La tecnologia SharePoint permette di modificare la pagina iniziale tramite Web Part. Per aggiungere, sostituire o cancellare delle Web Part nella home page, selezionare “EditPage” dal menu “SiteActions”. La pagina si presenterà come in Figura 43. Figura 43. Edit Mode della pagina iniziale Per prima cosa si procede con l’eliminazione della Web Part contente il logo “SharePoint Services”, per fare ciò si clicca “Delete” dal menù “Edit” presente in alto a destra nella Web Part. A questo punto possibile aggiungere le Web Part contenenti i Link e le News che, come discusso precedentemente, saranno collocate nella parte destra della Pagina Iniziale. Per far ciò si clicca su “Add a Web Part” nella posizione voluta. Verrà così aperta una finestra che ci permetterà di selezionare le Web Part desiderate (Figura 44), che in questo caso saranno “Links” e “News”. 35
  37. 37. Figura 44.Aggiunta Web Part nella pagina iniziale Una volta terminata la personalizzazione di tutte le Web Part cliccando”ExitEdit Mode”, posta subito sotto il menu “siteActions”, si potrà vedere la versione finale dell’Homepage (Figura 45). Figura 45. Pagina iniziale personalizzata 5.4 Personalizzazione base Sharepoint Designer Da quanto descritto precedentementela personalizzazione semplice permette di creare raccolte di documenti, liste di links, di annunci e molto altro. Per raggiungere gli obiettivi fissati questi strumenti, però, non sono sufficienti. Si può ricorrere all’utilizzo di Microsoft SharePoint Designer 36
  38. 38. 2007, un altro prodotto della famiglia SharePoint, il quale grazie ai suoi strumenti avanzati, permette un maggiore controllo nella realizzazione del portale. L’utilizzo di SharePoint Designer 2007 non si limita ad un’ulteriore personalizzazione del portale, ma è anche necessario per permettere di connettersi al Database contente le informazioni da pubblicare. 5.4.1 Connessione al Database La creazione di una connessione tra il portale e il nostro database avviene utilizzando la funzione “database connections” di SharePoint Designer. Dopo aver aperto il sito in SharePoint Designer, questo si presenterà come inFigura 46: Figura 46.SharePoint Designer 2007 Nella colonna a destra dello schermo vi è un pannello di nome “Toolbox”, usando le frecce di navigazione poste in alto ci si sposta sul pannello “Data Source Library” (Figura 47), nel caso in cui questo non fosse disponibile è possibile aprirlo dal menu “Task Panes”. 37
  39. 39. Figura 47.Pannello Data Source Library Cliccando su “Connectto a database” posto in “Database Connections”, verrà aperta una nuova finestra che ci permetterà di configurare la connessione al DB (Figura 48). Figura 48.Finestra data source propriety Le informazioni necessarie per connettersi al DB sono: Nome del server, nel nostro caso WIN2003; Nome del provider, si seleziona Microsoft .NET Frameworkfor SQL Server dal menù a tendina; Utente e password coi permessi per interrogare il Database.(Figura 49) 38
  40. 40. Figura 49. Configurazione per accedere al DB Se i dati sono corretti SharePoint visualizzerà tutti i DB presenti nel server, dopo aver selezionato il DB di interesse verranno visualizzate tutte le tabelle e le viste presenti (Figura 50). Figura 50.Tabelle e viste del nostro DB Selezionata la vista voluta questa verrà aggiunta sotto la voce “Database connections”, questa procedura è da ripetere per ogni vista che si vuole collegare al portale. Nella Figura51si possono osservare alcune delle viste importate. 39
  41. 41. Figura51.Alcuni collegamenti alle viste presenti nel nostro DB 5.4.2 Creazione liste personalizzate Per creare una lista personalizzata si possono utilizzare due metodi analoghi: il primo consiste nel tornare a utilizzare gli strumenti web offerti da SharePoint; il secondo permette di creare una lista direttamente da SharePoint Designer. Per utilizzare il primo metodo, dopo aver aperto il sito nel browser, si seleziona “Custom List” dalla pagina “Create” (Figura 52). Figura 52.FOTO DETTAGLIO CUSTOM LIST Il secondo metodo consiste nel creare le liste da SharePoint Designer seguendo il percorso fileNewSharepoint Content. Successivamente si seleziona “custom list” dal menu “Lists”, come riportato in Figura 53. Figura 53.Creazione lista da SharePoint Designer Dentro la cartella “Lists” del portale ci saranno le pagine appena create con il nome assegnato. Nel caso in cui si volessero modificare sarà necessario aprire il file “AllItems.aspx”, come daFigura 54. 40
  42. 42. Figura 54. Aprire le liste in SharepointDesigner 5.4.3 Personalizzazione liste personalizzate Per personalizzare una lista si deve modificare la pagina utilizzando SharePoint Designer. Per prima cosa sarà necessario aprire la pagina “AllItems.aspx” relativa alla lista da modificare. SharePoint Designer permette di visualizzare la pagine in tre differenti metodologie (Figura 55): Design View, visualizza la pagina in modalità grafica, la quale permette di vedere come si presenterà la pagina nel browser; SplitView, divide orizzontalmente lo schermo, nella parte superiore verrà visualizzato il codice della pagine e in quello inferiore il layout. Questa modalità permette di modificare il codice e di vedere subito il cambiamento apportato alla pagina; Code View, visualizza il codice della pagina. Figura 55. Modalità visualizzazione pagine in SharePoint Designer 5.4.3.1 Lista delle persone In questa lista si vuole visualizzare il risultato della query “vwPeople” già discussa in precedenza. Inizialmente, utilizzando la modalità “Design”, si seleziona la web part presente nella lista desiderata e la si cancella (Figura 56). 41
  43. 43. Figura 56.Selezione della web part La pagina si presenterà nel seguente modo: Figura 57. Pagina senza nessuna web part Dal pannello laterale “Data Source Library” si seleziona la vista da importare nella pagina, si clicca col tasto destro e si seleziona “Show Data” (Figura 58). Figura 58: FIGURA SHOWDATA 42
  44. 44. E’ così possibile selezionare i campi che si vogliono avere presenti nella lista e trascinarli nella pagina vuota, ottenendo il seguente risultato: Figura 59. Pagina con rappresentazione tabellare della vista selezionata Cliccando la freccia in parte della lista si aprirà un menu che permette di modificare l’elenco e i suoi campi, in particolare è possibile applicare filtri, ordinare i risultati, ecc (Figura 60). Figura 60.Proprietà elenco Da questo menu è possibile cambiare l’ordine o i campi visualizzati. Nel caso da noi esaminato si nota che il nome del dipartimento, a cui fanno riferimento le persone in lista, è prima del nome e del cognome, per modificare l’ordine basta selezionare “EditColumns” (Figura 61). 43
  45. 45. Figura 61. Ordinamento campi. Un’altra modifica che si vuole fare alla lista è quella di unire il nome e il cognome in un unico campo, per far questo si passa alla modalità SplitView e si seleziona un cognome. Nella parte relativa al codice verrà subito mostrata la parte di codice relativo al nome, il codice verrà così modificato: prima: dopo: Rimuovendo il campo cognome dal menu “EditColumns” si otterrà il seguente risultato: 44
  46. 46. Figura 62: Cognome e Nome uniti nella stessa cella Analogamente a come appena fatto per il nome, si andrà a modificare la parte di codice relativa al campo “e-mail” e “link” come segue: prima: dopo: Un’ultima personalizzazione alla lista consiste nell’aggiungere una colonna contenente un’immagine che una volta cliccata permetterà di visualizzare tutti i progetti a cui ha partecipato una determinata persona. Per aggiungere una colonna si procede modificando il codice, si clicca sull’intestazione di una colonna per visualizzare la parte di codice relativa: 45
  47. 47. Figura 63. Codice relativo alle colonne e successivamente si eseguono le seguenti modifiche: Figura 64. Codice relativo alle colonne modificato A questo punto si dovrà aggiungere il contenuto di questa colonna. Spostandosi nella parte del codice relative ai campi della lista, si clicca, ad esempio, il campo link e si aggiunge il seguente codice: Figura 65. Codice relativo contenuto colonna 46
  48. 48. Questa parte di codice visualizza un’immagine caricata nella cartella images che fungerà da link a una pagina dinamica di nome “ProjectsOfPeople”, che verrà trattata in modo più approfondito nel paragrafo5.5.3. A modifiche ultimate si salva ottenendo il seguente risultato: Figura 66. Pagina lista delle persone 5.4.3.2 Lista dei tipi di progetto e dipartimenti La lista dei tipi di progetto visualizza il risultato della query “vwProjectsType”, la lista contiene tre campi: Nome del tipo del progetto, descrizione e un link a tutti i progetti dello stesso tipo. La personalizzazione è analoga a quella relativa alle persone, la pagina si presenta nel seguente modo: Figura 67. Pagina lista dei tipi di progetti La lista dei dipartimenti è collegata alla query “vwDepartments”. Visualizza il nome del dipartimento, l’indirizzo, un link al suo sito Web e un collegamento a tutti i progetti che fanno riferimento a quel dipartimento. Il risultato finale è il seguente: 47
  49. 49. Figura 68. Pagina lista dei dipartimenti 5.5 Personalizzazione avanzata SharePoint Designer 5.5.1 Lista dei progetti Per la pagina contenente la lista di tutti i progetti visualizza i risultati della Stored Procedure “spAllProject”, si vuole che l’aspetto sia diverso rispetto alle liste viste in precedenza. Il risultato è visibile inFigura 69, si può notare che ogni record presenta in alto un acronimo e un titolo, poco sotto sulla sinistra una foto rappresentativa del progetto, sulla destra, invece, il dipartimento di riferimento e una breve descrizione. Cliccando sull’immagine o sul titolo o l’acronimo si verrà indirizzati alla pagine contente il dettaglio del progetto selezionato. Figura 69. Pagina lista progetti Per prima cosa si deve creare una lista come visto in precedenza e si trascina la stored procedure come fatto in precedenza per la query, in questo modo si ottiene una lista che andremo a modificare per creare un layout personalizzato. 48
  50. 50. La Lista visualizzata andrà cancellata, il risultato sarà come inFigura 70. Questa operazione è stata eseguita perché così SharePoint Designer si è occupato di creare il collegamento tra la pagina e la stored procedure. Figura 70. Modifica pagina progetti Adesso è possibile personalizzare la pagina, il codice prodotto da questa fase è il seguente: Figura 71. Codice pagina progetti 49
  51. 51. 5.5.2 Analisi pagine dinamiche Come già accennato, per la realizzazione del portale è necessario creare delle pagine dinamiche in grado di visualizzare risultati diversi a secondo dal link da cui provengono. Per esempio partendo dalla pagina delle persone, cliccando l’icona dei progetti riguardanti una persona, si vuole vedere tutti, e i soli, progetti della stessa. Per fare questo sarebbe controproducente creare una pagina per ogni persona, perché porterebbe ad avere 100 pagine diverse (stima di 100 persone fatta nel paragrafo 3.2.2), ognuna con riferimento a una query diversa. Inoltre, al momento di aggiungere una persona, sarà necessario creare una nuova query, creare un’altra pagina con i risultati di questa query, aggiungere il link nella pagine delle persone relativo alla pagina appena creata. Per evitare tutto questo si è deciso di creare una pagina dinamica, che secondo del parametro ricevuto esegue una query parametrica e mostra i risultati corretti. Il metodo per passare il parametro tra le due pagine, da quella sorgente (es. Persone) a quella destinazione(es. Progetti Persona), è quella di accodare al link nella pagina sorgente una stringa contente i parametri necessari. La sintassi del passaggio mediante URL è la seguente: Nome_Pagina_Dest.aspx?Nome_Par1=Val1&Nome_Par2=Val2 Il “?” determina l’inizio della stringa contente i dati, denominata Query-String; “Nome_Par” è il nome del parametro da passare e “Val” è il valore del parametro. Un esempio è il seguente link: Figura72. Esempio accodamento valore dei parametri nell’URL La pagina di destinazione eseguirà una query con i parametri della stringa e visualizzerà i risultati che soddisfano i parametri passati nell’URL. 5.5.3 Lista dei progetti delle persone In questo caso il parametro che si vuole passare tramite URL è l’ID della persona selezionata, in questo modo la query nella pagina di destinazione è in grado di mostrare solo i progetti che fanno riferimento a quella persona. 50
  52. 52. Per prima cosa vediamo come aggiungere la query-string al link della pagina sorgente, come si nota guardando il codice relativo al link nella pagina “people” (Figura 73Errore. L'origine riferimento non è stata trovata.) non presenta nessun “?” che identifica il passaggio dei parametri. Figura 73. Codice relativo link nella pagina people Per modificare il linksi clicca col tasto destro sull’icona dei progetti e dal menu si sceglie “Hyperlink Properties”. Nella finestra appena aperta, Figura 74, si clicca su “Parameters”. Figura 74. Edit Hyperlink permette di modificare i nostri link Successivamentesi seleziona “Add” nella sezione “Querystring”, nel menu namesi seleziona “Xsl: ID”, si clicca “OK” e si torna indietro. A questo punto il codice che fa riferimento al link si presenta così: Figura 75. Codice dopo eseguito l’accodamento del parametro Per quanto riguarda la pagina “ProjectsOfPeople” a differenza di prima SharePoint Designer non andrà a connettersi a una query già esistente sul DB ma userà una query creata in SharePoint 51
  53. 53. Designer, questa scelta è stata fatta perché così SharePoint è in grado di utilizzare il parametro ricevuto dalla query string. L’aspetto di questa pagina è simile a quella di tutti i progetti, l’unica differenza è che al posto del dipartimento è visualizzato il nome della persona di cui si è interessati sapere i progetti in cui è coinvolta. Per creare la query in SharePoint Designersicrea una connessione al db come visto nel paragrafo 5.4.1 fino ad arrivare alla schermata in Figura 76 Figura 76. Tabelle e viste del nostro DB e possibilità di creare altre query A differenza di prima dopo aver scelto il nostro DB sceglieremo l’opzione “Or Specify Custom Select, ecc…” si clicca su fine e poi, controllando di aver scelto “SQL Statement”,si clicca su “EditCommand..”. 52
  54. 54. Figura 77. Creazione della nuova query Nel primo campo viene inserito il codice SQL, si può notare che dopo la clausola Wheresi trovadbo.TblPeople.ID=@cod, dove @cod identifica il nostro parametro. Nel secondo campo in basso a sinistra si dovrà aggiungere questo parametro per far si che la query non dia errore, successivamentesi definisce la sorgente del parametro (querystring), il nome del parametro nell’URL e un valore di default. Terminata la scrittura della querysi salva e si potrà ritrovare la nostra nuova query nel pannello “Data Source Library”. Per la personalizzazione si procede come per la pagina dei progetti (Paragrafo 5.5.1), il risultato finale è il seguente: 53
  55. 55. Figura 78. Pagina dei progetti in cui partecipa una persona 5.5.4 Lista dei progetti di un dipartimento e lista dei progetti di un tipo di progetto La creazione di queste pagine è del tutto analoga a quella vista precedentemente, la pagina “ProjectsOfDepartment” visualizza tutti i progetti che fanno riferimento a un dipartimento. Il parametro passato attraverso l’URL è l’ID del dipartimento ed il risultato finale di questa pagina è il seguente: Figura 79. Pagina dei progetti che fanno riferimento a un dipartimento La pagina “ProjectsOfType” visualizza tutti i progetti che fanno riferimento allo stessa tipologia, in questo caso il parametro passato attraverso l’URL è L’ID della tipologia di progetto. Il risultato finale di questa pagina è riportato in Figura 80 54
  56. 56. Figura 80. Pagina dei progetti che fanno riferimento a una stessa tipologia di progetti 5.5.5 Pagina dettaglio progetto Questa pagina è la pagina nella quale vengono visualizzati tutti i dettagli di un progetto, a questa pagina si arriva da molti percorsi, scegliendo un progetto dalla pagina “projects” o scegliendone uno dalle pagine “ProjectsOfPeople”, “ProjectsOfDepartment” o “ProjectsOfType”. In tutti i casi viene passato alla pagina tramite l’URL l’ID del progetto di cui interessa vedere i dettagli. La query utilizzata da questa pagina è visibile nella seguente figura: 55
  57. 57. Figura 81. Query pagina dettaglio di un progetto L’aspetto finale della pagina è il seguente: Figura 82. Pagina dettaglio di un progetto 56
  58. 58. Come si nota sul lato sinistro è presente una foto rappresentativa e sotto di essa alcune info quali sito web, data inizio ed eventualmente data di fine. Sulla destra è presente, partendo dall’alto verso il basso, il titolo del progetto, il finanziatore del progetto, il dipartimento di riferimento e infine la descrizione estesa. 5.5.6 Pagina iniziale Nel paragrafo 5.3.6 abbiamo già iniziato a personalizzare la pagina iniziale aggiungendo sulla destra le news e i link, a questo punto manca però la parte centrale della home. Il risultato che si vuole ottenere è quello di riservare nella parte superiore un piccolo spazio per un logo che sarà inserito in seguito e sotto questo la lista dei progetti in evidenza. Questa pagina fa riferimento alla query “vwProjectsHome” che controlla i progetti che hanno spuntato l’attributo “home” nel DB. La pagina iniziale finale si presenta nel seguente modo: Figura 83. Pagina Iniziale 57
  59. 59. 6 Conclusioni Gli obiettivi sulla realizzazione del portale e del database riguardante i progetti relativi all’energia e all’ambiente sono stati completamente raggiunti. Ad oggi il processo di migrazione del portale al server del DICAMP è stato completato e il portale è già attivo. I dati presenti sono ancora quelli di testing,ma è in corso la loro cancellazione e l’inserimento dei dati reali. Il portale soddisfa tutte le richieste del committente, è presente un database nel quale sono memorizzati tutti i dati. Il portale è in grado di accedervi, tutte le liste richieste sono state create e delle altre possono essere aggiunte seguendo la documentazione appositamente prodotta. Per soddisfare gli obiettivi sono state create: 7 tabelle nel Database; 9 querydi interrogazione; 7 maschere di inserimento dei dati; 10 pagine, di cui 5 dinamiche, in aspx che formano il portale web. In futuro, oltre all’inserimento dei dati reali, è previsto lo sviluppo del portale con: Creazione di un metodo d’inserimento dei dati via web, in sostituzione delle attuali maschere; Aggiunta di nuove liste condivise; Maggiore personalizzazione grafica del layout generale del sito. Nel complesso il portale risulta di facile consultazione e di semplice gestione. Grazie alla dinamicità delle pagine che lo compongono, i dati sono immediatamente disponibili nel portale web, dopo il loro inserimento nel database. Lo sviluppo e la creazione del portale mi ha avvicinato a una nuova tecnologia dalle grandi potenzialità che non conoscevo, mi ha inoltre permesso di accrescere la mia conoscenza riguardo le basi di dati e le sue capacità. 58
  60. 60. 7 Bibliografia Microsoft MSDN Windows SharePoint Services 3.0 http://msdn.microsoft.com/en-us/library/bb931737.aspx Microsoft Office Support Windows SharePoint Services 3.0 http://office.microsoft.com/en-us/windows-sharepoint-services-help/ Microsoft Office SupportSharepointDesigner 2007 http://office.microsoft.com/en-us/sharepoint-designer-help/CL010082351.aspx Microsoft MSDN SharepointDesigner 2007 http://msdn.microsoft.com/en-us/library/bb693437(v=office.12).aspx Microsoft SharePoint Designer Team Blog http://blogs.msdn.com/b/sharepointdesigner/ Guide html.it http://xml.html.it/ Guide html.it http://database.html.it/guide/leggi/133/guida-sql-server-2005/ Microsoft SQL Server http://msdn.microsoft.com/it-it/sqlserver/default.aspx 59

×