Applicazione relativa al Web-IO digitale:
Web-IO digitale - visualizzazione nel browser con JavaScript e Java-Applet
Il browser Internet fa parte oggi di tutti i moderni sistemi operativi e nella navigazione in Internet il browser viene apprezzato come strumento di visualizzazione versatile.
In combinazione con i Web-IO W&T il browser ora può essere utilizzato anche come elemento di visualizzazione e controllo per applicazioni tecniche dinamiche.
Il motore della componente dinamica è in questo caso una Java-Applet che viene caricata semplicemente dal Web-IO nel browser e che qui esegue lo scambio dei dati di processo con il Web-IO. Semplici routine JavaScript accettano, in caso di modifiche, lo stato corrente degli IO dalla Java-Applet e adattano la visualizzazione nel browser alle condizioni sul campo.
L’applicazione descritta di seguito mostra ad esempio l’interazione di browser, Java-Applet e Web-IO.
Nessun problema: vi mettiamo a disposizione gratuitamente per 30 giorni il Web-IO digitale 2x input, 2x output PoE. Non dovete far altro che compilare l’ordinazione del campione e vi forniremo il Web-IO in prova in conto aperto. Se ci restituite l’apparecchio entro 30 giorni, vi riaccreditiamo l’intero importo della fattura.
All’ordinazione del campionePreparativi
- alimentato con corrente
- collegate gli ingressi e le uscite
- effettuato il collegamento alla vostra rete
- assegnato un indirizzo IP: con WuTility è facile!
Collocazione dei diversi elementi di comando e oggetti di visualizzazione nella pagina web
Nella denominazione dei singoli oggetti o delle funzioni da richiamare è utile utilizzare nomi che ne riprendono il significato.
1. Struttura di base HTML della pagina web
Collocazione degli elementi di comando e visualizzazionePer una migliore strutturazione i singoli elementi vengono sistemati in tabelle e il tutto indicato come modulo. Il tag <user.htm> non appartiene alla sintassi HTML standard e serve al Web-IO per l’identificazione della pagina web. Il tag viene filtrato nel browser prima dell’upload.
<user.htm>
<html>
<head>
<title>Web-IO mit Java-Aplett</title>
<meta http-equiv="Content-Type"content="text/html; charset=iso-8859-1">
<STYLE type=text/css>
TD {COLOR: #000000; FONT-FAMILY:Verdana,Arial,Helvetica; FONT-SIZE: 10pt; }
</STYLE>
</head>
<body bgcolor="#FFFFFF">
<form name="ioform">
<table width="500" border="1" height="144" bgcolor="#CCCCCC">
<tr>
<td>
<table width="500">
<tr>
<td colspan="5">
<b>Input/Output Control </b>
</td>
</tr>
<tr>
<td width="100">
<input type="checkbox" name="cb_output" onclick="setOutput(0)"> Output 0
</td>
<td width="100">
<input type="checkbox" name="cb_input"> Input 0
</td>
<td width="100">
<div align="right">Counter 0 </div>
</td>
<td width="*" bgcolor="#FFFFFF" id="counter0">
</td>
<td width="55">
<input type="button" value="Clear" onclick="clearCounter(0)">
</td>
</tr>
<tr>
<td width="100">
<input type="checkbox" name="cb_output" onclick="setOutput(1)"> Output 1
</td>
<td width="100">
<input type="checkbox" name="cb_input"> Input 1
</td>
<td width="100">
<div align="right">Counter 1 </div>
</td>
<td width="*" bgcolor="#FFFFFF" id="counter1">
</td>
<td width="55">
<input type="button" value="Clear" onclick="clearCounter(1)">
</td>
</tr>
<tr>
<td width="100" height="29">
</td>
<td width="100" height="29">
</td>
<td width="100" height="29">
<div align="right">Counter all </div>
</td>
<td width="*" height="29">
</td>
<td width="55" height="29">
<input type="button" value="Clear" onclick="clearCounter()">
</td>
</tr>
</table>
</td>
</tr>
</table>
<table width="500" border="1" bgcolor="#CCCCCC" >
<tr>
<td height="35">
<table width="500">
<tr>
<td width="77">Password
</td>
<td width="141">
<input type="text" name="ed_password">
</td>
<td width="266">
<div align="right">
<input type="button" value="Send" onclick="setPassword()">
</div>
</td>
</tr>
</table>
</td>
</tr>
</table>
</form>
.....
2. Integrazione di Java-Applet nella pagina web
Il tag <applet> e la trasmissione dei parametri
Durante l’integrazione di Java-Applet deve essere indicato all’interno del tag <applet> il nome attraverso il quale l’Applet deve essere attivata all’interno della pagina web. Inoltre si deve indicare quale Applet deve essere caricata. Tutte le volte che l’Applet non deve essere caricata dallo stesso server della pagina web, deve essere inoltre indicato mediante codebase l’indirizzo del server. Se la pagina web e l’Applet vengono caricate dallo stesso server, questo parametro può essere tralasciato.
Tra i due tag <applet> vengono trasmessi parametri che riguardano e controllano la comunicazione con il Web-IO.
.......
<applet name="dio" archive="dio.jar" code="dio.class" codebase="http://10.40.22.21" width="0" height="0" mayscript>
<param name="device" value="0">
<param name="showerrors" value="off">
<param name="inputpolling" value="on">
<param name="outputpolling" value="on">
<param name="counterpolling" value="on">
<param name="pollingrate" value="200">
</applet>
.......
3. Elaborazione dell’utilizzo da parte dell’utente
In base all’elemento di comando della pagina web su cui l’utente ha fatto clic o che ha modificato, vengono richiamate determinate funzioni JavaScript. Le funzioni JavaScript richiamano a loro volta routine di Java-Applet e trasmettono parametri eventualmente necessari.
- Trasmissione della password
Questa funzione è necessaria soltanto se per l’accesso al Web-IO è stata assegnata una password.
function setPassword() { document.applets["dio"].setPassword( ioform.ed_password.value); ioform.ed_password.value = ’’; }
- Impostazione degli output
L’impostazione degli output è resa possibile all’utente da due caselle di spunta cb_output. Al richiamo della funzione viene fornito il n. dell’output.
<script language="JavaScript" type="text/javascript"> <!-- function setOutput(OutputNr) { var Out = 0; Out |= Math.pow( 2, OutputNr ); if (ioform.cb_output[OutputNr].checked==true) { document.applets["dio"].outputAccess( Out,Out ); } else { document.applets["dio"].outputAccess( Out,0 ); } }
- Cancellazione dei counter
È possibile cancellare gli stati dei counter degli input. Come parametro viene trasmesso il n. del counter che deve essere letto o cancellato. Se non viene trasmesso alcun parametro, il Web-IO cancella tutti i counter.
function clearCounter(CounterNr) { if (CounterNr==undefined) { document.applets["dio"].counterClear(0xf); } else { var Counters = 0; Counters |= Math.pow( 2, CounterNr ); document.applets["dio"].counterClear( Counters); } }
4. Aggiornamento degli stati degli IO e degli stati dei counter
Il monitoraggio degli input, output e counter da parte del Web-IO è eseguito da Java-Applet. Se viene riconosciuta una modifica, l’Applet richiama una corrispondente funzione JavaScript all’interno della pagina web.
- Modifica degli output
Se viene riconosciuta una modifica, viene richiamata la seguente funzione. Viene trasmesso da quale Web-IO è stata segnalata la modifica, su quale output si è verificata la modifica e in quale stato si trova attualmente l’output.
function outputChanged( Device, OutputNr, OutputVal ) { ioform.cb_output[OutputNr].checked=OutputVal; }
- Modifica degli input
Se viene riconosciuta una modifica, viene richiamata la seguente funzione. Viene trasmesso da quale Web-IO è stata segnalata la modifica, su quale input si è verificata la modifica e in quale stato si trova attualmente l’input.
function inputChanged( Device, InputNr, InputVal) { ioform.cb_input[InputNr].checked=InputVal; }
- Modifica dei counter
Se viene riconosciuta una modifica, viene richiamata la seguente funzione. Viene trasmesso da quale Web-IO è stata segnalata la modifica, su quale counter si è verificata la modifica e qual è attualmente lo stato del contatore.
function counterChanged( Device, CounterNr, CounterVal ) { document.getElementById(’counter’+CounterNr).innerHTML = ’<a>’+CounterVal+’<\/a>’; } //--> </script> </body> </html>
Per poter lavorare con l’esempio illustrato il browser deve permettere il funzionamento con Java-Applet. Se manca il supporto Java, è possibile scaricare gratuitamente all’indirizzo www.java.com i plug-in necessari.
L’esempio supporta tutte le funzioni comuni del Web-IO, ottimizzato per il Web-IO 2x Digital Input, 2x Digital Output PoE. Per gli altri modelli di Web-IO devono essere eventualmente apportati adattamenti alla pagina web esempio. Ulteriori esempi di programma per la programmazione socket sono riportati nelle pagine dei tool relative al Web-IO. Una descrizione dettagliata relativa ai comandi dei modelli Web-IO digitali è riportata nel manuale di riferimento.
Nessun problema: vi mettiamo a disposizione gratuitamente per 30 giorni il Web-IO digitale 2x input, 2x output. Non dovete far altro che compilare l’ordinazione del campione e vi forniremo il Web-IO in prova in conto aperto. Se ci restituite l’apparecchio entro 30 giorni, vi accreditiamo completamente la fattura.
All’ordinazione del campione