Sviluppo Di Portali Tramite La Tecnologia Sharepoint

60
Università degli Studi di Trieste Facoltà di Ingegneria Corso di Laurea Triennale in Ingegneria Informatica SVILUPPO DI PORTALI CON TECNOLOGIA SHAREPOINT: PARAMETRAZIONE E PERSONALIZZAZIONE PER LO SVILUPPO DI PORTALI VERTICALI. Relatore Laureando Chiar.mo Prof. Maurizio Fermeglia Denis Tomada Anno Accademico 2007-2008

description

Sviluppo Di Portali Tramite La Tecnologia Sharepoint: parametrazione e personalizzazione per lo sviluppo di portali verticali.

Transcript of Sviluppo Di Portali Tramite La Tecnologia Sharepoint

Page 1: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

Università degli Studi di Trieste

Facoltà di Ingegneria

Corso di Laurea Triennale in Ingegneria Informatica

SVILUPPO DI PORTALI CON TECNOLOGIA SHAREPOINT:

PARAMETRAZIONE E PERSONALIZZAZIONE PER LO

SVILUPPO DI PORTALI VERTICALI.

Relatore Laureando

Chiar.mo Prof. Maurizio Fermeglia Denis Tomada

Anno Accademico 2007-2008

Page 2: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

Sommario

1. Introduzione ................................................................................................................... 4

2. Analisi ............................................................................................................................. 6

2.1 Situazione di partenza ................................................................................................ 6

2.1.1 Descrizione pagina web ................................................................................................... 6

2.1.2 Sistema informatico ........................................................................................................ 7

2.1.3 Basi di dati esistente ....................................................................................................... 7

2.2 Vincoli di progetto ....................................................................................................... 8

2.2.1 Uso della tecnologia WSS ................................................................................................ 8

2.2.2 Vincoli temporali ............................................................................................................. 9

2.3 Esigenze funzionali .................................................................................................... 9

2.3.1 Accessibilità ..................................................................................................................... 9

2.3.2 Migliore organizzazione dei dati...................................................................................... 9

2.3.3 Funzionalità simili a RECA e Intranet del Dicamp .......................................................... 10

2.3.4 Supporto di linguaggi lato server................................................................................... 11

3. Requisiti ........................................................................................................................ 12

3.1 Elenco dei requisiti ................................................................................................... 12

3.2 Sviluppo dei requisiti ................................................................................................ 12

3.2.1 Pagina iniziale ................................................................................................................ 12

3.2.2 Creazione di una pagina testuale dedicata alle tematiche di ricerca............................. 14

3.2.3 Creazione di elenchi personalizzati ............................................................................... 15

3.2.4 Calendario ..................................................................................................................... 17

3.2.5 Raccolta di documenti pubblici ..................................................................................... 18

3.2.6 Raccolta di documenti privati ........................................................................................ 19

3.2.7 Sviluppo delle pagine dedicate all’inserimento dei dati nel DB ..................................... 20

4. Realizzazione ............................................................................................................... 23

4.1 Installazione e configurazione del pacchetto software ............................................ 23

4.1.1 Requisiti per l’installazione di WSS ................................................................................ 23

4.1.2 Installazione di WSS ...................................................................................................... 24

4.1.3 Inizializzazione di un portale ......................................................................................... 26

4.2 Parametrizzazione semplice .................................................................................... 29

Page 3: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

4.2.1 Calendario ..................................................................................................................... 30

4.2.2 Raccolte di documenti ................................................................................................... 30

4.2.3 Personalizzazione logo e intestazione del portale ......................................................... 31

4.3 Parametrizzazione avanzata .................................................................................... 33

4.3.1 Personalizzazione degli annunci .................................................................................... 34

4.3.2 Personalizzazione dei Link ............................................................................................. 37

4.3.3 Personalizzazione della pagina iniziale .......................................................................... 37

4.3.4 Personalizzazione della pagina delle tematiche ............................................................ 38

4.4 Sviluppo di nuove parti ............................................................................................. 38

4.4.1 Connessione alla sorgente dati ..................................................................................... 38

4.4.2 Creazione di un elenco personalizzato .......................................................................... 40

4.4.3 Personalizzazione di un elenco personalizzato .............................................................. 41

4.4.3.1 Elenco del “Collegio dei docenti” ............................................................................ 41

4.4.3.2 Elenco del “Consiglio Scientifico” ........................................................................... 45

4.4.3.3 Elenco dei “Supervisori” ......................................................................................... 46

4.4.3.4 Elenco dei “Dottorandi in corso” ............................................................................. 47

4.4.4 Script javascript per la chiamata AJAX ........................................................................... 50

4.4.5 Sviluppo pagina .Net per l’inserimento dei dati ............................................................ 52

5. Conclusioni ................................................................................................................... 59

Bibliografia .............................................................................................................................. 60

Page 4: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

4

1. Introduzione

Con questa tesi, sullo sviluppo di portali verticali attraverso la parametrizzazione e

personalizzazione della tecnologia SharePoint, mi sono occupato della progettazione e dello

sviluppo di un portale per la Scuola di Nanotecnologie dell’Università degli Studi di Trieste.

Attualmente, il portale presente è composto da una semplice pagina statica contenente una

piccola presentazione delle attività e degli obiettivi della scuola, l’elenco delle pubblicazioni degli

ultimi anni e l’elenco dei dottorandi in corso.

L’obiettivo finale è la realizzazione di un nuovo portale che permetta l’uso di contenuti

dinamici quali:

visualizzazione di dati contenuti in un database (2.1.3 Basi di dati esistente)

creazione ed aggiornamento online di elenchi personalizzati (3.2.3 Creazione di

elenchi personalizzati)

Le fasi principali dello sviluppo del portale sono le seguenti:

Analisi dell’attuale situazione del portale (2.1 Situazione di partenza)

Definizione degli obiettivi e delle funzionalità (3.1 Elenco dei requisiti)

Analisi e studio della base di dati

Analisi e studio del programma scelto per la modellazione e parametrizzazione del

portale

Realizzazione dell’interfaccia grafica e relativa documentazione per futuri aggiornamenti

e modifiche (4.2 Parametrizzazione semplice)

Realizzazione dell’interfaccia grafica per l’inserimento di dati online (4.4.5 Sviluppo

pagina .Net per l’inserimento dei dati)

L’applicazione sarà installata sul web server del DICAMP che utilizza come sistema

operativo Windows Server 2003. L’utilizzo del portale sarà pubblico e quindi le funzionalità

implementate dovranno essere compatibili con il maggior numero di browser presenti in rete

(Internet Explorer, Mozilla Firefox, Opera, etc.) in modo tale da garantirne il funzionamento in ogni

condizione.

La tecnologia scelta per lo sviluppo del portale è WSS 3.0 SP11, mentre l’ambiente di

sviluppo per la parametrizzazione è Microsoft Office SharePoint Designer 2007. Le pagine

1 Microsoft Windows SharePoint Service 3.0 con Service Pack 1 versione 12.0.0.6219. Pagina di

riferimento http://technet.microsoft.com/en-us/windowsserver/sharepoint/bb400747.aspx.

Page 5: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

5

dedicate all’inserimento dei dati saranno sviluppate nel linguaggio C# utilizzando l’ambiente di

sviluppo Visual Studio 2008 Professional. Infine, il DBMS adottato è Microsoft SQL Server 2005.

Dal punto di vista organizzativo, ho suddiviso questo lavoro in quattro fasi. Si parte da

un’analisi dello stato iniziale, per poi passare allo studio dei requisiti del nuovo portale per arrivare

infine alla realizzazione vera e propria del portale, alla sua installazione ed alla sua pubblicazione.

La fase di analisi iniziale consiste nella verifica dello stato attuale del portale e nell’analisi

della base di dati messa a disposizione dalla scuola (Capitolo 2).

La fase dei requisiti illustra le richieste per il nuovo portale (Capitolo 3). A tale scopo sono

stati proposti come portali di riferimento RECA2 e Intranet dei DICAMP3

La fase di realizzazione consiste nell’implementazione e parametrizzazione degli strumenti

già presenti in WSS, nella ricerca in Internet di terze parti o nella realizzazione di nuove parti

mediante l’utilizzo di Microsoft SharePoint Designer (Capitolo 4).

La fase successiva alla pubblicazione del portale, prevede l’implementazione di tabelle

descrittive dei campi, presenti all’interno delle tabelle del DB, dedicate allo sviluppo delle pagine

ASP.NET per l’inserimento dei dati (Paragrafo 3.2.7 Sviluppo delle pagine dedicate

all’inserimento dei dati nel DB e paragrafo 4.4.5 Sviluppo pagina .Net per l’inserimento dei dati).

2 Progetto di Alta Formazione – Risparmio Energetico e Confort Abitativo. Il portale è raggiungibile

all’indirizzo http://reca.units.it.

3 Intranet dei DICAMP (Dipartimento di Ingegneria Chimica dell’Ambiente e delle Materie Prime). Il

portale è raggiungibile all’indirizzo http://intranet.dicamp.units.it.

Page 6: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

6

2. Analisi

2.1 Situazione di partenza

2.1.1 Descrizione pagina web

Il portale della Scuola di Nanotecnologie allo stato iniziale del progetto prevede solamente

un’unica pagina web statica contenente le informazioni basilari riguardanti l’attività, le tematiche di

ricerca, la lista delle pubblicazioni del collegio e la lista dei dottorandi in corso.

Da un punto di vista tecnologico, l’attuale costruzione statica limita fortemente le

funzionalità del portale: il linguaggio HTML non permette l’inserimento di script server-side, di fatto,

impedendo l’interattività del portale con l’utente utilizzatore ma sopratutto con l’utente

amministratore.

Inoltre l’attuale situazione non permette il dialogo con sorgenti database esterne,

attualmente presenti all’interno della scuola, e contenenti tutte le informazioni riguardanti lo stato di

attività dei dottorandi in corso.

Da un punto di vista organizzativo dei dati, l’attuale costruzione non dispone di un elenco di

collegamenti ipertestuali alle varie sezioni, rendendo il contenuto disordinato e di difficile

consultazione.

Figura 1 – Tabella Lista delle tesi di dottorando attive

Page 7: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

7

2.1.2 Sistema informatico

Il web server sul quale è installata attualmente la pagina è il DICAMPSRV1 che adotta

come sistema operativo Microsoft Windows Server 2003.

Su tale macchina risultano già installati:

Microsoft Windows Sharepoint Service 3.0

Microsoft SQL Server 2005

2.1.3 Basi di dati esistente

All’interno della struttura esiste un database contenente tutte le informazioni relative alle

attività svolte.

Il database è composto complessivamente da 8 tabelle e 5 viste.

Le tabelle presenti, con rispettivi campi, sono le seguenti:

tblDipartimento (ID, NomeDip)

tblDottorando (ID, Cognome, Nome, Ciclo, AnnoInizio, AnnoFine, NoteFine, Borsa,

IDDipartimento, SSD, IDSupervisor, emailPrivato, emailUNITS, telefono, TitoloTesiITA,

AbstractTesiITA, AbstractTesiENG, LaureaOrigine)

tblEnte (IDEnte, Ente)

tblMissione (ID, IDDottorando, Luogo, Evento, DataInizio, DataFine, Contributo)

tblPosizione (IDPosizione, SiglaPosizione, Posizione)

tblRuoloCollegio (IDRuoloCollegio, Ruolo)

tblRuoloCS (IDRuoloCS, RuoloConsiglioScientifico)

tblTutoraggio (IDDocente, IDDottorando, DataInizio, DataFine)

I campi evidenziati in grassetto indicano le chiavi primarie di ogni singola tabella.

Le viste presenti, con rispettivi campi, sono le seguenti:

vwCollegioDocenti (IDDocente, Cognome, Nome, SSD, Ente, NomeDip,

SiglaPosizione, email, IDRuoloCollegio, Ruolo)

vwConsiglioScientifico (IDDocente, Cognome, Nome, SSD, Ente, NomeDip,

SiglaPosizione, email, RuoloConsiglioScientifico, IDRuoloCS)

vwDottorandiInCorso (ID, Cognome, Nome, Ciclo, AnnoInizio, AnnoFine, NomeDip,

IDDipartimento, SSD, Expr1, Expr2, IDEnte, Expr3, TitoloTesiITA)

vwSupervisors (Cognome, Nome, IDSupervisor, IDDocente, Dottorando Cognome,

Dottorando Nome, Ciclo, AnnoFine, AnnoInizio, NomeDip, Ente)

vwTutori (IDDocente, IDDottorando, DataInizio, DataFine, Cognome, Nome, Ente,

NomeDip, Expr1, Expr2, Ciclo, Expr3, ID).

Page 8: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

8

In vwDorroandiInCorso ci sono alcuni campi derivati: i campi Expr1 e Expr2 indicano

rispettivamente il Cognome ed il Nome del docente che svolge attività di tutor nei confronti del

dottorando, il campo Expr3 indica il dipartimento di appartenenza del docente.

In vwTutori i campi Expr1 e Expr2 indicano rispettivamente il Cognome ed il Nome del

dottorando, mentre il campo Expr3 indica il valore della chiave primaria del docente.

Il diagramma del database è riportato in Figura 2.

Figura 2 – Diagramma del database NanotechDB

2.2 Vincoli di progetto

2.2.1 Uso della tecnologia WSS

L’unico vincolo di natura tecnica richiesto espressamente dal committente è l’utilizzo della

tecnologia Microsoft Windows Sharepoint Service. Vista la molteplicità di versioni presenti è stato

specificato l’utilizzo di WSS 3.0 con SP1 versione 12.0.0.6219.

Tale vincolo può sembrare molto restrittivo ma risulta fondamentale rispettarlo per non

incorrere in problemi di backup e restore del portale da macchina di sviluppo a macchina di lavoro,

che può portare, a volte, nel peggiore dei casi, addirittura alla perdita di dati.

Page 9: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

9

2.2.2 Vincoli temporali

La pubblicazione del portale inizialmente non prevedeva un vincolo temporale preciso.

Durante la fase di sviluppo è sorta la necessità di rendere il portale operativo entro la data del 01

Marzo 2009.

2.3 Esigenze funzionali

2.3.1 Accessibilità

L’utilizzo del portale sarà pubblico e quindi le funzionalità implementate dovranno essere

compatibili con il maggior numero di browser presenti in rete (ad esempio Internet Explorer, Mozilla

Firefox, Opera, etc.) in modo tale da garantirne il funzionamento in ogni condizione.

2.3.2 Migliore organizzazione dei dati

La tecnologia WSS 3.0 prevede la presenza all’interno delle pagine generate di una barra

superiore dei collegamenti e di un menu posizionato sul lato sinistro del portale. La creazione e la

gestione di tali collegamenti avviene da una zona di amministrazione, protetta da login, in forma

totalmente automatizzata e, soprattutto, gestibile interamente on-line.

Tale caratteristica soddisfa appieno la richiesta di migliore organizzazione e strutturazione

dei dati.

Per raggiungere tale obiettivo è stato scelto di puntare sulla barra orizzontale disposta sulla

parte superiore delle varie pagine: tale disposizione dovrà permettere il rapido collegamento alle

varie sezioni, permettendo una navigazione più chiara e mirata rispetto alla precedente versione.

I collegamenti presenti nella barra superiore sono rappresentati nella Figura 3.

Figura 3 - Struttura della barra dei collegamenti superiori

Page 10: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

10

Come indicato precedentemente, WSS 3.0 genera sul lato sinistro del portale un elenco di

collegamenti (il classico menu di navigazione presente in qualsiasi sito internet). In questo elenco,

in aggiunta ai collegamenti sopra elencati, verranno predisposti ulteriori collegamenti: in particolare

saranno inseriti dei link alle librerie di documenti ed al calendario contenente le scadenze e gli

appuntamenti delle attività svolte all’interno della scuola.

Lo schema dei collegamenti contenuti dal menu laterale è illustrato in Figura 4.

Figura 4 – Struttura del menu laterale

2.3.3 Funzionalità simili a RECA e Intranet del Dicamp

Il portale RECA ed Intranet del Dicamp presentano alcune funzionalità che sono state

richieste anche per il portale della scuola.

Queste funzionalità sono:

Elenco di link ipertestuali ad altre risorse presenti in rete

Elenco delle “News e annunci”

Raccolta di documenti sia pubblici che privati

Calendario per l’inserimento di eventi ed attività

Avendo deciso di utilizzare per la realizzazione del nuovo portale la stessa tecnologia su

cui sono basati RECA e Intranet, vedremo in seguito come siano di facile implementazione i punti

elencati precedentemente; meno ovvia invece risulterà la loro personalizzazione.

Page 11: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

11

Figura 5 – Home Page del portale RECA

Figura 6 – Home Page del portale Intranet del Dicamp

2.3.4 Supporto di linguaggi lato server

La richiesta di supporto delle tecnologie server-side viene soddisfatta pienamente da WSS

3.0: questa tecnologia è sviluppata basandosi su tecnologia ASP.Net ed accetta, sebbene con

notevoli vincoli di sviluppo, script per l’interazione con l’utente.

Tale predisposizione permetterà sia il dialogo con DB per la visualizzazione dei dati

presenti nelle tabelle sia la realizzazione di contenuti dinamici aggiornabili direttamente online.

Page 12: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

12

3. Requisiti

3.1 Elenco dei requisiti

Di seguito sono riportati i requisiti indicati per lo sviluppo del portale della scuola:

1. Creazione di una pagina iniziale (homepage)

2. Creazione di una pagina testuale dedicata alle tematiche di ricerca

3. Creazione di elenchi, in particolare:

a. Collegio dei docenti

b. Consiglio Scientifico

c. Supervisori

d. Dottorandi in corso

4. Calendario

5. Raccolta di documenti pubblici

6. Raccolta di documenti privati

7. Sviluppo pagine dedicate all’inserimento dei dati nel DB.

3.2 Sviluppo dei requisiti

3.2.1 Pagina iniziale

La pagina iniziale di un qualsiasi portale, comunemente indicata con il nome “home” o

“homepage”, è la pagina che appare nel momento in cui un qualsiasi utente si collega al portale.

La funzione principale di una home è l’accoglienza dell’utente visitatore: all’interno di questa

pagina, il più delle volte vengono predisposti collegamenti rapidi alle varie sezioni attive all’interno

del portale, informazioni utili quali eventi o appuntamenti di natura attinente ai contenuti,

collegamenti ipertestuali ad altre risorse esterne correlate.

Lo schema scelto per la costruzione della pagina iniziale del portale della scuola è simile a

quello usato per la realizzazione della pagina iniziale di RECA. Per maggiore chiarezza riportiamo

di seguito la struttura della pagina (Figura 7).

Page 13: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

13

Figura 7 – Struttura portale RECA

La parte superiore identificata dall’intestazione del portale RECA contiene semplicemente il

logo e il nome del sito.

Nella colonna laterale di sinistra sono presenti gli annunci ed i link ipertestuali. Gli annunci

visualizzano le informazioni secondo un ordine temporale (dal più recente al meno recente) e per

ogni annuncio viene indicato: titolo, data e ora di pubblicazione, nome dell’utente che ha pubblicato

l’annuncio, testo del messaggio ed eventuali allegati. I link ipertestuali invece visualizzano un unico

dato, che è il nome del collegamento: tale voce se cliccata apre una nuova finestra del browser

con la risorsa desiderata.

Nella colonna di destra è presente un corposo testo arricchito di varie immagini dove viene

descritta la finalità del progetto RECA.

Usando come base tale esempio è stato deciso di impostare la pagina iniziale del portale

della scuola nel seguente modo (Figura 8).

Page 14: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

14

Figura 8 – Struttura del portale NANOTECH

Anche in questo portale la sezione dell’intestazione conterrà il logo e il nome del portale.

Nella colonna laterale di sinistra sarà presente il classico menu. L’elenco delle voci e dei

corrispondenti collegamenti alle sezioni viene gestito interamente da WSS.

Nella colonna centrale sarà presente una parte testuale. Il testo sarà inserito in un secondo

momento dall’amministratore del portale: tale parte dovrà essere modificabile online e dovrà

supportare l’inserimento di immagini o di link ipertestuali.

Nella colonna di destra saranno presenti l’elenco degli annunci e sotto, l’elenco dei link.

L’elenco degli annunci del portale della scuola, come per RECA, visualizzerà le informazioni

secondo un ordine temporale (dal più recente al meno recente). Diversamente da RECA, è stato

richiesto che i dettagli presenti per ogni annuncio siano solamente il titolo del messaggio, il giorno

di inserimento ed il testo del messaggio.

Per quanto riguarda l’elenco dei collegamenti non è stata richiesta alcuna modifica

particolare, quindi la struttura rimane la stessa proposta dal portale RECA.

3.2.2 Creazione di una pagina testuale dedicata alle tematiche di ricerca

È stata richiesta la realizzazione di una semplice pagina testuale per permettere

l’inserimento di un testo che descriva le tematiche di ricerca della scuola.

Page 15: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

15

Per tale pagina non sono state avanzate esigenze particolari, l’unica è la possibilità di

modifica online del testo contenuto.

3.2.3 Creazione di elenchi personalizzati

Come già sottolineato più volte, all’interno della struttura della scuola esiste un DB

contenente le informazioni relative alle varie attività e pubblicazioni dei dottorandi e del collegio.

Su richiesta del committente, all’interno del portale della scuola, dovranno essere

predisposti degli elenchi per visualizzare il contenuto delle viste, già illustrate nel capitolo

precedente (2.1.3 Basi di dati esistente).

Gli elenchi richiesti sono i seguenti:

1. “Collegio dei docenti”: le informazioni per il presente elenco saranno prelevate dalla

vista vwCollegioDocenti

2. “Consiglio scientifico” : le informazioni per il presente elenco saranno prelevate dalla

vista vwConsiglioScientifico

3. “Supervisori” : le informazioni per il presente elenco saranno prelevate dalla vista

vwSupervisors

4. “Dottorandi in corso” : le informazioni per il presente elenco saranno prelevate dalla

vista vwDottorandiInCorso

Ora analizziamo come saranno visualizzati nelle varie sezioni i dati restituiti dalle varie

viste.

Docente Ruolo Email Dipartimento Ente Pos. SSD

AFRICH Cristina Membro esclusivo collegio [email protected] Dip. di Fisica UNITS ASS fis03

ARFELLI Fulvia Membro esclusivo collegio [email protected] Dip. di Fisica UNITS RU fis07

BARALDI Alessandro Membro esclusivo collegio [email protected] Dip. di Fisica UNITS RU fis03

… … … … … … …

Tabella 1 - Campi dell’elenco “Collegio dei docenti”

La Tabella 1 indica lo schema per la visualizzazione della vista vwCollegioDocenti. Da

sinistra a destra troviamo la colonna “Docente” che visualizzerà il nome e cognome del docente;

“Ruolo” indicherà il ruolo nel collegio dei docenti; “Email” indicherà l’indirizzo E-mail del docente;

“Dipartimento” ed “Ente” indicheranno il dipartimento ed ente di appartenenza; “Posizione”,

indicherà la posizione del docente ed infine la colonna “SSD” indicherà il settore scientifico-

disciplinare di appartenenza.

Docente Ruolo Email Dipartimento Ente Pos. SSD

CIGADA Alberto Membro [email protected] Pol. Milano PO ing-ind22

FERMEGLIA Maurizio Membro [email protected] DICAMP UNITS PO ing-ind24

MORGANTE Alberto Membro [email protected] Dipartimento di Fisica UNITS PA fis01

… … … … … … …

Tabella 2 – Campi dell’elenco “Consiglio scientifico”

Page 16: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

16

La Tabella 2 indica lo schema per la visualizzazione della vista vwConsiglioScientifico. I

campi presenti ed il significato sono simili ai campi presentati nella Tabella 1.

Supervisore Dottorando Ciclo Anno Inizio Anno Fine Dipartimento Ente

STANTA Giorgio POZZI MUCELLI Stefano 19 2004 2007 Dipartimento SCMT UNITS

STANTA Giorgio LUCHI Massimiliano 19 2004 2007 Dipartimento SCMT UNITS

BONIN Serena FABBIAN Matteo 19 2004 2007 Dipartimento SCMT UNITS

… … … … … … …

Tabella 3 – Campi dell’elenco “Supervisori”

La Tabella 3 indica lo schema per la visualizzazione della vista vwSupervisors. La colonna

“Supervisore” indica il docente supervisore, “Dottorando” visualizza il nominativo del dottorando, i

campi “Ciclo” - “Anno Inizio” - “Anno Fine” fanno riferimento al singolo progetto di ogni dottorando,

infine “Dipartimento” e “Ente” indicano il dipartimento ed ente di appartenenza del supervisore.

# Dottorando Ciclo Inizio Fine Dipartimento Tutor Titolo TESI SSD

15 DI GIUSTO Mauro 19 2004

Dip. di Scienze della vita MARZARI Roberto Titolo della tesi … BIO/06

21 SCIAN Giovanni 20 2005

Dip. di Fisica ROSEI Renzo Titolo della tesi … FIS/03

30 SCOCCHI Giulio 21 2006

DICAMP FERMEGLIA Maurizio Titolo della tesi … ING-IND/24

… … … … … … … … …

Tabella 4 – Campi dell’elenco “Dottorandi in corso”

La Tabella 4 indica lo schema per la visualizzazione della vista vwDottorandiInCorso. Il

primo campo “#” indica il valore della chiave primaria, “Dottorando” visualizza il nominativo del

studente, “Ciclo” - “Fine” - “Inizio” – “Dipartimento” - “SSD” si comportano come già indicato

precedentemente, “Tutor” indica il nominativo del docente assegnato come tutor del dottorando ed

infine “Titolo TESI” riporta il titolo della tesi di ogni dottorando.

Per alcuni dei campi presenti negli elenchi sono state richieste delle funzionalità aggiuntive.

In primo luogo, tutti i campi E-mail presenti in ogni elenco (di docenti o dottorandi), dovranno

essere cliccabili permettendo l’invio di un messaggio di posta elettronica.

In secondo luogo, nell’elenco “Dottorandi in corso” è stato richiesto di rendere il campo

“Titolo della tesi” cliccabile. Il collegamento deve aprire un documento PDF memorizzato all’interno

di una cartella del portale e denominato nel seguente modo: d + valore chiave primaria + .pdf.

Ad esempio:

# Dottorando Ciclo Inizio Fine Dipartimento Tutor Titolo TESI SSD

15 DI GIUSTO Mauro 19 2004

Dip. di Scienze della vita MARZARI Roberto Titolo della tesi … BIO/06

21 SCIAN Giovanni 20 2005

Dip. di Fisica ROSEI Renzo Titolo della tesi … FIS/03

Page 17: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

17

Il dottorando Di Giusto Mauro ha come chiave primaria il numero 15; al clic del testo del

titolo il portale dovrà aprire il documento denominato d0015.pdf.

Il dottorando Scian Giovanni ha come chiave primaria il numero 21; al clic del testo del

titolo il portale dovrà aprire il documento denominato d0021.pdf.

Per soddisfare tale esigenza è stato deciso di utilizzare la tecnologia AJAX. In 4.4.3.4

Elenco dei “Dottorandi in corso” dedicato sarà spiegato in maniera molto più dettagliata

l’implementazione di tale funzionalità.

3.2.4 Calendario

La tecnologia WSS contiene già la funzionalità del calendario. Tale funzionalità permette

l’inserimento di eventi di vario genere. La visualizzazione delle attività inserite può essere mensile,

settimanale o giornaliera.

Per l’aggiunta di un nuovo evento è presente un pulsante con scritto “Nuovo” nella barra

superiore del calendario. Alcuni dei campi richiesti (quelli indicati con un asterisco), sono

obbligatori e rappresentano le informazioni minime per un nuovo evento. In aggiunta, però, è

possibile allegare un documento, indicare la ricorrenza dell’evento ed indicarne l’area di lavoro

dell’evento.

In Figura 9 è illustrata la maschera che si attiva per l’inserimento di un nuovo evento.

Figura 9 – Maschera per l’inserimento di un nuovo evento

Ad esempio in Figura 10 è visualizzato il calendario presente sul portale RECA. Si può

notare che l’aggiunta di tale funzionalità al portale comporta:

1. la presenza di un mini calendario indicante l’anno ed i mesi, tale componente permette

la navigazione tra i vari mesi o anni

Page 18: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

18

2. l’indicazione del mese selezionato

3. la visualizzazione per giorno, per settimana o per mese (la Figura 10 ad esempio

raffigura la visualizzazione mensile del mese di marzo 2009)

4. se nel portale WSS sono presenti delle liste di utenti, è possibile inviare

automaticamente un email ad ognuno per comunicare l’inserimento di un nuovo evento.

Figura 10 – Funzione calendario sul portale RECA

3.2.5 Raccolta di documenti pubblici

La tecnologia WSS implementa un componente, totalmente automatizzato, che permette la

gestione completa di una raccolta di documenti; i documenti possono essere generati online

oppure caricati da una qualsiasi cartella del pc.

I tipi di documento supportati dalla raccolta sono:

Documento di Microsoft Word 97-2003

Foglio di calcolo di Microsoft Excel 97-2003

Presentazione di Microsoft Powerpoint 97-2003

Sezione di Microsoft OneNote

Pagina web di Microsoft Sharepoint Designer

Pagina semplice

Pagina web part

La raccolta di documenti si presenta all’interno della pagina come in Figura 11.

Figura 11 – Raccolta di documento pubblici

Page 19: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

19

Nella barra superiore della raccolta di documenti sono presenti i pulsanti “Nuovo” e “Carica”

che permettono rispettivamente l’aggiunta di un nuovo documento o il caricamento di documenti

da una specifica cartella.

La creazione di un nuovo documento implica la presenza del programma installato sulla

macchina in uso. Ad esempio, per la creazione di un nuovo documento di Microsoft Word 97-2003

è indispensabile aver installato sul PC in uso Microsoft Word. Al termine della stesura del testo, il

documento sarà inviato direttamente alla raccolta di documenti e memorizzato all’interno del

portale.

Il caricamento di documento da una cartella specifica avviene tramite la seguente videata

Figura 12.

Figura 12 – Videata per il caricamento di documenti in una raccolta

In questa videata è possibile navigare tra le varie cartelle presenti all’interno del pc,

visualizzare il contenuto di ogni cartella e selezionare tutti i documenti che si desidera caricare

all’interno della raccolta.

3.2.6 Raccolta di documenti privati

Come visto nel paragrafo precedente, una raccolta di documenti privata è una normale

raccolta, che però non è utilizzabile da qualsiasi utente.

L’uso di tale raccolta è subordinato all’accesso tramite un login che permette l’utilizzo dei

documenti presenti in elenco. Il fatto che tale raccolta sia vincolata ad un accesso non modifica

assolutamente le funzionalità viste nel paragrafo precedente.

Page 20: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

20

3.2.7 Sviluppo delle pagine dedicate all’inserimento dei dati nel DB

L’aggiornamento delle informazioni contenute nel DB sarà effettuato da più persone. In

particolare una di queste utilizza come postazione un PC basato su sistema operativo Macintosh.

L’ambiente di sviluppo scelto è Visual Studio 2008 Professional e il linguaggio di

programmazione è C#.

Per la realizzazione di questa funzionalità è stato deciso di implementare all’interno del DB

delle tabelle descrittive: il compito di queste tabelle è di descrivere la costruzione del form per

l’inserimento dei dati. Per ogni tabella già presente all’interno del DB è prevista una tabella

descrittiva.

Ogni tabella descrittiva contiene i seguenti campi:

ID: chiave primaria della tabella descrittiva

FieldName: il nome del campo presente all’interno della tabella di riferimento

InItalian: il testo da visualizzare nel form se viene selezionata la lingua italiana

InEnglish: il testo da visualizzare nel form se viene selezionata la lingua inglese

Enabled: indica se la casella di testo del form è abilitata o meno, è stato scelto di

indicare con 1 abilitata e con 0 non abilitata

Length: la lunghezza del campo presente all’interno della tabella di riferimento (su tale

valore viene calcolata la grandezza della casella di testo)

Required: indica se l’inserimento del valore nel form è obbligatorio, è stato scelto di

indicare con 1 obbligatorio e con 0 non obbligatorio

TypeControl: il tipo di controllo richiesto per il form; è stato scelto di indicare con

“textbox” una semplice casella di testo e con “combobox” una casella di testo a tendina

TableReference: il nome della tabella di riferimento

IDTableReference: il nome della chiave primaria della tabella di riferimento

SQLStringForComboBox: contiene la stringa SQL necessaria per compilare l’elenco per

le caselle di testo a tendina.

Per spiegare meglio questa soluzione illustro l’esempio facendo riferimento alla tabella

tblDottorando.

In Figura 13 è riportato lo schema della tabella tblDottorando ed in Figura 14 è riportato lo

schema della tabella descrittiva, chiamata tbl_FieldDottorando, riferito alla tabella in esempio.

Page 21: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

21

Figura 13 - Schema della tabella tblDottorando

Figura 14 – Contenuto della tabella tbl_FieldDottorando

Osservando i dati inseriti in Figura 14 vediamo come essi descrivano il form per

l’inserimento delle informazioni in tabella. I campi descritti non devono essere obbligatoriamente

tutti i campi presenti nella tabella di riferimento (in questo caso tblDottorando).

In Figura 15 si può osservare il risultato ottenuto usando i valori presenti in

tbl_FieldDottorando.

Le varie voci “Cognome” – “Nome” – etc. vengono prelevate dal valore presente nel campo

“InItalian”; la tipologia della casella di testo dal campo “TypeControl” e le relative caratteristiche dai

Page 22: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

22

campi “Enabled” – “Length”; l’obbligatorietà del dato viene indicata con l’asterisco rosso e fa

riferimento al campo “Required”.

Figura 15 – Form generato dalla tabella tbl_FieldDottorando

Page 23: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

23

4. Realizzazione

La realizzazione delle varie parti si articola secondo tre modalità:

parametrizzazione semplice

parametrizzazione avanzata

sviluppo funzionalità aggiuntive.

La parametrizzazione semplice riguarda i componenti già presenti in WSS e per i quali non

sono state richieste particolari personalizzazioni. Tali componenti sono il calendario, le raccolte di

documenti, la personalizzazione del logo e dell’intestazione del portale.

La parametrizzazione avanzata riguarda i componenti già presenti in WSS e per i quali

sono state richieste delle modifiche. Tali componenti sono l’elenco degli annunci, l’elenco dei

collegamenti presenti nella pagina iniziale e la pagina delle tematiche di ricerca.

Lo sviluppo delle nuove parti riguarda componenti non presenti in WSS. Tali componenti

sono gli elenchi presentati nel precedente capitolo e la pagina dedicata all’inserimento dei dati.

4.1 Installazione e configurazione del pacchetto software

Questa tecnologia, come già indicato nei capitoli precedenti, si basa sul sistema operativo

Microsoft Windows Server 2003. Tale vincolo ha imposto l’utilizzo di un programma di

virtualizzazione come Sun xVM VirtualBox, versione 2.0.4.

Dando per scontate le procedure per creare un’unità virtuale e per installare il sistema

operativo, prima di procedere all’installazione di WSS, è indispensabile verificare che il sistema

soddisfi i requisiti previsti per WSS.

4.1.1 Requisiti per l’installazione di WSS

La prima procedura da seguire è l’installazione di IIS. Tale operazione può essere eseguita

avviando “Aggiungi/Rimuovi Componenti di Windows” dalla voce “Installazione applicazioni”

presente in “Pannello di controllo”. Per maggiore chiarezza riportiamo in Figura 16 la finestra che

dovrebbe apparire se eseguite correttamente tutte le operazioni.

Page 24: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

24

Figura 16 – Maschera per l’installazione di IIS

Le opzioni da richiamare in questa videata sono indicate in Figura 16. Per completare tale

operazione è necessario il cd di installazione del sistema operativo.

Un secondo requisito fondamentale è che nel sistema siano installate le estensioni per il

Framework .NET 3.5. Tale pacchetto è scaricabile gratuitamente al seguente indirizzo

http://www.microsoft.com/downloads/details.aspx?displaylang=it&FamilyID=333325fd-ae52-4e35-

b531-508d977d32a6.

Ultimo requisito è la presenza di una versione di Internet Explorer pari o superiore alla 6.

Per lo sviluppo di questo progetto è stato scelto di utilizzare la versione 8 (attualmente l’ultima

release disponibile) ed anch’essa è scaricabile gratuitamente al seguente indirizzo

http://www.microsoft.com/windows/internet-explorer/default.aspx.

Verificati questi punti, procediamo all’installazione del pacchetto WSS. Tale pacchetto,

anch’esso gratuito, è scaricabile al seguente indirizzo

http://www.microsoft.com/downloads/details.aspx?familyid=EF93E453-75F1-45DF-8C6F-

4565E8549C2A&displaylang=en.

4.1.2 Installazione di WSS

Durante la fase di installazione di WSS viene richiesto di selezionare il tipo di installazione

desiderata, come in Figura 17.

Page 25: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

25

Figura 17 – Tipologia di installazione di WSS

La tecnologia WSS prevede la memorizzazione di tutte le informazioni contenute nel

portale in un DB. Il DB può essere installato da SharePoint; in questo caso viene installata una

versione di SQL Server Express, o può essere utilizzato un altro DB già installato nella macchina

in uso.

La differenza tra l’installazione “Base” e “Avanzata” consente di decidere se utilizzare il

motore DB interno di SharePoint o, come nel nostro caso, un DB esterno quale Microsoft SQL

Server 2005. Scelta la tipologia e terminata l’installazione del prodotto, in automatico viene

eseguita la configurazione e l’inizializzazione del portale “Amministrazione centrale di SharePoint

3.0” - Figura 18.

Figura 18 – Amministrazione centrale WSS

Nella parte superiore della pagina sono presenti i pulsanti “Operazioni” e “Gestione

applicazioni”. Tali comandi permettono rispettivamente di:

Page 26: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

26

eseguire l’operazione di configurazione di WSS come backup e ripristino di dati,

configurazione del server WSS, gestione delle registrazioni e della reportistica

sull’utilizzo, etc.

gestire le applicazioni WSS: creare o rimuovere applicazioni e portali, e configurare i

relativi parametri di utilizzo e di protezione, gestire gli account di posta elettronica,

etc.

4.1.3 Inizializzazione di un portale

Per inizializzare un nuovo portale dalla pagina di “Amministrazione centrale SharePoint 3.0”

selezionare la voce “Gestione Applicazioni”. Ciò che appare sullo schermo è illustrato in Figura 19.

Figura 19 – “Gestione delle applicazioni” in Amministrazione Centrale WSS

La procedura si articola in due passaggi: il primo comporta la creazione, o l’estensione di

un’applicazione Web, il secondo invece la creazione di una raccolta siti basato sull’applicazione

appena aggiunta.

Le informazioni richieste nel primo passaggio sono:

il nome del nuovo portale Web IIS: indica l’indirizzo web del server web locale

attraverso il quale è raggiungibile il portale

Page 27: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

27

Figura 20 – Nuovo sito Web IIS

la porta assegnata al portale: può essere indicato un numero casuale qualsiasi,

l’importante è che non sia già utilizzato da un’altra applicazione

Figura 21 – Porta del nuovo Web IIS

i criteri di autenticazione e protezione

Figura 22 – Provider di autenticazione

l’indirizzo URL al quale sarà raggiungibile l’applicazione

Figura 23 – Indirizzo del nuovo Web IIS

il db del contenuto

Figura 24 – Nome del server e relativo nome del database per il nuovo Web IIS

Page 28: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

28

Terminata la compilazione dei campi, viene avviata la creazione della nuova applicazione

e, ad operazione terminata, compare una videata di conferma.

Ora bisogna creare una nuova “Raccolta siti”. Per avviare la procedura, è necessario

selezionare la voce “Crea raccolta siti” da “Gestione applicazioni”.

Le informazioni richieste per la creazione di una nuova raccolta sono:

il titolo e la descrizione della raccolta

Figura 25 – Titolo e descrizione nuova raccolta siti

il modello della raccolta siti

Figura 26 – Elenco modelli di raccolta siti

il nome utente dell’amministratore della raccolta

Figura 27 – Nome dell’utente amministratore

Terminato l’inserimento di questi dati le operazioni sono finite ed il portale inizializzato avrà

la videata come in Figura 28.

Page 29: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

29

Figura 28 – Nuovo portale WSS

4.2 Parametrizzazione semplice

La costruzione della pagina web con WSS prevede la presenza nell’angolo superiore

sinistro di un pulsante con la dicitura “Azioni sito”. Cliccando su questo pulsante compare un

piccolo menu a tendina come in Figura 29.

Figura 29 – Menu a tendina “Azioni sito”

I comandi presenti in questa tendina sono “Crea”, “Modifica pagina” e “Impostazioni sito” e

permettono rispettivamente di:

aggiungere al portale una nuova raccolta di documenti, immagini, moduli o pagine

wiki, oppure un elenco di annunci, contatti, collegamenti, aree di discussione, o

pagina HTML semplici o con web part4

4 Una web part è un controllo server ASP.NET che può essere aggiunto da un utente a run time. Più

web part possono essere integrate tra di loro per creare siti web "dinamici" e personalizzabili direttamente

dall'utente.

Page 30: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

30

modificare il contenuto della pagina selezionata. Come indicato nella descrizione è

possibile solamente aggiungere, modificare o rimuovere delle web part

accedere alla pagina dedicata alle impostazioni del portale.

Attraverso questa serie di comandi è possibile parametrizzare le funzionalità di WSS

direttamente online con un comunissimo browser.

4.2.1 Calendario

Per aggiungere il calendario al portale selezioniamo la voce “Crea” dal pulsante “Azioni

sito”. Nella videata che appare selezionare la voce “Calendario” presente nel gruppo “Gestione”

come in Figura 30.

Figura 30 – Gruppo gestione per l’inserimento del calendario

Selezionando la voce “Calendario” compare la videata per la creazione del nuovo

calendario (Figura 31) dove viene richiesto il nome del calendario, una descrizione e se il

collegamento al calendario deve comparire o meno nel menu laterale.

Figura 31 – Maschera per la creazione del nuovo calendario

4.2.2 Raccolte di documenti

Per aggiungere una raccolta, in particolare di documenti, al portale selezioniamo la voce

“Crea” dal pulsante “Azioni sito”. Nella videata che appare selezionare la voce “Raccolta

documenti” presente nel gruppo “Raccolte” come in Figura 32.

Page 31: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

31

Figura 32 – Gruppo gestione delle Raccolte

Selezionando la voce “Raccolta documenti” compare la videata per la creazione della

nuova raccolta (Figura 33) dove viene richiesto il nome della nuova raccolta, la descrizione della

nuova raccolta, se deve essere visualizzato il collegamento nel menu laterale o meno, se creare o

meno una copia del documento ad ogni modifica del contenuto e il modello di documento scelto

per la raccolta.

La scelta del modello di documento non vincola in alcun modo la possibilità di caricare nella

raccolta qualsiasi altro formato, ma impone il formato nel momento in cui ne viene creato uno

nuovo.

Figura 33 – Maschere per la creazione di una nuova Raccolta

4.2.3 Personalizzazione logo e intestazione del portale

Ogni nuovo portale generato in WSS riporta un logo standard e la dicitura scelta come

intestazione per il nuovo portale.

Page 32: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

32

Per personalizzare il logo e l’intestazione del portale selezioniamo la voce “Impostazione

sito” dal pulsante “Azioni sito”. Nella videata che appare selezionare la voce “Titolo, descrizione e

icona” presente nel gruppo “Aspetto” come in Figura 34.

Figura 34 – Gruppo delle opzioni Aspetto

Selezionando la voce indicata compare la videata come in Figura 35. Nella casella di testo

“Titolo” e “Descrizione” è possibile modificare l’intestazione e la descrizione del portale.

Figura 35 - Maschere per la modifica del Titolo e del logo del portale

Il campo URL indica l’indirizzo della nuova immagine scelta per il logo; tale immagine deve

essere già presente nella cartella Images del portale. Si può notare che in Figura 35 non è

presente alcun pulsante per il caricamento di documenti, perciò, per poter utilizzare un proprio logo

personalizzato bisogna utilizzare un programma esterno che permetta l’upload di file nelle cartelle

del portale.

Il programma che usiamo per il caricamento delle immagini è Microsoft SharePoint

Designer. Tale programma, come vedremo in maniera più approfondita nei prossimi paragrafi,

permette la completa gestione di un portale SharePoint.

Page 33: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

33

Una volta avviato il programma e collegato al portale, sullo schermo compare la lista di tutte

le cartelle o documenti presenti come in Figura 36. Dopo aver selezionato la cartella Images, come

indicato nell’immagine, usando il comando File\Importa si può caricare una o più immagini

all’interno della cartella specificata.

Terminata questa operazione, ritornando alla Figura 35, nel campo URL indichiamo il

percorso relativo dell’immagine desiderata. La prima parte del percorso /images/ indica, come visto

in fase di caricamento, la cartella contenente i file e la seconda parte il nome del file scelto. Sotto a

questa casella di testo appare la dicitura “Fare clic qui per verificare l’indirizzo”, lo scopo di questo

collegamento è la verifica dell’esattezza del percorso digitato: se è corretto viene aperta una nuova

finestra del browser e viene visualizzata l’immagine.

Figura 36 – Contenuto del portale SharePoint

Al termine di questa serie di operazioni il risultato visibile è riportato in Figura 37.

Figura 37 – Intestazione del portale

4.3 Parametrizzazione avanzata

La parametrizzazione avanzata, diversamente da quanto visto per quella semplice, richiede

il supporto di un programma esterno, Microsoft SharePoint Designer 2007, per personalizzare i

componenti inseriti nelle pagina da WSS. In poche parole, la parametrizzazione avanzata non è

eseguibile online, come visto in precedenza, ma richiede una postazione sulla quale sia installato il

programma citato.

Page 34: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

34

Per effettuare tali modifiche, nella maggior parte dei casi, la procedura prevede delle

operazioni iniziali quali l’inserimento di elenchi, raccolte o quant’altro (come visto nel paragrafo

precedente) e poi una seconda fase di modifica manuale usando SharePoint Designer.

4.3.1 Personalizzazione degli annunci

Per aggiungere un elenco di annunci al portale WSS selezioniamo la voce “Crea” dal

pulsante “Azioni sito”. Nella videata che compare, selezionare la voce “Annunci” dal gruppo

“Comunicazioni”.

Nella videata che appare viene richiesto il nome da assegnare alla nuova raccolta di

annunci, la descrizione e se visualizzare il collegamento alla lista nel menu laterale.

Figura 38 – Videata dell’elenco degli annunci

In Figura 38 si può vedere la videata che appare quando viene richiamata la lista degli

annunci; attraverso tale videata è possibile gestire i messaggi.

Per richiamare in una qualsiasi pagina l’elenco degli annunci come web part, selezionare la

voce “Modifica pagina” da “Azioni sito”. Richiamando questo comando la pagina passa dalla

visualizzazione normale alla modalità di modifica e all’interno della pagina compaiono dei pulsanti

con scritto “Aggiungi Web Part” che permettono di aggiungere web part alla pagina.

Cliccando su un qualsiasi pulsante “Aggiungi web part” compare la lista delle web part

attive, come in Figura 39, e da questo elenco selezioniamo il nome della lista degli annunci creata

precedentemente. Il risultato finale si può vedere in Figura 40.

Figura 39 – Esempio di elenco delle web part utilizzabili nella pagina

Page 35: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

35

Figura 40 – Web Part annuncio inserita nella pagina

Quello che vediamo in Figura 40 è la visualizzazione standard dell’elenco degli annunci.

Per personalizzare questa struttura occorre aprire la pagina con Microsoft Office Designer e da qui

modificare manualmente la web part.

Aprendo la pagina si vede che il componente dell’elenco viene inserito come unico oggetto,

le modifiche permesse sono limitate ma per le personalizzazioni avanzate è possibile convertire

l’oggetto in “XSLT Data View”. Per effettuare tale operazione selezionare la voce “Converti in

XSLT Data View” dal menu contestuale che appare premendo il tasto destro sull’oggetto come

Figura 41.

Figura 41 – Menu contestuale

Dopo che l’oggetto viene convertito in linguaggio XSLT, è possibile modificare il codice in

modo da ottenere un elenco come richiesto.

La parte iniziale del codice, generata da WSS e qui non riportata, è necessaria per la

connessione alla sorgente dei dati, la seconda parte invece è la parte di codice modificata per

ottenere le modifiche richieste.

Il codice modificato è il seguente:

<xsl:template name="dvt_1.rowview">

Page 36: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

36

<tr>

<xsl:if test="$dvt_1_automode = '1'" ddwrt:cf_ignore="1">

<td class="ms-vb" width="1%" nowrap="nowrap">

<span ddwrt:amkeyfield="ID" ddwrt:amkeyvalue="ddwrt:EscapeDelims(string(@ID))" ddwrt:ammode="view"></span>

</td>

</xsl:if>

<td class="ms-vb" style="height: 20px">

<a href="#" onclick="document.location.href='/Lists/News/DispForm.aspx?ID='+{@ID};"><strong><em><xsl:value-of select="@Title"

/></em></strong></a>

<xsl:if test="ddwrt:IfNew(string(@Created))"><IMG SRC="/_layouts/1040/images/new.gif" alt="Nuovo" /></xsl:if>

</td>

<td class="style4" style="height: 20px">

<xsl:value-of select="ddwrt:FormatDate(string(@Created) ,1040 ,1)"/>

</td>

</tr>

<tr>

<td colspan="2" bgcolor="black" style="height:1px"></td>

</tr>

<tr>

<td colspan="2"><xsl:value-of select="@Body" disable-output-escaping="yes"/></td>

</tr>

<tr>

<td colspan="2" style="height: 5px"></td>

</tr>

</xsl:template>

Il codice sopra riportato genera il titolo delle news; tale titolo sarà un collegamento

ipertestuale alla pagina dedicata alla news “/Lists/News/DispForm.aspx?ID='+{@ID};”. Se il

messaggio è stato inserito recentemente, vicino al titolo compare la piccola immagine con scritto

“Novità”. Sul lato destro della stessa riga viene visualizzata la data di creazione dell’annuncio. La

rimanente parte del codice genera una piccola riga nera di divisione ed il testo completo del

messaggio.

L’immagine Figura 42 illustra il risultato finale.

Figura 42 – Elenco annunci modificato

Page 37: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

37

4.3.2 Personalizzazione dei Link

La procedura seguita per la personalizzazione dell’elenco dei link rispecchia la serie di

operazioni indicate per la modifica dell’elenco degli annunci.

La visualizzazione standard dell’elenco dei collegamenti è riportata in Figura 43.

Figura 43 – Visualizzazione dell’elenco dei link

Il codice modificato per ottenere l’elenco dei collegamenti richiesto è il seguente:

<xsl:template name="dvt_1.rowview">

<tr>

<xsl:if test="$dvt_1_automode = '1'" ddwrt:cf_ignore="1">

<td class="ms-vb" width="1%" nowrap="nowrap">

<span ddwrt:amkeyfield="ID" ddwrt:amkeyvalue="ddwrt:EscapeDelims(string(@ID))" ddwrt:ammode="view"></span>

</td>

</xsl:if>

<td class="ms-vb" style="padding:3px">

<a href="{substring-before(@URL, ', ')}" target="_blank">

<xsl:value-of select="substring-after(@URL, ', ')"/>

</a>

</td>

</tr>

</xsl:template>

Tale parte di codice visualizza l’elenco dei collegamenti inseriti senza altre funzionalità:

viene visualizzato semplicemente il nome del collegamento e tale nome è un collegamento

ipertestuale alla risorsa specificata.

Il risultato di tale modifica è riportato in Figura 44.

Figura 44 – Elenco dei collegamenti ipertestuali

4.3.3 Personalizzazione della pagina iniziale

Per realizzare una pagina iniziale come presentata nel capitolo dei requisiti si è manifestata

la necessità di modificare manualmente le Web Part Zone5. Tale operazione può essere effettuata

attraverso la voce “Web Part Zone” presente nel menu “Inserisci\Componenti Sharepoint” di

Microsoft Office Designer.

5 Le Web Part Zone sono i contenitori presenti nelle pagine Aspx all’interno dei quali è possibile

inserire le varie web part

Page 38: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

38

Con semplici operazioni di selezione, eliminazione ed inserimento si è ottenuto una

struttura della pagina del seguente tipo (Figura 45).

Figura 45 – Composizione delle Web Part Zone nella pagina default.aspx

Ora non rimane altro che richiamare le singole Web Part nelle zone predestinate utilizzando

il pulsante che appare “Aggiungi web part”.

La posizione assegnata alle singole web part è la seguente:

in zona 3 la “Web Part Editor Contenuto”: tale componente attraverso un comodo

Editor Rich Text permette di editare qualsiasi tipo di testo ed immagini

in zona 2 l’elenco degli annunci

in zona 4 l’elenco dei collegamenti ipertestuali

in zona 1 momentaneamente non utilizzata.

4.3.4 Personalizzazione della pagina delle tematiche

La pagina delle tematiche di ricerca è stata aggiunta creando un elenco personalizzato

raggiungibile selezionando la voce “Crea” dal pulsante “Azioni sito”.

Ottenuto il nuovo elenco è necessario richiamare la pagina con Microsoft Office Designer

per poter eliminare l’elenco inserito da WSS ed aggiungere un’unica Web Part Zone.

Predisposta la nuova Web Part Zone, attraverso il pulsante “Aggiungi web part”

aggiungiamo la “Web Part Editor Contenuto”. Come già indicato nel precedente paragrafo tale web

part dispone di un Rich Text Editor per la scrittura del testo.

4.4 Sviluppo di nuove parti

4.4.1 Connessione alla sorgente dati

Le web part presenti in WSS non permettono la visualizzazione di dati prelevati dalle

sorgenti di dati esterne al DB interno di WSS. Per ottenere elenchi come quelli richiesti e presentati

nel precedente capitolo si richiede una costruzione manuale della lista utilizzando Microsoft Office

Designer.

Il programma indicato supporta la lettura di dati da varie fonti quali liste di Sharepoint,

elenchi di Sharepoint, documenti XML e connessioni a database.

Nel nostro caso il fattore più importante riguarda la connessione al DB della scuola;

attraverso tale mezzo saranno create le stringhe di connessione alle viste presenti.

Page 39: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

39

Per realizzare una connessione richiamare la finestra “Data source Library” dal menu “Task

Panes”, sul lato di destra compare la videata come in Figura 46.

Figura 46 – Libreria della Data source

In questa videata selezionare la voce “Database Connections” e conseguentemente la voce

“Connect to a database”. Dopo tale operazione vengono richiesti i dati per effettuare la

connessione: quindi il nome del server, il nome dell’account e la relativa password. Verificata la

veridicità dei dati da parte del server viene presentata la lista dei database con relative tabelle o

viste in esso contenute (Figura 47). Da tali liste saranno richiamate tutte le viste necessarie per

realizzare i vari elenchi.

Figura 47 – Elenco delle tabelle e viste presenti in NanotechDB

Ripetendo le operazioni descritte per ognuna delle viste si ottiene il seguente risultato come

in Figura 48.

Page 40: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

40

Figura 48 – Elenco delle connessioni stabilite alle viste

4.4.2 Creazione di un elenco personalizzato

Indipendentemente da quale sia l’elenco richiesto le operazioni da effettuare per ottenere le

liste desiderate sono le medesime.

La prima operazione è la creazione di un nuovo elenco personalizzato: tale operazione può

essere eseguita direttamente dal Microsoft Office Designer attraverso la voce

File\Nuovo\Componente Sharepoint. Nella videata che appare (Figura 49) selezionare la voce

“Elenco personalizzato”, specificare il nuovo nome da assegnare all’elenco e confermare il tutto

con il tasto “OK”

Figura 49 – Aggiunta di un nuovo elenco

Al termine di questa operazione, verrà aggiunta una nuova cartella alla cartella “Lists”; il

nome della nuova cartella sarà il nome specificato per il nuovo elenco ed il contenuto una serie di

Page 41: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

41

pagine per la gestione delle informazioni. Tra tutte le pagine presenti, quella da modificare per

ottenere gli elenchi richiesti si chiama AllItems.aspx.

Figura 50 – Contenuto della cartella “Collegio dei docenti”

Tali operazioni vanno ripetute per ogni elenco, e il risultato finale saranno tante cartelle

quanti sono gli elenchi desiderati (Figura 51).

Figura 51 – Contenuto della cartella Lists

4.4.3 Personalizzazione di un elenco personalizzato

Aprendo una qualsiasi pagina AllItems.aspx di un qualsiasi elenco con Microsoft Office

Designer appare una videata dove troviamo già installato il componente per la gestione dei

documenti. Il componente va eliminato e sostituito, tramite un’operazione di trascinamento, con

una delle connessioni viste in Figura 48.

4.4.3.1 Elenco del “Collegio dei docenti”

Procedendo come indicato nel precedente paragrafo, otteniamo il seguente risultato come

in Figura 52; a lato compare il menu visualizzato in Figura 53.

Page 42: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

42

Figura 52 – Elenco del “Collegio dei docenti”

Figura 53 – Menu di personalizzazione del elenco

Come possiamo vedere in Figura 52, terminato il trascinamento della connessione stabilita

con la vista vwCollegioDocenti, Designer visualizza un elenco contenente i primi campi indicati (in

questo caso IDDocente, Cognome, Nome, SSD, Ente). Il menu visualizzato in Figura 53 compare

ogni volta che l’elenco viene selezionato e permette la personalizzazione dei campi contenuti.

Analizziamo le funzioni proposte:

FILTER: permette di effettuare un filtraggio dei dati e corrisponde alla condizione

WHERE in una stringa SQL

SORT and GROUP: permette di effettuare un ordinamento o un raggruppamento

dei dati e corrisponde al GROUP BY

PAGING: indica il numero di record da visualizzare per ogni pagina; in questo caso

“10 item(s) per set” indica 10 record per pagina

EDIT COLUMNS: permette di indicare quali campi visualizzare nell’elenco e la

relativa sequenza

CHANGE LAYUOT: permette di modifica il layout della lista

DATA VIEW PREVIEW: visualizza un’anteprima della lista

CONDITIONAL FORMATTING: permette di scegliere uno stile per la formattazione

condizionata; di default viene richiamata la classe css ms_alternating

Page 43: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

43

WEB PART CONNECTION: visualizza lo stato della connessione; in questo caso

alla vista vwCollegioDocenti

PARAMETERS: permette l’inserimento di parametri da passare alla web part

REFRESH DATA VIEW: aggiorna i dati

DATA VIEW PROPERTIES: è la finestra generale dov’è riassunto tutto quanto visto

in questo menu.

Usando i comandi appena spiegati è stata effettuata una prima parametrizzazione

dell’oggetto.

In particolare è stato modificato l’ordine dei campi secondo il seguente schema:

1. Nome e cognome del docente

2. Ruolo nel collegio

3. Indirizzo Email

4. Dipartimento di appartenenza

5. Ente di appartenenza

6. Posizione

7. SSD (Settore Scientifico Disciplinare),

e non è stato richiesto alcun limite di record per pagina.

La seconda fase di personalizzazione è stata eseguita direttamente in modalità CODE per

ottenere le modifiche che in modalità DESIGN non è stato possibile raggiungere.

Il codice ottenuto alla fine è molto lungo; di seguito riportiamo alcune spezzoni con la

relativa descrizione.

<table border="0" width="100%" cellpadding="5" cellspacing="0">

<tr valign="top" class="ms-menutoolbar">

<xsl:if test="$dvt_1_automode = '1'" ddwrt:cf_ignore="1">

<th class="ms-toolbar" width="1%" nowrap="nowrap"></th>

</xsl:if>

<th class="ms-toolbar" nowrap="" style="text-align:left">

<xsl:call-template name="dvt.headerfield" ddwrt:atomic="1">

<xsl:with-param name="fieldname">@Cognome</xsl:with-param>

<xsl:with-param name="fieldtitle">Docente</xsl:with-param>

<xsl:with-param name="displayname">Cognome</xsl:with-param>

<xsl:with-param name="sortable">1</xsl:with-param>

<xsl:with-param name="fieldtype">x:string</xsl:with-param>

</xsl:call-template>

</th>

<th class="ms-toolbar" nowrap="" style="text-align:left">

<xsl:call-template name="dvt.headerfield" ddwrt:atomic="1">

<xsl:with-param name="fieldname">@Ruolo</xsl:with-param>

<xsl:with-param name="fieldtitle">Ruolo</xsl:with-param>

<xsl:with-param name="displayname">Ruolo</xsl:with-param>

<xsl:with-param name="sortable">1</xsl:with-param>

<xsl:with-param name="fieldtype">x:string</xsl:with-param>

</xsl:call-template>

Page 44: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

44

</th>

</tr>

Questa prima parte visualizza la prima riga della tabella. Ogni voce della prima riga

permette, attraverso la comparsa di una tendina, il filtraggio o il raggruppamento dei dati

direttamente online.

In particolare:

<xsl:with-param name="fieldname">@Cognome</xsl:with-param>

indica che il campo di riferimento è @Cognome; questo, se viene attivato un qualsiasi

filtraggio o raggruppamento, viene eseguito sul campo indicato,

<xsl:with-param name="fieldtitle">Docente</xsl:with-param>

indica la parola visualizzata nell’intestazione della tabella,

<xsl:with-param name="displayname">Cognome</xsl:with-param>

indica il valore visualizzato nell’elenco della tendina,

<xsl:with-param name="sortable">1</xsl:with-param>

<xsl:with-param name="fieldtype">x:string</xsl:with-param>

sono dei parametri inseriti da Designer.

Per collegare l’intestazione dell’elenco con la classe css sopra riportata, in ogni riga è stato

aggiunto un riferimento class="ms-toolbar"; ciò rende sensibile l’elenco al cambiamento del tema

da parte dell’amministratore del portale della scuola.

Il codice riportato di seguito indica la seconda parte, tale codice visualizza tutti i dati

prelevati dalla vista.

<tr>

<td class="ms-vb">

<xsl:value-of select="@Cognome"/>

<xsl:text xmlns:ddwrt="http://schemas.microsoft.com/WebParts/v2/DataView/runtime" ddwrt:whitespace-preserve="yes"

xml:space="preserve"> </xsl:text>

<xsl:value-of select="@Nome"/>

</td>

<td class="ms-vb">

<xsl:value-of select="@Ruolo"/>

</td>

<td style="text-align:center">

<a href="mailto:{@email}"><img src="../../images/email_ico.gif" border="0" alt="Invia email a {@email}" /></a>

</td>

<td class="ms-vb">

<a href="mailto:{@email}"><xsl:value-of select="@email" /></a>

</td>

<td class="ms-vb">

<xsl:value-of select="@NomeDip"/>

</td>

<td class="ms-vb" style="text-align:center">

<xsl:value-of select="@Ente"/>

</td>

Page 45: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

45

<td class="ms-vb" style="text-align:center">

<xsl:value-of select="@SiglaPosizione"/>

</td>

<td class="ms-vb" style="text-align:center">

<xsl:value-of select="@SSD"/>

</td>

</tr>

</xsl:template>

In particolare:

<td class="ms-vb">

<xsl:value-of select="@Ruolo"/>

</td>

per ogni campo da visualizzare è stata richiamata la variabile associata. Nello spezzone di

codice sopra riportato, ad esempio viene richiamato il valore del campo @Ruolo.

<a href="mailto:{@email}"><img src="../../images/email_ico.gif" border="0" alt="Invia email a {@email}" /></a>

Questo spezzone di codice inserisce vicino al campo @Email una piccola immagine

cliccabile che permette l’invio di un messaggio di posta elettronica.

4.4.3.2 Elenco del “Consiglio Scientifico”

Come già descritto nel precedente paragrafo, anche l’inserimento di un elenco prevede la

stessa sequenza di operazioni.

L’ordine dei campi è il seguente:

1. Nominativo

2. Ruolo

3. Email

4. Dipartimento

5. Ente

6. Posizione

7. SSD

Il codice ottenuto alla fine è il seguente.

<table border="0" width="100%" cellpadding="5" cellspacing="0">

<tr valign="top" class="ms-menutoolbar">

<xsl:if test="$dvt_1_automode = '1'" ddwrt:cf_ignore="1">

<th class="ms-vh" width="1%" nowrap="nowrap"></th>

</xsl:if>

<th class="ms-toolbar" nowrap="nowrap" style="text-align:left">Nominativo</th>

<th class="ms-toolbar" nowrap="nowrap" style="text-align:left">Ruolo</th>

<th class="ms-toolbar" nowrap="nowrap" style="width:22px"></th>

<th class="ms-toolbar" nowrap="nowrap" style="text-align:left">Email</th>

<th class="ms-toolbar" nowrap="nowrap" style="text-align:left">Dipartimento</th>

<th class="ms-toolbar" nowrap="nowrap" style="width:120px">Ente</th>

<th class="ms-toolbar" nowrap="nowrap" style="width:60px">POS</th>

<th class="ms-toolbar" nowrap="nowrap" style="width:60px">SSD</th>

</tr>

Page 46: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

46

<xsl:call-template name="dvt_1.body">

<xsl:with-param name="Rows" select="$Rows"/>

</xsl:call-template>

</table>

Questa prima parte del codice genera l’intestazione della tabella.

<th class="ms-toolbar" nowrap="nowrap" style="text-align:left">Nominativo</th>

In questo caso non è prevista una tendina per l’ordinamento o per il raggruppamento; difatti

il codice, per inserire ogni singola voce, è più breve rispetto al precedente elenco.

Nella seconda parte invece il codice è pressoché identico a quanto visto per il “Collegio dei

docenti”.

<td class="ms-vb">

<xsl:value-of select="@Cognome"/>

<xsl:text xmlns:ddwrt="http://schemas.microsoft.com/WebParts/v2/DataView/runtime" ddwrt:whitespace-preserve="yes" xml:space="preserve">

</xsl:text>

<xsl:value-of select="@Nome"/>

</td>

<td class="ms-vb">

<xsl:value-of select="@RuoloConsiglioScientifico"/>

</td>

<td style="text-align:center">

<a href="mailto:{@email}"><img src="../../images/email_ico.gif" border="0" alt="Invia email a {@email}" /></a>

</td>

<td class="ms-vb">

<a href="mailto:{@email}"><xsl:value-of select="@email"/></a>

</td>

<td class="ms-vb">

<xsl:value-of select="@NomeDip"/>

</td>

<td class="ms-vb" style="text-align:center">

<xsl:value-of select="@Ente"/>

</td>

<td class="ms-vb" style="text-align:center">

<xsl:value-of select="@SiglaPosizione"/>

</td>

<td class="ms-vb" style="text-align:center">

<xsl:value-of select="@SSD"/>

</td>

4.4.3.3 Elenco dei “Supervisori”

L’ordine scelto per questo elenco è:

1. Supervisore

2. Dottorando

3. Ciclo

4. Anno inizio

5. Anno fine

Page 47: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

47

6. Dipartimento

7. Ente

Il codice seguente riporta solamente l’esempio per un singolo campo:

<table border="0" width="100%" cellpadding="5" cellspacing="0">

<tr valign="top" class="ms-menutoolbar">

<xsl:if test="$dvt_1_automode = '1'" ddwrt:cf_ignore="1">

<th class="ms-toolbar" width="1%" nowrap="nowrap"></th>

</xsl:if>

<th class="ms-toolbar" nowrap="" style="text-align:left">

<xsl:call-template name="dvt.headerfield" ddwrt:atomic="1">

<xsl:with-param name="fieldname">@Cognome</xsl:with-param>

<xsl:with-param name="fieldtitle">Supervisore</xsl:with-param>

<xsl:with-param name="displayname">Cognome</xsl:with-param>

<xsl:with-param name="sortable">1</xsl:with-param>

<xsl:with-param name="fieldtype">x:string</xsl:with-param>

</xsl:call-template>

</th>

</tr>

..

<td class="ms-vb">

<xsl:value-of select="@Cognome"/>

<xsl:text xmlns:ddwrt="http://schemas.microsoft.com/WebParts/v2/DataView/runtime" ddwrt:whitespace-preserve="yes"

xml:space="preserve"> </xsl:text>

<xsl:value-of select="@Nome"/>

</td>

</tr>

4.4.3.4 Elenco dei “Dottorandi in corso”

L’ordine dei campi scelto per la visualizzazione è:

1. # indica la chiave primaria

2. Dottorando

3. Ciclo

4. Inizio

5. Fine

6. Email

7. Dipartimento

8. Tutor

9. Titolo

10. SSD

Riportiamo il codice modificato per l’elenco dei dottorandi in corso.

<table border="0" width="100%" cellpadding="5" cellspacing="0">

<tr valign="top" class="ms-menutoolbar">

<xsl:if test="$dvt_1_automode = '1'" ddwrt:cf_ignore="1">

<th class="ms-toolbar" width="1%" nowrap="nowrap"></th>

Page 48: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

48

</xsl:if>

<th class="ms-toolbar" nowrap="">

<xsl:call-template name="dvt.headerfield" ddwrt:atomic="1" xmlns:ddwrt="http://schemas.microsoft.com/WebParts/v2/DataView/runtime">

<xsl:with-param name="fieldname">@ID</xsl:with-param>

<xsl:with-param name="fieldtitle">#</xsl:with-param>

<xsl:with-param name="displayname">ID</xsl:with-param>

<xsl:with-param name="sortable">1</xsl:with-param>

<xsl:with-param name="fieldtype">x:int</xsl:with-param>

</xsl:call-template>

</th>

<th class="ms-toolbar" nowrap="" style="text-align:left">

<xsl:call-template name="dvt.headerfield" ddwrt:atomic="1" xmlns:ddwrt="http://schemas.microsoft.com/WebParts/v2/DataView/runtime">

<xsl:with-param name="fieldname">@Cognome</xsl:with-param>

<xsl:with-param name="fieldtitle">Dottorando</xsl:with-param>

<xsl:with-param name="displayname">Cognome</xsl:with-param>

<xsl:with-param name="sortable">1</xsl:with-param>

<xsl:with-param name="fieldtype">x:string</xsl:with-param>

</xsl:call-template>

</th>

</table>

La costruzione di questa prima parte di codice è simile all’elenco del “Collegio dei docenti”,

che, come vista già in precedenza, visualizza la prima riga della tabella.

<tr>

<td class="ms-vb" style="text-align:center">

<xsl:value-of select="format-number(@ID, '#,##0.#;-#,##0.#')"/>

</td>

<td class="ms-vb">

<xsl:value-of select="@Cognome"/>

<xsl:text xmlns:ddwrt="http://schemas.microsoft.com/WebParts/v2/DataView/runtime" ddwrt:whitespace-preserve="yes"

xml:space="preserve"> </xsl:text>

<xsl:value-of select="@Nome"/>

</td>

<td class="ms-vb">

<xsl:value-of select="@NomeDip"/>

</td>

<td class="ms-vb">

<xsl:value-of select="@Expr1"/>

<xsl:text xmlns:ddwrt="http://schemas.microsoft.com/WebParts/v2/DataView/runtime" ddwrt:whitespace-preserve="yes"

xml:space="preserve"> </xsl:text>

<xsl:value-of select="@Expr2"/>

</td>

<td class="ms-vb" style="text-align:center">

<a href="#" onclick="ResultTestDoc(GenerateLinkDocument(1,{@ID}));"><img src="../../images/logo_pdf.png" border="0" width="20px"

height="20px" /></a>

</td>

<td class="ms-vb">

<a href="#" onclick="ResultTestDoc(GenerateLinkDocument(1,{@ID}));"><xsl:value-of select="@TitoloTEsiITA"/></a>

</td>

<td class="ms-vb" style="text-align:center">

<xsl:value-of select="@SSD"/>

</td>

</tr>

Page 49: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

49

In questa seconda parte di codice vengono generate le righe contenenti i dati dei dottorandi

in corso; anche in questo caso la costruzione è simile agli elenchi visti finora.

Per l’elenco in oggetto è stata richiesta la possibilità di associare ad ogni dottorando un

documento PDF contenente le informazioni in merito all’attività di ricerca. La parte di codice che

implementa tale funzionalità è la seguente.

<td class="ms-vb" style="text-align:center">

<a href="#" onclick="ResultTestDoc(GenerateLinkDocument(1,{@ID}));"><img src="../../images/logo_pdf.png" border="0" width="20px"

height="20px" /></a>

</td>

<td class="ms-vb">

<a href="#" onclick="ResultTestDoc(GenerateLinkDocument(1,{@ID}));"><xsl:value-of select="@TitoloTEsiITA"/></a>

</td>

La particolarità di tale necessità riguarda il fatto che il sistema deve verificare l’esistenza del

documento, e solo in caso di risposta affermativa, visualizzarne il contenuto.

Per realizzare il collegamento è stato scelto di sviluppare un file javascript contenente una

chiamata AJAX: il funzionamento dello script verrà illustrato in maniera più dettagliata paragrafo

4.4.4 Script javascript per la chiamata AJAX.

La chiamata della funzione AJAX avviene attraverso l’inserimento di un ScriptLink

richiamabile dalla finestra TaskPanes\Toolbox ().

Figura 54 – ScriptLink all’interno della finestra Toolbox

Il comando ScriptLink aggiunge alla pagina una riga di codice, riportata di seguito,

<SharePoint:ScriptLink runat="server" id="MakeLinkDocuments" Name="makelinkdocuments.js" Language="javascript"/>

che modificata opportunamente, richiama il file javascript preventivamente memorizzato

all’interno della cartella

C:\Program Files\Common Files\Microsoft Shared\web server Extensions\12\TEMPLATE\LAYOUTS\1040

Page 50: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

50

presente sul server di lavoro.

La porzione di codice che utilizza la chiamata AJAX è

<a href="#" onclick="ResultTestDoc(GenerateLinkDocument(1,{@ID}));">…</a>

Lo script JavaScript è composta da due funzioni:

ResultTestDoc()

o se il documento PDF associato al dottorando è presente all’interno della

cartella, viene visualizzato in una nuova finestra, altrimenti viene restituito un

messaggio di errore che comunica all’utente che il documento non è

presente

o accetta come parametro il nome del documento, in questo caso generato

dalla funzione GenerateLinkDocument()

GenerateLinkDocument()

o restituisce il nome del documento, ad esempio d0020.pdf

o accetta come parametri un numero identificativo della lettera iniziale e il

valore della chiave primaria del dottorando di cui l’utente vuole vedere la

relazione.

4.4.4 Script javascript per la chiamata AJAX

La tecnologia AJAX permette l’interazione tra il client ed il server web senza l’obbligo di

ricaricare la pagina web. Il file javascript viene richiamato attraverso la funzione ScriptLink, come

indicato precedentemente, e nel momento in cui la pagina viene compilata si traduce in

<script type="text/javascript" language="javascript"

src="/_layouts/1040/makelinkdocuments.js?rev=Wl03Trr%2FfzWnmLDgDn0fhA%3D%3D"></script>

Il motivo per cui è stato scelto di utilizzare questa tecnologia deriva dal fatto che il codice

presente in una pagina WSS non accetta l’intrusione di un codice esterno e il comando ScriptLink

accetta il caricamento solo di documenti .js.

Il codice sviluppato è il seguente:

var xmlhttp; // Variabile contenente la request XMLHttpRequest.

var ResultXMLHttp = -1; // Indica il risultato restituito dal server. Inizializzato a -1.

var oTimer; // il timer

var called = false; // Indica se è già stata richiamata la funzione ResultTestDoc

function SetInitialChar(id) {

var InitialChar;

if (id==1) { InitialChar='d'; }

if (id==2) { InitialChar='p'; }

return InitialChar;

}

function GenerateLinkDocument(initial,id) {

var idtable,beginwith,namefiledocument,extension;

Page 51: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

51

idtable=id;

extension='.pdf';

if (idtable < 10)

{ beginwith=SetInitialChar(initial) + String('000'); }

else if (idtable < 100) { beginwith=SetInitialChar(initial) + String('00'); }

else if (idtable < 1000) { beginwith=SetInitialChar(initial)+ String('0'); }

else if (idtable < 10000) { beginwith=SetInitialChar(initial); }

namefiledocument = beginwith + idtable + extension;

return namefiledocument;

}

function ResultTestDoc(url) {

if (!called) { // Prima volta che richiamo la funzione?. Chiamo Ajax...

loadXMLDoc(url);

called = true;

oTimer = setInterval(function(){ResultTestDoc(url);},100); // Imposto il timer di attesa della risposta da parte del server.

// Richiamo la funzione e verifico il risultato.

}

else {

if (ResultXMLHttp==-1) // Risultato e' ancora -1: aspetto il prox ciclo!

return;

clearInterval(oTimer); // Risultato non e' -1: analizzo la risposta del server.

called = false; // Reimposto la variabile called per un nuovo utilizzo.

if (ResultXMLHttp==200) { // testo Risultato

window.open(url);

}

else {

alert('File doesn\'t exist or can\'t open it!');

}

}

}

function loadXMLDoc(url) {

xmlhttp=null;

if (window.XMLHttpRequest) // Codice per IE7, Firefox, Opera, etc.

{ xmlhttp=new XMLHttpRequest(); }

else if (window.ActiveXObject) // Codice per IE6, IE5

{ xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); }

if (xmlhttp!=null)

{

xmlhttp.onreadystatechange=state_Change;

xmlhttp.open("GET",url,true);

xmlhttp.send(null);

}

else

{ alert("Your browser does not support XmlHTTPRequest."); }

}

function state_Change() {

if (xmlhttp.readyState==4)

{ // 4 = "loaded"

if (xmlhttp.status==200)

{ // 200 = "OK" 404 = "File non found"

ResultXMLHttp = xmlhttp.status;

}

else {

//alert("Problem retrieving data: " + xmlhttp.statusText);

ResultXMLHttp = xmlhttp.status;

Page 52: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

52

}

}

}

Il compito delle funzioni SetInitialChar(id) e GenerateLinkDocument(initial,id) è di generare

il nome del documento PDF.

La funzione ResultTestDoc(url) accetta come parametro il nome del documento generato

dalle due funzioni indicate precedentemente. Ottenuto ciò avvia la funzione loadXMLDoc(url) ed

attende la risposta da parte del server.

Dopo aver effettuato la chiamata viene attivato un timer

oTimer = setInterval(function(){ResultTestDoc(url);},100);

che richiama la funzione ResultTestDoc(url) finché viene ricevuta una risposta dal parte del

server. Il risultato da parte del server viene fornito con i codici 200 e 404, che indicano

rispettivamente “File exist” e “File not found”, e di conseguenza viene visualizzato il documento o

restituito un messaggio che indica l’assenza del documento PDF.

La funzione loadXMLDoc(url) effettua la connessione attraverso XmlHTTPRequest, o

ActiveXObject in caso di browser datati.

4.4.5 Sviluppo pagina .Net per l’inserimento dei dati

La pagina dedicata all’inserimento dei dati è stata sviluppa in linguaggio C# e con

l’ambiente di sviluppo Visual Studio 2008 Professional.

Come già spiegato nel paragrafo 3.2.7 Sviluppo delle pagine dedicate all’inserimento

dei dati nel DB è stato scelto di realizzare nel NanotechDB delle tabelle descrittive di ogni tabella

presente. Il compito della pagina in oggetto sarà quello di leggere le tabelle descrittive e di

visualizzare dei form idonei all’inserimento dei dati richiesti dall’utente.

Le tabelle realizzate sono le seguenti:

1. TBL_FieldDipartimento

2. TBL_FieldDocente

3. TBL_FieldDottorando

4. TBL_FieldEnte

5. TBL_FieldMissione

6. TBL_FieldPosizione

7. TBL_FieldRuoloCollegio

8. TBL_FieldRuoloCS

9. TBL_FieldTutoraggio

Il codice sviluppato è il seguente.

using System;

Page 53: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

53

using System.Configuration;

using System.Data;

using System.Data.SqlClient;

using System.Linq;

using System.Web;

using System.Web.Security;

using System.Web.UI;

using System.Web.UI.HtmlControls;

using System.Web.UI.WebControls;

using System.Web.UI.WebControls.WebParts;

using System.Xml.Linq;

using System.Text;

public partial class _Default : System.Web.UI.Page

{

static string primaryLang = HttpContext.Current.Request.UserLanguages[0].ToString();

static string ConnString = "Data Source=WINSER2003;Initial Catalog=NanotechDB;Persist Security Info=True;User ID=sa;Password=admin";

string SQLQueryString = null;

string NameOfTable = null;

string NameOfDropDownList = null;

string selectDropDownList = null;

string NameOfTableInsert = null;

SqlConnection conn = new SqlConnection(ConnString);

StringBuilder SQLInsertString = new StringBuilder();

DataSet ListFields = new DataSet();

protected void Page_Load(object sender, EventArgs e)

{

string queryStringValue = Request.QueryString["page"];

if (queryStringValue != null)

{

switch (queryStringValue)

{

case "1": NameOfTable = "TBL_FieldDottorando"; break;

case "2": NameOfTable = "TBL_FieldDocente"; break;

case "3": NameOfTable = "TBL_FieldDipartimento"; break;

case "4": NameOfTable = "TBL_FieldEnte"; break;

case "5": NameOfTable = "TBL_FieldMissione"; break;

case "6": NameOfTable = "TBL_FieldPosizione"; break;

case "7": NameOfTable = "TBL_FieldRuoloCollegio"; break;

case "8": NameOfTable = "TBL_FieldRuoloCS"; break;

case "9": NameOfTable = "TBL_FieldTutoraggio"; break;

default: NameOfTable = null; break;

}

if (NameOfTable != null) { SQLQueryString = string.Format("SELECT * FROM {0}", NameOfTable.ToString()); }

}

if (SQLQueryString != null)

{

switch (queryStringValue)

{

case "1": NameOfTableInsert = "tblDottorando"; break;

case "2": NameOfTableInsert = "tblDocente"; break;

case "3": NameOfTableInsert = "tblDipartimento"; break;

Page 54: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

54

case "4": NameOfTableInsert = "tblEnte"; break;

case "5": NameOfTableInsert = "tblMissione"; break;

case "6": NameOfTableInsert = "tblPosizione"; break;

case "7": NameOfTableInsert = "tblRuoloCollegio"; break;

case "8": NameOfTableInsert = "tblRuoloCS"; break;

case "9": NameOfTableInsert = "tblTutoraggio"; break;

default: NameOfTableInsert = null; break;

}

SQLInsertString.Append(string.Format("INSERT INTO {0} (", NameOfTableInsert.ToString()));

try

{

conn.Open();

SqlDataAdapter AdapterListField = new SqlDataAdapter(SQLQueryString, conn);

AdapterListField.Fill(ListFields, "ListFields");

Panel panelModule = new Panel();

foreach (DataRow field in ListFields.Tables[0].Rows)

{

Label labelModule = new Label();

if (primaryLang == "it")

labelModule.Text = field["InItalian"].ToString();

else

labelModule.Text = field["InEnglish"].ToString();

labelModule.CssClass = "labelText";

panelModule.Controls.Add(labelModule);

panelModule.Controls.Add(new LiteralControl("<br/>"));

if (field["TypeControl"].ToString() == "textbox" || field["TypeControl"].ToString() == "fileupload")

{

TextBox textboxModule = new TextBox();

textboxModule.ID = field["FieldName"].ToString();

if (Convert.ToInt32(field["Length"]) != null || Convert.ToInt32(field["Length"]) > 0)

textboxModule.MaxLength = Convert.ToInt32(field["Length"]);

else

textboxModule.MaxLength = 50;

textboxModule.Width = textboxModule.MaxLength * 10;

textboxModule.CssClass = "textboxModule";

panelModule.Controls.Add(textboxModule);

if (Convert.ToInt32(field["Required"]) == 1)

{

RequiredFieldValidator rfvModule = new RequiredFieldValidator();

rfvModule.ID = string.Format("{0}_Required", textboxModule.ID);

rfvModule.ControlToValidate = textboxModule.ID;

rfvModule.CssClass = "requireFieldValidatorText";

if (primaryLang == "it")

rfvModule.ErrorMessage = string.Format("Campo '{0}' Richiesto!", field["InItalian"].ToString());

else

rfvModule.ErrorMessage = string.Format("Value '{0}' Required!", field["InEnglish"].ToString());

Label rqrLabel = new Label();

rqrLabel.Text = "*";

rqrLabel.CssClass = "requiretextboxModule";

panelModule.Controls.Add(rqrLabel);

panelModule.Controls.Add(new LiteralControl("<br/>"));

Page 55: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

55

panelModule.Controls.Add(rfvModule);

}

}

if (field["TypeControl"].ToString() == "combobox")

{

DropDownList ddlModule = new DropDownList();

SqlDataSource ddlDataSourceModule = new SqlDataSource();

ddlDataSourceModule.ID = string.Format("ddlDataSource_{0}", field["FieldName"].ToString());

ddlDataSourceModule.ConnectionString = ConnString.ToString();

ddlDataSourceModule.SelectCommand = field["SQLStringForComboBox"].ToString();

ddlModule.DataTextField = "comboboxText";

ddlModule.ID = field["FieldName"].ToString();

ddlModule.DataSourceID = string.Format("ddlDataSource_{0}", field["FieldName"].ToString());

ddlModule.DataValueField = string.Format("{0}", field["IDTableReference"].ToString());

ddlModule.CssClass = "comboboxModule";

if (Convert.ToInt32(field["Length"]) != null || Convert.ToInt32(field["Length"]) > 0)

ddlModule.Width = Convert.ToInt32(field["Length"]) * 10;

else

ddlModule.Width = 50 * 10;

panelModule.Controls.Add(ddlDataSourceModule);

panelModule.Controls.Add(ddlModule);

}

panelModule.Controls.Add(new LiteralControl("<br/>"));

SQLInsertString.Append(string.Format("{0},", field["FieldName"].ToString()));

}

pnlForm.Controls.Add(panelModule);

SQLInsertString.Remove(SQLInsertString.ToString().LastIndexOf(','), 1);

SQLInsertString.Append(") VALUES (");

}

finally

{

if (conn != null) { conn.Close(); }

}

}

}

protected void SubmitDataModule_Click(object sender, EventArgs e)

{

foreach (DataRow field in ListFields.Tables[0].Rows)

{

string t = HttpContext.Current.Request.Form[field["FieldName"].ToString()];

string textField = t.Replace("'", "''");

SQLInsertString.Append(string.Format("'{0}'", textField));

SQLInsertString.Append(',');

}

SQLInsertString.Remove(SQLInsertString.ToString().LastIndexOf(','), 1);

Page 56: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

56

SQLInsertString.Append(")");

lblResult.Text = SQLInsertString.ToString();

SqlCommand SQLIstruction = new SqlCommand(SQLInsertString.ToString(),conn);

try {

conn.Open();

SQLIstruction.ExecuteNonQuery();

}

catch (SqlException ex) {

lblResult.Text = string.Format("Impossibile inserire dati. Errore : {0}.", ex.ToString());

}

finally

{

conn.Close();

//lblResult.Text = string.Format("Inserimento avvenuto!");

}

}

protected void submitFirstForm_Click(object sender, EventArgs e)

{

Response.Redirect("Default3.aspx?page=1");

}

protected void submitSecondForm_Click(object sender, EventArgs e)

{

Response.Redirect("Default3.aspx?page=2");

}

protected void submitThirdForm_Click(object sender, EventArgs e)

{

Response.Redirect("Default3.aspx?page=3");

}

protected void submitFourthForm_Click(object sender, EventArgs e)

{

Response.Redirect("Default3.aspx?page=4");

}

protected void submitFifthForm_Click(object sender, EventArgs e)

{

Response.Redirect("Default3.aspx?page=5");

}

protected void submitSixthForm_Click(object sender, EventArgs e)

{

Response.Redirect("Default3.aspx?page=6");

}

protected void submitSeventhForm_Click(object sender, EventArgs e)

{

Response.Redirect("Default3.aspx?page=7");

}

protected void submitEighthForm_Click(object sender, EventArgs e)

{

Response.Redirect("Default3.aspx?page=8");

}

protected void submitNinthForm_Click(object sender, EventArgs e)

{

Response.Redirect("Default3.aspx?page=9");

}

}

Page 57: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

57

Ora illustriamo un po’ più nel dettaglio alcune parti per renderne il funzionamento più

chiaro.

Nella prima parte del codice

if (queryStringValue != null) {

switch (queryStringValue) {

case "1": NameOfTable = "TBL_FieldDottorando"; break;

case "2": NameOfTable = "TBL_FieldDocente"; break;

case "3": NameOfTable = "TBL_FieldDipartimento"; break;

case "4": NameOfTable = "TBL_FieldEnte"; break;

case "5": NameOfTable = "TBL_FieldMissione"; break;

case "6": NameOfTable = "TBL_FieldPosizione"; break;

case "7": NameOfTable = "TBL_FieldRuoloCollegio"; break;

case "8": NameOfTable = "TBL_FieldRuoloCS"; break;

case "9": NameOfTable = "TBL_FieldTutoraggio"; break;

default: NameOfTable = null; break;

}

if (NameOfTable != null) { SQLQueryString = string.Format("SELECT * FROM {0}", NameOfTable.ToString()); }

}

viene inizializzata la variabile NameOfTable; tale operazione permette di caricare i dati per

il form.

Successivamente inizia un ciclo foreach

foreach (DataRow field in ListFields.Tables[0].Rows)

{

if (field["TypeControl"].ToString() == "textbox" || field["TypeControl"].ToString() == "fileupload")

{

}

if (field["TypeControl"].ToString() == "combobox")

{

}

panelModule.Controls.Add(new LiteralControl("<br/>"));

SQLInsertString.Append(string.Format("{0},", field["FieldName"].ToString()));

}

che analizza il campo “TypeControl”. Se il valore presente è “textbox” viene generata una

casella di testo con relative proprietà, mentre se il valore è “combobox” viene generata una tendina

con relative proprietà. Infine viene aggiunto alla variabile SQLInsertString il campo analizzato. La

variabile SQLInsertString, al termine del ciclo, conterrà la stringa SQL per effettuare l’inserimento

dei dati in DB.

Il codice seguente viene attivato quando viene richiesto l’invio dei dati.

foreach (DataRow field in ListFields.Tables[0].Rows)

Page 58: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

58

{

string t = HttpContext.Current.Request.Form[field["FieldName"].ToString()];

string textField = t.Replace("'", "''");

SQLInsertString.Append(string.Format("'{0}'", textField));

SQLInsertString.Append(',');

}

Il ciclo foreach, effettuando una chiamata HTTPCONTEXT, preleva tutti i dati inseriti

dall’utente nei vari campi e li aggiunge alla variabile SQLInsertString.

Terminato questo ciclo non rimane altro che effettuare la connessione al DB, inviare la

chiamata SQL, ed eventualmente gestire il possibile errore con un messaggio.

SqlCommand SQLIstruction = new SqlCommand(SQLInsertString.ToString(),conn);

try {

conn.Open();

SQLIstruction.ExecuteNonQuery();

}

catch (SqlException ex) {

lblResult.Text = string.Format("Impossibile inserire dati. Errore : {0}.", ex.ToString());

}

finally

{

conn.Close();

//lblResult.Text = string.Format("Inserimento avvenuto!");

}

Page 59: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

59

5. Conclusioni

Il progetto è stato completato nei tempi previsti per la pubblicazione (del 01 Marzo 2009).

Attualmente è in fase di verifica da parte di una commissione che valuterà se le funzionalità

presenti sono adeguate o meno al tipo di scuola in questione.

Le richieste del committente sono state soddisfatte, i vari elenchi sono stati sviluppati ed

inoltre sono state realizzate delle guide per spiegare come implementarne di nuovi.

Oltre a quanto illustrato in tutti i capitoli precedenti, durante la fase di sviluppo, è stata

analizzata la possibilità di aggiungere o realizzare web part personalizzate. Purtroppo a causa di

molti fattori come:

- scarsissima presenza di documentazione, sia cartacea che su web, disponibile per

l’argomento in questione

- errori in fase di installazione a causa delle web part sviluppate

- limiti temporali di consegna

non è stato possibile raggiungere del tutto i risultati sperati.

Un altro punto di cui è stato richiesto lo studio riguarda la possibilità di sviluppare un portale

con il supporto della doppia lingua (nel caso del portale Nanotech inglese ed italiano). Dopo varie

ricerche in Internet si è giunti alla conclusione che l’unica strada è la creazione di due portali

paralleli, uno con lingua italiana e l’altro con lingua inglese.

Il futuro del portale prevede l’aggiunta di nuovi elenchi personalizzati, quali gli elenchi dei

dottori di ricerca e le pubblicazioni del collegio, oltre ad un’estensione delle funzionalità della

pagina dedicata all’inserimento dei dati.

Nel complesso mi ritengo molto soddisfatto del lavoro svolto, penso che personalmente

continuerò lo studio della tecnologia Sharepoint.

Page 60: Sviluppo Di Portali Tramite La Tecnologia Sharepoint

60

Bibliografia

Microsoft – “Windows® SharePoint® Services 3.0 - Evaluation Guide”

MSDN – http://msdn.microsoft.com/en-us/library/bb931737.aspx

MSDN - http://msdn.microsoft.com/en-us/library/ms452873.aspx

w3schools - http://www.w3schools.com/XML/xml_http.asp

Code Project - http://www.codeproject.com/KB/sharepoint/SharepointContactForm.aspx

Office Online - http://office.microsoft.com

Blog - http://www.raregrooverider.com/post/2008/01/20/Automating-the-install-of-the-

Application-Templates-for-SharePoint.aspx