61
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: Davide BRAVIN Relatore: Prof. Maurizio FERMEGLIA Anno Accademico 2009-2010

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

Embed Size (px)

DESCRIPTION

 

Citation preview

Page 1: 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

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:

Davide BRAVIN

Relatore:

Prof. Maurizio FERMEGLIA

Anno Accademico 2009-2010

Page 2: 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
Page 3: 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

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

Page 4: 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

2

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

Page 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

3

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.

Page 6: 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

4

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.

Page 7: 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

5

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;

Page 8: 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

6

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.

Page 9: 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

7

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, ordinato e particolareggiato.

Persone, dipartimenti, finanziatore, tipo di progetto

Persone Dipendenti che partecipano a uno o più progetti.

Dipartimento,progetto

Dipartimento Struttura fisica nella quale lavorano dei dipendenti

Persone, progetto

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;

Page 10: 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

8

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).

Schema 1. Schema scheletro.

Al termine della progettazione concettuale si ottiene il seguente schema concettuale con attributi

e cardinalità:

DIPARTIMENTO

GENERE

PROGETTOPERSONE

AFFERENZA

PARTECIPAZIONE

TIPO

PROGETTO

Page 11: 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

9

DIPARTIMENTO

GENERE

PROGETTO

PERSONEAFFERENZA

PARTECIPAZIONE

TIPOLOGIAPROGETTO

FINANZIATO

FINANZIATORE

(0,n) (0,1)

(0,n)

(0,n)

(1,n)(1,n)

(1,1)

(0,n)

CodiceNomeCognome

TelefonoE-mail

Capo Progetto

Dip. Riferimento

ID Tip

o

De

scriz

ion

e

ID Tip

olo

gia

Indirizzo

ID

Nome

Telefono

Link

Note

Fine

Inizio

Link

Attivo

Descrizione Completa

Descrizione Breve

ID

Nome

Budget

LinkNote

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:

Page 12: 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

10

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à.

Page 13: 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

11

Al termine di questa fase si ottiene il seguente schema E-R ristrutturato:

DIPARTIMENTO

PROGETTOPERSONE

AFFERENZA

PARTECIPAZIONE

TIPOLOGIA

GENERE

PROGETTO

FINANZIATO

FINANZIATORE

(0,n)

(0,1)

(0,n)

(1,n)

(1,n)

(1,1)

(0,n)

CodiceNomeCognomeLink

TelefonoE-mail

Note

(0,n)

Capo Progetto

ID Tip

o

De

scriz

ion

e

ID Tip

olo

gia

Note

Fine

Inizio

Link

Descrizione Completa

Descrizione Breve

ID

Nome

Budget

RIFERIMENTO

Indirizzo

ID

Nome

Telefono

Link

(0,n) (0,1)

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:

Page 14: 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

12

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;

Page 15: 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

13

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.

Page 16: 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

14

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).

Page 17: 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

15

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.

Page 18: 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

16

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.

Page 19: 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

17

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.

Page 20: 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

18

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.

Page 21: 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

19

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

Page 22: 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

20

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).

Page 23: 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

21

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.

Page 24: 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

22

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).

Page 25: 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

23

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.

Page 26: 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

24

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.

Page 27: 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

25

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..

Page 28: 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

26

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”.

Page 29: 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

27

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);

Page 30: 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

28

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);

Page 31: 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

29

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).

Page 32: 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

30

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);

Page 33: 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

31

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;

Page 34: 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

32

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).

Page 35: 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

33

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).

Page 36: 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

34

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.

Page 37: 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

35

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”.

Page 38: 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

36

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

Page 39: 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

37

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”.

Page 40: 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

38

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)

Page 41: 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

39

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.

Page 42: 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

40

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

file\New\Sharepoint 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.

Page 43: 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

41

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).

Page 44: 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

42

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

Page 45: 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

43

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).

Page 46: 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

44

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:

Page 47: 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

45

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:

Page 48: 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

46

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

Page 49: 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

47

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:

Page 50: 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

48

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.

Page 51: 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

49

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

Page 52: 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

50

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.

Page 53: 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

51

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

Page 54: 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

52

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..”.

Page 55: 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

53

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:

Page 56: 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

54

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

Page 57: 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

55

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:

Page 58: 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

56

Figura 81. Query pagina dettaglio di un progetto

L’aspetto finale della pagina è il seguente:

Figura 82. Pagina dettaglio di un progetto

Page 59: 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

57

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

Page 60: 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

58

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à.

Page 61: 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

59

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