// Obraz1
// 3 zbiorniki + 3 zawory + stan pompy
// demonstracja kontrolek do pobierania danych z PLC
======================================
<HTML><HEAD> // HTML - przepisać
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250"> // jw.
<script type="text/javascript" src="/applets/cp343.js" language="JavaScript1.5"></script> // jw.
<style type="text/css"> <!-- // jw.
@import url("main.css"); // jw.
--> </style> // jw.
<TITLE>Demo wizualizacji dla modułu SIEMENS CP343-1</TITLE> // do ew. korekty, dowolny nagłówek
</HEAD> // jw.
<BODY BGCOLOR="#FFFFFF"> // jw.
<center> // jw.
<script type="text/javascript" language="JavaScript1.5"> // jw.
var Obraz1 = new Obraz(700,410,"","img/wizualizacja.png") // wywołanie klasy Obraz
var Obraz1 = new Obraz(700 // rozmiar X
,410, // rozmiar Y
"", // typ linii + kolor (style CSS, np. „1px solid red”)
"img/wizualizacja.png") // gragika która będzie stanowić tło
Obraz1.zwloka_komunikacji = 500 // własność klasy, co ile z kolejki podstawiana jest nowa kontrolka do apletu Get
Obraz1.ip = "82.115.86.93:80" // własność klasy, IP CP : nr portu, domyślnie jest to port 80
//===================
// Kontrolki dla zbiornika 1
//==============
// Kontrolka, pasek prostokątny, który zmienia wypełnienie (tu: bargraf w zbiorniku)
// Wywołanie nowej instancji kontrolki KPoziomZB z klasy Obraz,
// wypełnienie podajemy w zakresie 0…100%
var zbiornik1 = new Obraz1.KPoziomZb("zbiornik1", // nazwa nowej instancji kontrolki
"blue", // kolor wypełnienia (kolory wg stylów CSS)
0, // wartość początkowa wypełnienia
1) // mnożnik do skalowania wypełnienia
zbiornik1.ustaw_pozycje(100,70,46,100) // lokalizacja (x,y) na ekranie, szerokość + wysokość grafiki
//zbiornik1.ustaw_any_pointer(new Obraz1.AnyPointer("BYTE",1,"M",0,0,0)) // parametryzacja adresu bezwzględnego
// Składnia wskaźnika ANY : (VarType, VarCNT, VarArea, VarSubarea, Offset, VarBitOffset)
// Vartype : BYTE, BOOL, WORD
// VarCNT : w naszym przypadku zawsze „1” i inne wg [1]
// VarArea : I, Q, M, DB
// VarSubarea : obszary w Vararea, nr bazy DB
// Offset : przesunięcie od zera, np. dla DB5.DBB10 wartość =„10”
// VarBitOffset : w przypadku adresacji bitu: przesunięcie bitu w bajcie
zbiornik1.ustaw_symbol("PoziomZ1(0/2)") // adres symboliczny zmiennej w PLC
Obraz1.dodaj_kontrolke(zbiornik1) // dodanie kontrolki do kolejki apletu Get
// Kontrolka, pole wyświetlające wartość analogową z opisami (tu: pole liczbowe z poziomem )
// Wywołanie nowej instancji kontrolki KDisplayAn z klasy Obraz
var zbiornik_wartosc1 = new Obraz1.KDisplayAn("zbiornik_wartosc1", // nazwa nowej instancji kontrolki
"1px solid red", // typ linii (style CSS)
"white", // kolor tła
"center", // wyśrodkowanie - Left, Right, center
"9px", // wielkość czcionki
"- - -", // wartość początkowa
"<b>Poziom Z1<br>", // napis przed wartością
"[%]", // Jednostka po wartości
1) // mnożnik (jw.)
zbiornik_wartosc1.ustaw_pozycje(50,100,50,40) // jw.
//zbiornik_wartosc1.ustaw_any_pointer(new Obraz1.AnyPointer("BYTE",1,"M",0,0,0)) // jw.
zbiornik_wartosc1.ustaw_symbol("PoziomZ1(0/2)") // jw.
Obraz1.dodaj_kontrolke(zbiornik_wartosc1) // jw.
// Kontrolka, pobiera wartość zmiennej cyfrowej, na podstawie wartości wyświetla jedną z dwóch grafik
// (tu: animacja zaworu pod zbiornikiem)
var zawor1 = new Obraz1.KCzytajBitGr("zawor1", // nazwa nowej instancji kontrolki
"img/zawor_c.png", // grafika dla stanu False
"img/zawor_z.png", // grafika dla stanu True
0) // wartość początkowa dla kontrolki
zawor1.ustaw_pozycje(81,239) // lokalizacja (x,y) na ekranie
zawor1.ustaw_any_pointer(new Obraz1.AnyPointer("BOOL",1,"DB",5,60,0)) // jw.
Obraz1.dodaj_kontrolke(zawor1) // jw.
// Kontrolka, pobiera wartość zmiennej cyfrowej, na jej podstawie wyświetla pierwszy lub drugi ciąg znaków
// (tu: opis tekstowy stanu zaworu)
var zawor_wartosc1 = new Obraz1.KCzytajBitTx("zawor_wartosc1", // nazwa nowej instancji kontrolki
"1px solid red", "white", "center", "9px", // parametry ramki, tła, czcionki, wyrównanie (jw.)
"<b>Zamknięty", "<b>Otwarty", // tekst dla wartości False/True
0) // wartość początkowa dla kontrolki
zawor_wartosc1.ustaw_pozycje(130,239,60,40) // jw.
zawor_wartosc1.ustaw_any_pointer(new Obraz1.AnyPointer("BOOL",1,"DB",5,60,0)) // jw.
Obraz1.dodaj_kontrolke(zawor_wartosc1) // jw.
//=======================
//Taki sam zwstaw kontrolek dla zb 2 i 3
//=======================
// Kontrolka, w określonym miejscu na ekranie wyświetla grafikę
// nie posiada odwołania do zmiennych PLC
// (tu: pozycjonowanie grafiki pompy 2)
var statyczna = new Obraz1.KWstawGr("img/pompa_b.png") // wywołanie nowej instancji kontrolki +
// wskazanie lokalizacji grafiki do pobrania
statyczna.ustaw_pozycje(588,304) // docelowa pozycja grafiki
Obraz1.dodaj_kontrolke(statyczna) // aktywacja instancji
Obraz1.uruchom() // Instancja klasy obraz została zparametryzowana
// tutaj następuje jej uruchomienie
</script> // HTML - przepisać
</center> // jw.
</BODY> // jw.
</HTML>
// Obraz2
// ustawienie wartości zmiennej analogowej oraz cyfrowej
// demonstracja kontrolek do zapisywania, ustawiania zmiennych w PLC
======================================
<HTML><HEAD> // HTML - przepisać
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250"> // jw.
<script type="text/javascript" src="/applets/cp343.js" language="JavaScript1.5"></script> // jw.
<style type="text/css"> <!-- // jw.
@import url("main.css"); // jw.
--> </style> // jw.
<TITLE>Demo wizualizacji dla modułu SIEMENS CP343-1</TITLE> // jw.
</HEAD> // jw.
<BODY BGCOLOR="#FFFFFF"> // jw.
<center> // jw.
<script type="text/javascript" language="JavaScript1.5"> // jw.
var Obraz2 = new Obraz(700,410,"1px solid red","") // jw.
Obraz2.zwloka_komunikacji = 500 // jw.
Obraz2.ip = "82.115.86.93:80" // jw.
var pompa = new Obraz2.KCzytajBitGr("pompa", "img/pompa_b.png", "img/pompa_z.png",0) // jw.
pompa.ustaw_pozycje(500,150) // jw.
//pompa.ustaw_any_pointer(new Obraz2.AnyPointer("BOOL",1,"DB",5,22,1)) // jw.
pompa.ustaw_symbol("ZapisBit(0/2)") // jw.
Obraz2.dodaj_kontrolke(pompa) // jw.
var pompa_wartosc = new Obraz2.KCzytajBitTx("pompa_wartosc", "1px solid red",
"white", "center", "10px", "<b>Nie pracuje",
"<b>Pracuje", 0) // jw.
pompa_wartosc.ustaw_pozycje(500,230,70,20) // jw.
//pompa_wartosc.ustaw_any_pointer(new Obraz2.AnyPointer("BOOL",1,"DB",5,22,1)) // jw.
pompa_wartosc.ustaw_symbol("ZapisBit(0/2)") // jw.
Obraz2.dodaj_kontrolke(pompa_wartosc) // jw.
// Kontrolka, ustawienie zmiennej cyfrowej (bit) w PLC
// Wizualna reprezentacja : animowany przycisk
var pompa_on = new Obraz2.KUstawBit("Włącz", "true") // Opis na przycisku, stan który ma zostać ustawiona
pompa_on.ustaw_pozycje(430,120, 100,20) // lokalizacja, wielkośc przycisku
//pompa_on.ustaw_any_pointer(new Obraz2.AnyPointer("BOOL",1,"DB",5,22,1)) // zmienna w PLC, adres bzwzględny
pompa_on.ustaw_symbol("ZapisBit(0/2)") // adres symboliczny
Obraz2.dodaj_kontrolke(pompa_on) // jw.
var pompa_off = new Obraz2.KUstawBit("Wyłącz", "false") // jw.
pompa_off.ustaw_pozycje(540,120, 100,20) // jw.
//pompa_off.ustaw_any_pointer(new Obraz2.AnyPointer("BOOL",1,"DB",5,22,1)) // jw.
pompa_off.ustaw_symbol("ZapisBit(0/2)") // jw.
Obraz2.dodaj_kontrolke(pompa_off) // jw.
// Aplet Get służący za wyświetlacz wartości analogowej
var apget = new Obraz2.KAppletGet("apget", // nazwa nowej instancji
0, // rack PLC
2, // Slot CPU
"0xaaaaaa", // kolor tła (szary)
"CLTACHO", // typ wyświetlacza
"", //
0, // wart min. skali
255, // wart maks. skali
1000) // częstotliwość odświeżania [ms]
apget.ustaw_pozycje(150,80, 200,180) // jw.
//apget.ustaw_any_pointer(new Obraz2.AnyPointer("BYTE",1,"DB",5,20,0)) // jw.
apget.ustaw_symbol("ZapisBajt(0/2)") // jw.
Obraz2.dodaj_kontrolke(apget) // jw.
// Kontrolka, ustawienie w PLC wartości analogowej
var ustaw_wartosc = new Obraz2.KUstawAn("ustaw_wartosc", // nazwa nowej instancji kontrolki
"Nowa wartość: ", // tekst przed polem wartości
"<BR>jakiś tekst<br>", // tekst po ….
"Ustaw", // napis na przycisku
100, // wartość domyślna pola
1) // mnożnik
ustaw_wartosc.ustaw_pozycje(100,280, 100,20,100,20) // jw
//ustaw_wartosc.ustaw_any_pointer(new Obraz2.AnyPointer("BYTE",1,"DB",5,20,0)) // jw
ustaw_wartosc.ustaw_symbol("ZapisBajt(0/2)") // jw
Obraz2.dodaj_kontrolke(ustaw_wartosc) // jw
Obraz2.uruchom() // jw.
</script> // jw.
</center> // jw.
</BODY> // jw.
</HTML> // jw.
// Obraz3
// przedstawia tabelę, w której wyświetlane są wartości pochodzące z PLC
// Typowa skłądnia HTML
// + parametryzacja apletu Get wg manuala
======================================
<HTML><HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
<script type="text/javascript" src="/applets/cp343.js" language="JavaScript1.5"></script>
<style type="text/css"> <!--
@import url("main.css");
--> </style>
<TITLE>Demo wizualizacji dla modułu SIEMENS CP343-1</TITLE>
</HEAD>
<BODY BGCOLOR="#FFFFFF">
<center>
<!-- Tabela zawierająca poziomy w zbiornikach -->
<table align='center' border=1 width='90%'>
<tr>
<td align='center' colspan=3>
<b>Poziomy w zbiornikach magazynowych</b>
</td>
</tr>
<tr>
<td align='center'>
Kwas Siarkowy:<br>
<APPLET CODE="de.siemens.simaticnet.itcp.applets.S7GetApplet.class"
CODEBASE="/applets/" ARCHIVE="s7applets.jar, s7api.jar" NAME="XY_12"
WIDTH=50 HEIGHT=30>
<PARAM name="RACK" value=0>
<PARAM name="SLOT" value=2>
<PARAM name="CYCLETIME" value=5000>
<PARAM name="VARTYPE" value=2>
<PARAM name="VARCNT" value =1>
<PARAM name="VARAREA" value=0x84>
<PARAM name="VARSUBAREA" value=5>
<PARAM name="VAROFFSET" value=50>
<PARAM name="FORMAT" value="\B">
<PARAM name="BACKGROUNDCOLOR" value="0xFFFFFF">
</APPLET>
</td>
<td align='center'>
Kwas Azotowy:<br>
<APPLET CODE="de.siemens.simaticnet.itcp.applets.S7GetApplet.class"
CODEBASE="/applets/" ARCHIVE="s7applets.jar, s7api.jar" NAME="XY_21"
WIDTH=50 HEIGHT=30>
<PARAM name="RACK" value=0> <PARAM name="SLOT" value=2>
<PARAM name="CYCLETIME" value=5000>
<PARAM name="VARTYPE" value=2>
<PARAM name="VARCNT" value =1>
<PARAM name="VARAREA" value=0x84>
<PARAM name="VARSUBAREA" value=5>
<PARAM name="VAROFFSET" value=51>
<PARAM name="FORMAT" value="\B">
<PARAM name="BACKGROUNDCOLOR" value="0xFFFFFF">
</APPLET>
</td>
<td align='center'>
Kwas Solny:<br>
<APPLET CODE="de.siemens.simaticnet.itcp.applets.S7GetApplet.class"
CODEBASE="/applets/" ARCHIVE="s7applets.jar, s7api.jar" NAME="XY_31"
WIDTH=50 HEIGHT=30>
<PARAM name="RACK" value=0> <PARAM name="SLOT" value=2>
<PARAM name="CYCLETIME" value=5000>
<PARAM name="VARTYPE" value=2>
<PARAM name="VARCNT" value =1>
<PARAM name="VARAREA" value=0x84>
<PARAM name="VARSUBAREA" value=5>
<PARAM name="VAROFFSET" value=52>
<PARAM name="FORMAT" value="\B">
<PARAM name="BACKGROUNDCOLOR" value="0xFFFFFF">
</APPLET>
</td>
</tr>
</table>
<br>
<!-- Tabela zawierająca stany zaworów -->
<br>
<table align='center' border=1 width='90%'>
<tr>
<td align='center' colspan=3>
<b>Stan zaworów pod zbiornikami</b>
</td>
</tr>
<tr>
<td align='center'>
<b>Zaw 1:</b><br>
<APPLET CODE="de.siemens.simaticnet.itcp.applets.S7GetApplet.class"
CODEBASE="/applets/" ARCHIVE="s7applets.jar, s7api.jar" NAME="XY_12"
WIDTH=70 HEIGHT=30>
<PARAM name="RACK" value=0>
<PARAM name="SLOT" value=2>
<PARAM name="CYCLETIME" value=5000>
<PARAM name="VARTYPE" value=2>
<PARAM name="VARCNT" value =1>
<PARAM name="VARAREA" value=0x84>
<PARAM name="VARSUBAREA" value=5>
<PARAM name="VAROFFSET" value=60>
<PARAM name="FORMAT" value="\Y(0,OTWARTY,ZAMKNIETY)">
<PARAM name="BACKGROUNDCOLOR" value="0xFFFFFF">
</APPLET>
</td>
<td align='center'>
<i>Zaw 2:</i><br>
<APPLET CODE="de.siemens.simaticnet.itcp.applets.S7GetApplet.class"
CODEBASE="/applets/" ARCHIVE="s7applets.jar, s7api.jar" NAME="XY_21"
WIDTH=70 HEIGHT=30>
<PARAM name="RACK" value=0> <PARAM name="SLOT" value=2>
<PARAM name="CYCLETIME" value=5000>
<PARAM name="VARTYPE" value=2>
<PARAM name="VARCNT" value =1>
<PARAM name="VARAREA" value=0x84>
<PARAM name="VARSUBAREA" value=5>
<PARAM name="VAROFFSET" value=60>
<PARAM name="FORMAT" value="\Y(1,OTWARTY,ZAMKNIETY)">
<PARAM name="BACKGROUNDCOLOR" value="0xFFFFFF">
</APPLET>
</td>
<td align='center'>
<b><i> Zaw 3:</b></i><br>
<APPLET CODE="de.siemens.simaticnet.itcp.applets.S7GetApplet.class"
CODEBASE="/applets/" ARCHIVE="s7applets.jar, s7api.jar" NAME="XY_31"
WIDTH=70 HEIGHT=30>
<PARAM name="RACK" value=0> <PARAM name="SLOT" value=2>
<PARAM name="CYCLETIME" value=5000>
<PARAM name="VARTYPE" value=2>
<PARAM name="VARCNT" value =1>
<PARAM name="VARAREA" value=0x84>
<PARAM name="VARSUBAREA" value=5>
<PARAM name="VAROFFSET" value=60>
<PARAM name="FORMAT" value="\Y(2,OTWARTY,ZAMKNIETY)">
<PARAM name="BACKGROUNDCOLOR" value="0xFFFFFF">
</APPLET>
</td>
</tr>
</table>
<br>
<pre> Zawory : 1 - zawór otwarty;
0 - zawór zamknięty
</pre>
Dokładny opis wszystkich parametrów apletu Get w manualu: S7Beans / Applets for IT CPs, str. 42
Jw.
Dokładny opis wszystkich parametrów apletu Get w manualu: S7Beans / Applets for IT CPs
jw.