Seconda parte del seminario: L’AMBIENTE WEB Tipi di oggetti in VBScript Gestione di eventi Gerararchia di Internet Explorer Model Object nel dettaglio

Gli Oggetti

L’oggetto Class (1) VbScript non è un linguaggio fortemente orientato agli oggetti; poche volte si incontra la necessità di doversi definire delle classi. Molto spesso invece si fa uso degli oggetti che VBScript fonisce e degli oggetti defini nell’Internet Explorer Model Object. Nonostante ciò viene messo a disposizione uno statemant per la definizione di Classi: Class Name Statements End Class Dove Name è il nome della classe e Statements è uno o più Statement che definiscono le variabili, le proprietà e i metodi della classe. In particolare questi ultimi due sono così definiti: una procedura (sub o Function) dichiarata public dentro una classe è un metodo, mentre una variabile dichiarata public dentro una classe è una proprietà. In particolare le Proprietà possono essere create anche attraverso gli statemant Proprety Let() e Proprety Set

L’oggetto Class (2) Proprety Let () Proprety Set () Permette di definire il nome, i parametri e il codice che formano il corpo di una Poprietà. Chiaramente dovrà essere inserito all’interno di una Class Proprety Let name ([arglist] value) [statemets] End Proprety Proprety Set () Permette di definire il nome, i parametri e il codice che formano il corpo di una Proprietà che imposta un riferimento ad un oggetto. Proprety Let name ([arglist] reference)

L’oggetto Class (3) Per creare una istanza di una classe creata con Class: Dim X Set X = New ClassNanme L’oggetto Class ha due eventi: Initialize Viene scatenato quando viene creata una nuova istanza di una classe definita: Private Sub Classname_Initialize() Statemants End Sub Terminate Viene scatenato quando viene terminata una istanza di una classe definita: Private Sub Classname_Terminate()

Altri Oggetti VBScript permette di alti oggetti oltre a Class: - Oggetti forniti da VBScript Dictionary Err FileSystem Mach Matches Collection RegExp - Internet Model Object

Eventi

Eventi (1) Gli eventi sono “segnali” che vengono scatenati in seguito ad una particolare azione da parte dell’utente. Ad esempio la pressione di un tasto provoca un evento. Gli eventi sono associati agli oggetti ed in particolare sono scatenati da operazioni che vengono fatti su questo oggetti (ad esempio il Click del Mouse su di un Button) L’evento viene identificato dal nome dell’azione con l’aggiunta di On: se l’azione è Click l’evento associato è OnClick VbScript permette di “catturare” questi eventi e poterli gestire Una volta “catturato” l’evento possiamo associargli delle azioni che noi vogliamo che vengano eseguite. Per cui possiamo fare in modo che un pezzo di codice venga eseguito nel momento in cui viene scatenato l’evento (ad esempio apro un Messaggio alla pressione di un tasto)

Eventi (1) Questo viene fatto definendo una Sub che ha per nome il nome dell’oggetto su cui verrà scatenato l’evento, seguito dall’evento: <INPUT Type=“Button” Name=“Bt1” Value=“Click”> <SCRIPT Language=“VBS”> Sub Bt1_OnClick() MsgBOx “Hai premuto il tasto” End Sub </SCRIPT> Nel caso in cui trattiamo oggetti ai quali non possiamo associare un nome specifico, possiamo indicare il nome della Classe: Sub document_Onfocus() In questo caso non si crea anbiguità perché non possono essere aperti più oggetti ducument contemporaneamente.

Eventi - Elenco (1) OnAbort OnBlur OnChange OnClick OnDblClick Viene scatenato quando l’utente interrompe il caricamento di una image (ad esempio premendo un click) OnBlur Viene scatenato quando l’oggetto perde il focus, quindi non è più selezionato. OnChange Viene scatenato quando l’utente modifica il valore di un oggetto (ad esempio modifica il contenuto di una Text) OnClick Viene scatenato quando l’utente fa il click del mouse sull’oggetto OnDblClick Viene scatenato quando l’utente fa il dobbio click del mouse sul’oggetto OnDragDrop Viene scatenato quando un utente trascina un oggetto all’interno di una finestra del Browser.

Eventi Elenco (2) OnError OnFocus OnKeyDown OnKeyUp OnKeyPress OnLoad Viene scatenato quando il caricamento di una immagina o di una finestra provoca un errore OnFocus Viene scatenato quando un oggetto viene selezionato, riceve il focus OnKeyDown Viene scatenato nel momento in cui l’utente preme un tasto OnKeyUp Viene scatenato quando l’utente rilascia un tasto OnKeyPress Viene scatenato quando l’utente preme un tasto o lo tiene premuto OnLoad Viene scatenato al termine del caricamento di un immagine o di un documento

Eventi Elenco (3) OnMouseDown OnMouseUp OnMouseOut OnMouseOver OnMove Viene scatenato quando viene premuto un pulsante del mouse OnMouseUp Viene scatenato quando viene rilasciato un pulsante del mouse OnMouseOut Viene scatenato quando il puntatore del mouse viene spostato fuori dall’area di un oggetto OnMouseOver Viene scatenato quando il puntatore del muose viene fatto entrare nell’area di un oggetto OnMove Viene scatenato quando viene mossa una finestra OnReset Viene scatenato quando l’utente fa il reset di una form (premendo un tasto Reset)

Eventi Elenco (4) OnResize OnSelect OnSubmit OnUnload Viene scatenato quando viene ridimensionata la finestra OnSelect Viene selezionato quando l’utente seleziona un parte di testo all’interno di una form contenente caselle di Testo OnSubmit Viene scatenato quando l’utente preme un tasto di tipo Submit. In genere viene utilizzato per controllare i campi della form prima di inviare i dati al Server. OnUnload Viene scatenato quando l’utente esca da un documento, ad esempio caricandone o selezionandone un altro.

Internet Explorer Model Object

Model Object - Gerarchia

Window - Proprietà Name Parent Self Top Status Indica il nome della finestra ed è una proprietà read-only. Parent Ritorna l’oggetto finestra padre di quella attualmente aperta. Essendo un oggetto finestra si possono usare tutti i metodi e le proprietà di Window: MsgBox Parent.name Self Ritorna l’oggetto finestra corrente Top Ritorna l’oggetto finestra radice Status Fornisce o permette di impostare il testo visualizzato nella barra di stato: MsgBox Window.status Window.status=Now

Window - Metodi (1) DefautStatus Alert Confirm Prompt Navigate Permette di impostare il testo di default per la barra di stato Alert Visualizza un Alert Box Windows.alert (“Testo”) Confirm Visualizza un Confirm Box con i pulsanti Ok e Cancel. Ritorna TRUE se viene premuto il tasto Ok e FALSE se viene premuto il tasto Cancel. Conferma=Window.confirm(“Testo”) Prompt Definisce un prompt per l’inserimento dei dati. E’ molto simile alla InputBox. Restituisce la stringa inserita dall’utente. Dati=Window.Prompt(“Prompt”,”Testo di risposta”) Navigate Permette di collegarsi all’URL indicato: Window.navigate “http://www.caristudenti.cs.unibo.it”

Window - Metodi (2) SetTimeout ClearTimeout Blur, Focus Frame Definisce un Timer che permette di invocare una funzione dopo uno specifico lasso di tempo: ID =window.seTimeout expresion,time,language ID indica l’identificatore del Timer, expression e’ la funzione da chiamare, time il numero di millesecondi di attesa, language identifica il linguaggio di Script della funzione ClearTimeout Elimina un particoolare Timer: window.clearTimeout ID Blur, Focus Aggiungono e tolgono il focus alla finestra Frame Indica i frame contenuti nella finestra. Ritorna un array di oggetti che sono i frame nella finestra. Per indicare un frame paicolare: frames(0). La proprietà Length dell’oggetto Frame indica quanti frame ci sono in una finestra: numframe= window.frame.length

Window - Metodi (3) Open Close Permette di aprire una finestra, se esiste, oppure di crearne una nuova: NewName=window.open Url, target target è il nome della finestra in cui aprire il documento, nel caso non esiste ne crea una nuova con nome NewName. Il metodo Open ha molti altri parametri di tipo per definire l’aspetto della nuova finestra: Toolbar, Directoris, Status, Menubar - per aggiungere o togliere la presenza delle omonime barre - sono di tipo Bool (yes/no) Resizeable - per creare o meno una finestra ridimensionabil è di tipo Bool(yes/no) Width, Height - definiscono la grandezza della pagina Top, Left - definiscono la posizione della pagina Close Chiude una finestra aperta: NewName.close - Chiude la finestra di nome NewName Window.close - Chiude la finestra corrente

Window - Eventi onBlur onDragDrop onError onFocus onMove onResize onLoad onUnload

Frame Come già visto Frame e’ una proprietà di Windows; ogni Window puo’ contenere più frame. Vbscript vede Frame a sua volta come oggetto Window, per cui le proprietà, i metodi e gli eventi sono quelli di Window.

History E’ un oggetto che identifica la cronologia e fornisce proprietà e metodi per navigare all’interno della cronologia

History - Proprietà e metodi PROPRIETA’ Length Restituisce il numero di valori presenti nell’History METODI Back n Torna indietro di n passi nell’history Forward n Avanza di n passi nell’history Go n Va all’n-sima pagina dell’history. Se n è un numero positivo si muove di n passi in avanti, se n è negativo si muove di n passi indietro

Fornisce delle informazioni sulla URL del documento corrente. Location Fornisce delle informazioni sulla URL del documento corrente.

Location - Proprietà (1) Href Fornisce o permette di impostare la URL: MsgBox document.location.href document.location.href=“http://caristudenti.cs.unibo.it” Protocol Fornisce o permette di impostare il protocollo dell’URL - Http, Ftp Host Fornisce o permette di impostare l’Host e la porta dell’URL Hostname Fornisce o permette di impostare l’Host dell’URL, anche in indirizzo IP - www.helloworld.com Port Fornisce o permette di impostare la porta dell’URL - 80

Location - Proprietà (2) Hash Restituisce o permette di impostare una porzione Hash della URL: #paragrafo Pathname Fornisce o permette di impostare il pathname dell’URL. Utile quando ci si vuole riferire direttamente ad uno specifico documento /home/project/ium/curry/seminario

Location - Metodi Reload Replace Ricarica la pagina corrente Carica la pagina passata per parametro. Nell’History viene cancellato il riferimento alla pagina da cui è stato lanciato location.replace e viene aggiunto quello ala pagina caricata. In questo modo non è più possibile, attraverso il tasto Back del Browser, ritornare alla pagina “chiamante” location.replace(“newpage.html”)

Document Per oggetto document si intende il documento HTML visualizzato nella finestra, o nel caso di presenza di Frame il documento HTML contenuto nel Frame.

Document - Proprietà (1) Linkcolor, Alinkcolor, Vlinkcolor Fornisce o permettono di impostare il colore rispettivamente dei link, dei link attivi e dei link visitati presenti nel documento. Color=document.linkcolor document.linkcolor=yellow Bgcolor Fornisce o permette di impostare il colore di background del documento Fgcolor Fornisce o permette di impostare il colore di foreground del documento LastModify Ritorna la data di ultima modifica del documento Title Fornisce il titolo del documento. E’ una proprietà read-only, quindi non permette di modificare il titolo del documento a Run-time Referrer Fornisce la URL del documento

Document - Proprietà (2) Cookie Permette di scrivere o leggere un cookie sul Client: document.cookie= Varme &”=“ & VarVal &”;” Anchor Indica gli oggetti “ancora” contenuti nel documento. Ritorna un array di Oggetti ancora che sono quelli nel documento. Per accedere ad una specific ancora : anchors(i). La proprietà Length dell’oggetto Anchor indica quante ancore sono presenti in un documento, quanti elementi ci sono nell’array numanchor=document.anchor.length Link Simile ad Anchor, ritorna un array di oggetti che contiene gli oggetti Link contenuti nel documento. Le altre considerazioni sono uguali quelle di Anchor Applet, Image, Plugin, Layers Come i precedenti, rispettivamente per gli Applet, le Immagini, i Plugin e i Layer

Document - Proprietà (3) Form Indica le form contenuti nel documento. Ritorna un array di Oggetti form che sono quelli nel documento. Per accedere ad una specifica form : forms(i) La proprietà Length dell’oggetto Form indica quanti elementi sono presenti nell’array e quindi queanti oggetti form sono contenuti nel Documento Le proprietà e i metodi dell’oggetto form verrano trattati meglio in seguio

Document - Metodi(1) Open Write Writeln Close Clear Apre un nuovo documento, quindi cancella il documento corrente creando un documento vuoto. Write Permette di scrivere una stringa su di un documento aperto. La stringa verrà visualizzata sul documento corrente solo dopo che questo viene chiuso. Writeln Come Write, ma va a capo dopo aver scritto Close Chiude un documento e visualizza le stringhe scritte con Write e Writeln Clear Cancella il contenuto del documento E’ interessante vedere che passando come parametri alla write dei TAG HTML l’interprete VBScript li riconosce e visualizza il risultato del documento HMTL e non i TAG. In questo modo si può pensare di costruire pagine in base a ciò che fa l’utente.

Document - Eventi OnClick OnDblClick OnKeyDown OnKeyPress OnKeyUp OnMouseDown OnMouseUp

Link Indica un Link presente in un documento. Tutti i Link di un documento sono contenuti in un Array di Oggetti Links. Per accedere ad un oggetto Link: Links(i). Il primo Link nell’Array ha indice 0.

Link - Proprietà ed Eventi PROPRIETA’-METODI Le proprietà e i metodi di Link sono gli stessi già discussi per l’oggetto Location, riferiti al Link e non all’URL corrente. Esiste una proprietà in più: Target Iidentifica il nome della pagina o del Frame destinaione del Link EVENTI OnClick OnKeyDown OnKeyUp OnKeyPress OnMouseDown OnMouseUp OnMouseOut OnMouseOver

Form Indica le Form presenti del Documento. Tutte le Form del documento sono contenute in un Array di Oggetti Forms. Per accedere ad ogni Form: Forms(i) L’oggetto Form possiede i seguenti oggetti:

Form - Proprietà (1) Name Action Encoding Method Target Length Restituisce il nome della form Action Restituisce una stinga contenente la form action che è l’URL dello script CGI invocato dalla Form Encoding Restitusce o permette di impostare il formato dei dati inviati al Server: TAG ENCTYPE di HTML Method Restituisce o permette di impostare il metodo per inviare i dati al Server: GET o POST Target Restituisce o permette di impostare la pagina di destinazione in cui verrà visualizzato il risultato dell’elaborazione Length Restituisce il numero di form presenti nel documento, quindi il numero di elementi nell’array forms

Form - Proprietà (2) Elements Indica gli eoggetti associati ad una form. Tutti gli element sono contenuti in un array Elements composto da oggetti Element. Essendo un oggetto Element ha alcune proprietà che sono quelle comuni a tutti gli oggetti appartenentia d una form più quelle specifiche per ogni oggetto in base al tipo: <Form name="Pippo"> <input type="button" name="pippo1" value="Click"> <select name="Max"> <Option value="1"> Scelta 1</Option> <Option value="4"> Scelta 2</Option> </select> </Form> L’istruzione Msgbox document.forms(0).elements(2).size restituisce 2 mentre Msgbox document.forms(0).elements(1).size restituisce errore perché size è un proprietà specifica dell’oggetto di tipo select. Sia le proprietà

Form - Metodi ed Eventi METODI EVENTI Reset Submit OnReset OnSubmit Esegue il Reset dei campi della Form Submit Fa il submit dei campi della form. Il metodo può essere specificato attraverso la proprietà form EVENTI OnReset OnSubmit

Oggetti della Form Proprietà e metodi Comuni PROPRIETA’ Form Restituisce il nome della form appartenenza Type Restituisce il tipo dell’oggetto Name Resitisce o permette di impostare il nome dell’oggetto Value Restituisce o permette di impostare il campo Value dell’oggetto METODI Blur, Focus Aggiungono e tolgono il focus alla finestra

Oggetti della Form Eventi Comuni Notare che negli eventi dei seguenti oggetti verranno messi solo quelli di particolare interesse per quell’oggetto. Vi sono infatti eventi che valgono per tutte gli oggetti visibili appartenenti alle From. Questi sono: OnBlur OnFocus OnClick OnDblClick OnKeyPress OnKeyDown OnKeyUp OnMouseDown OnMouseUp OnMouseOut OnMOouseOver Quindi questi eventi sono da considerare comuni a tutti gli oggetti appartenenti a Form

Image METODI OnAbort OnError

Button - Reset - Submit PROPRIETA’ EVENTI Enabled Restituisce o permete di impostare se un tasto è abilitato (valore di ritorno 1) o disabilitato (valore di ritorno 0) EVENTI OnClick OnKeyDown OnKeyUp OnKeyPress OnMouseDown OnMouseUp

CheckBox e Radio Button (1) PROPRIETA’ Checked. Restituisce o permette di impostare il valore si selezione del Checkbox newcheck.checked=TRUE MsgBox newcheck.checked DefalutChecked Restituisce il valore di default del Checkbox Enabled Restituisce o permete di impostare se un tasto è abilitato (valore di ritorno 1) o disabilitato (valore di ritorno 0)

CheckBox e Radio Button (1) METODI Click Permette di selezionare il la casella di CheckBox o il Radio Button, come se fosse stato fatto un Click sulla casella EVENTI OnClick E’ da notare che nel caso in cui due oggetti abbiano lo stesso nome, come si usa spesso con i Radio Button, le proprietà, i metodi e gli eventi non funzionano più, perché non esiste univocità nella identificazione degli oggetti.

Hidden L’oggetto Hidden essendo molto elementare e non visibile all’utente e’ privo di Metodi e di Eventi, per cui non valgono nemmeno quelli introdotti come comuni a tutti gli oggetti della Form. Per le proprietà invece valgono quelle presentate come comuni a tutti gli oggetti della Form, quindi Form, Type, Name e Value

Text - PassWord PROPRIETA’ Enabled Value METODI EVENTI Restituisce o permete di impostare se una casella di testo è abilitata (valore di ritorno 1) o disabilitata (valore di ritorno 0) Value In questo caso per Value si intende il valore contenuto nella casella di Testo, per cui definire un valore per la visualizzazione comporta che all’apertura del documento nell’area di Testo ci sarà già una stringa. METODI Select Seleziona il testo contenuto nella casella di Testo EVENTI OnChange OnSelect

TextArea PROPRIETA’ Cols, Row Enabled METODI EVENTI Restituisce e permette di impostare il numero di colonne e il numero di righe della TextArea Enabled Restituisce o permete di impostare se una TextArea è abilitata (valore di ritorno 1) o disabilitata (valore di ritorno 0) METODI Select Seleziona il testo contenuto nella casella di Testo EVENTI OnChange OnSelect

Select PROPRIETA’ EVENTI OnChange Option SelectedIndex Size Indica le Option presenti del Documento. Tutte le Option del documento sono contenute in un Array di Oggetti Options. Per accedere ad ogni Option: Options(i). Per vedere il numero di oggetti nell’array, quindi il numero di Opzioini nella select: nameselect.options.lenght Gli oggetti di tipo option hanno le proprietà comuni viste prima. SelectedIndex Restituisce o permette di impostare l’indice dell’opzione selezionata. Size Restituisce o permette di impostare il numero di opzioni visualizzate contemporaneamente. EVENTI OnChange

Navigator (1) E’ un oggetto non visibile all’utente e restituisce informazioni sul Browser usato per la Navigazione. Nevigation ha solo proprietà Read-Only: AppCodeName Restituisce il codice dell’applicazione (IE 3.0 Ritorna Mozilla) AppName Restituisce il nome dell’applicazione AppVersion Restituisce la versione dell’Applicazione UserAgent Restituisce lo User Agent dell’Applicazione Platform Restituisce la piattaforma sulla quale l’applicazione viene eseguita - Win99 Cookieenabled Restituisce TRUE se sono abilitati i cookie, altrimenti FALSE

Navigator (2) CpuClass Systemlanguage Userlanguage Online Restituisce la classe della CPU - x86 Systemlanguage Restituisce la lingua impostata nel sistema Userlanguage Restituisce la lingua usata dall’utente Online Restituisce TRUE se l’utente sta lavorando On-Line, altrimenti FALSE

Bibliografia Libri Documentazione on-line Brophy, Koets, Teach Youself VBScript in 21 days Johnson, VBScript Unleashed Lomax, Cadenhead, ActiveX and VBScript Documentazione on-line msdn.microsoft.com/?