Prezentacja programu PowerPoint
Download
Report
Transcript Prezentacja programu PowerPoint
METAJĘZYKI
5
dr inż. Robert Berezowski
e-mail:
[email protected]
Ul. Śniadeckich 2
Pokój 223A
Politechnika Koszalińska
Wydział Elektroniki i Informatyki
Katedra Inżynierii Komputerowej
METAJĘZYKI
1
2015-07-18
Dokument kantor.xml
kantor
notowanie
notowanie
data
dzien
wydarzenie
kursy
rok
korona
miesiac
hrywna
dolar
euro
funt
METAJĘZYKI
2
2015-07-18
Zmienne - xsl:variable
• Deklaracja zmiennych
<xsl:variable name=„xx” select=”wartość”/>
<xsl:variable name=„xx”>wartość</xsl:variable>
• Użycie:
<xsl:value-of select=„$xx”/>
• Zmienna w XML –
raz zapisać, wielokrotnie odczytać.
nie ma możliwości modyfikacji
żywotność ograniczona do elementu wewnątrz którego została zadeklarowana
<xsl:template match="/">
<HTML><BODY> <H1>Kantorek! </H1>
<xsl:for-each select="kantor/notowanie[1]/kursy/*">
<xsl:variable name="nazwa">
<xsl:value-of select="name()"/>
</xsl:variable>
<xsl:value-of select="$nazwa"/><BR/>
</xsl:for-each>
</BODY></HTML>
METAJĘZYKI
</xsl:template>
3
2015-07-18
Zmienne - xsl:variable
• Przykład
<xsl:variable name="data">
<xsl:value-of select="data/dzien"/>/
<xsl:value-of select="data/miesiac"/>/
<xsl:value-of select="data/rok"/>
</xsl:variable>
...
<td><xsl:value-of select="$data"/></td>
4
METAJĘZYKI
2015-07-18
Zmienne – przykłady tekstów
<xsl:value-of select=„text()"/>
<xsl:value-of select="substring(name(),1,3)"/>
<xsl:value-of select="substring-after(text(),'.')"/>
<xsl:value-of select="translate(text(),'.',',')"/>
METAJĘZYKI
5
2015-07-18
Zmienne – przykłady drzew
<xsl:template match="/">
<HTML>
<BODY bgcolor="lime">
<H1>Kantorek! </H1>
<xsl:for-each select="kantor/notowanie">
<xsl:variable name="nazwa" select="."/>
... <xsl:value-of select="$nazwa/kursy/funt"/> ...
<BR/>
</xsl:for-each>
</BODY></HTML>
<xsl:template match="/">
</xsl:template>
<HTML>
METAJĘZYKI
<BODY bgcolor="lime">
<H1>Kantorek! </H1>
<xsl:for-each select="kantor/notowanie">
<xsl:variable name="nazwa" select="."/>
... <xsl:value-of select="$nazwa/data[rok=2004]"/> ...
<BR/>
</xsl:for-each>
6
</BODY></HTML>
2015-07-18
</xsl:template>
Zmienna globalna i lokalna
<xsl:template match="/">
Zmienna lokalna wewnątrz reguły „/”
<HTML>
<BODY bgcolor="lime">
<H1>Kantorek! </H1>
<xsl:variable name="nazwa">...
<xsl:for-each select="kantor/notowanie">
<xsl:value-of select="data/miesiac"/>,
</xsl:for-each>...
</xsl:variable>
<xsl:variable name="nazwa">...
<xsl:value-of select="$nazwa"/>
<xsl:for-each select="/kantor/notowanie">
</BODY></HTML>
<xsl:value-of select="data/miesiac"/>,
</xsl:template>
</xsl:for-each>...
</xsl:variable>
<xsl:template match="/">
<HTML>
<BODY bgcolor="lime">
<H1>Kantorek! </H1>
Zmienna globalna wewnątrz
<xsl:value-of select="$nazwa"/>
elementu <xsl:stylesheet...>
7
</BODY></HTML>
2015-07-18
METAJĘZYKI
</xsl:template>
<xsl:variable name="imie">Jacek</xsl:variable>
<xsl:template match="audycja">
<xsl:if test="@osoba=$imie">
<table border="1" width="100%">
<tr>
<td width="60"><xsl:value-of select="@osoba"/></td>
<td width="80"><xsl:value-of select="text()"/></td>
<td width="50"><xsl:value-of select="@data"/></td>
<td width="40"><xsl:value-of select="@godz"/></td>
<td width="30"><xsl:value-of select="@czas"/></td>
</tr>
</table>
</xsl:if>
</xsl:template>
8
METAJĘZYKI
2015-07-18
<xsl:template match="/program">
<html><body>
<table border="1">
<xsl:for-each select="//audycja[not(@osoba=preceding::*/@osoba)]">
<xsl:variable name="kto" select="@osoba"/>
<tr>
<td><xsl:value-of select="$kto"/></td>
<td>
<table border="1" width="100%">
<xsl:for-each select="//audycja[@osoba=$kto]">
<tr>
<td><xsl:value-of select="../@nazwa"/></td>
<td><xsl:value-of select="text()"/></td>
<td><xsl:value-of select="@data"/></td>
</tr>
</xsl:for-each>
</table>
</td>
</tr>
</xsl:for-each>
</table>
</body></html>
</xsl:template>
METAJĘZYKI
9
2015-07-18
document()
• Funkcja document()
pozwala pobierać dane z innych źródeł XML, zamiast ze źródła
podanego w wywołaniu procesora.
Użycie: document(url), document(‘jakis_plik’)
<xsl:variable name="kantor2" select="document('kantor2.xml')"/>
<xsl:template match="/">
<table border="1"><tr><td>data</td><td>funt</td><td>euro</td></tr>
<xsl:for-each select="kantor/notowanie">
<tr><td><xsl:value-of select="data"/></td>
<td><xsl:value-of select="kursy/funt"/></td>
<td><xsl:value-of select="kursy/euro"/></td></tr>
</xsl:for-each>
<tr><td>data</td><td>funt</td><td>euro</td></tr>
<xsl:for-each select="$kantor2/kantor/notowanie">
<tr><td><xsl:value-of select="data"/></td>
<td><xsl:value-of select="kursy/funt"/></td>
<td><xsl:value-of select="kursy/euro"/></td></tr>
METAJĘZYKI
</xsl:for-each></table></xsl:template>
10
2015-07-18
11
METAJĘZYKI
2015-07-18
Parametry – xsl:param
• Parametry pozwalają dynamicznie zmienić postać
wyniku
• Rodzaje:
Globalne – pobierające dane z poza arkusza, deklarowane w
elemencie <xsl:stylesheet...>
Lokalne – używane wewnątrz reguł do pobierania danych z
reguły wywołującej.
• Deklaracja:
<xsl:param name=„nazwa” select=„wartość”/>
<xsl:param name=„nazwa”>wartość</xsl:param>
• Wywołanie reguły z parametrami:
<xsl:call-template name=„max”>
<xsl:with-param name=„liczba1” select=„notowanie[1]/kursy/funt”/>
<xsl:with-param name=„liczba2” select=„notowanie[2]/kursy/funt”/>
</xsl:call-template>
METAJĘZYKI
12
2015-07-18
<xsl:template match="/program">
<h1> <xsl:call-template name="naglowek"/>
<xsl:call-template name="spis">
<xsl:with-param name="drzewo" select="."/>
</xsl:call-template>
<xsl:apply-templates/>
</h1>
</xsl:template>
<xsl:template match="kanal">
<a name="{@nazwa}"> <h2> <xsl:value-of select="@nazwa"/> </h2></a>
<table border=„1”><tr><td>
<xsl:apply-templates/>
</td></tr></table>
</xsl:template>
<xsl:template name="spis">
<xsl:param name="drzewo"/>
<xsl:for-each select="$drzewo/kanal">
--| <a href="#{@nazwa}"><xsl:value-of select="@nazwa"/></a> |-</xsl:for-each>
</xsl:template>
METAJĘZYKI
13
2015-07-18
Przykład użycia parametrów lokalnych
<xsl:template match="/">
<HTML><BODY bgcolor="lime">
<TABLE border="1">
<xsl:call-template name="tabela">
<xsl:with-param name="plik" select="."/>
</xsl:call-template>
<xsl:call-template name="tabela">
<xsl:with-param name="plik" select="document('kantor2.xml')"/>
</xsl:call-template>
</TABLE></BODY></HTML>
</xsl:template>
<xsl:template name="tabela">
<xsl:param name="plik"/>
<tr><td>data</td><td>funt</td><td>euro</td></tr>
<xsl:for-each select="$plik/kantor/notowanie">
<tr><td><xsl:value-of select="data"/></td>
<td><xsl:value-of select="kursy/funt"/></td>
<td><xsl:value-of select="kursy/euro"/></td></tr>
</xsl:for-each>
METAJĘZYKI
</xsl:template>
14
2015-07-18
Przykład
użycia
parametrów
globalnych
<xsl:param name="waluta”>euro</xsl:param>
<xsl:template match="/">
<HTML><BODY bgcolor="lime"><H1>Kantorek! </H1>
<TABLE border="1">
<xsl:call-template name="tabela">
<xsl:with-param name="plik" select="."/>
</xsl:call-template>
<xsl:call-template name="tabela">
<xsl:with-param name="plik"
select="document('kantor2.xml')"/>
</xsl:call-template></TABLE></BODY></HTML>
</xsl:template>
<xsl:template name="tabela">
<xsl:param name="plik"/>
<tr><td>data</td><td>cena</td></tr>
<xsl:for-each select="$plik/kantor/notowanie">
<tr><td><xsl:value-of select="data"/></td>
<td><xsl:value-of
select="kursy/*[name()=$waluta]"/></td></tr>
</xsl:for-each>
METAJĘZYKI
</xsl:template>
15
2015-07-18
Wywołanie parametrów globalnych
Plik kantor.html
część body
<BODY onload="init();" style="margin-top: '0'">
<button onclick="show('funt')">funty</button>
<button onclick="show('dolar')">dolary</button>
<button onclick="show('euro')">euro</button>
<button onclick="show('hrywna')">hrywna</button>
<button onclick="show('korona')">korona</button>
<div id="ekran">wyniki</div>
</BODY>
16
METAJĘZYKI
2015-07-18
Wywołanie parametrów globalnych
<SCRIPT language="jscript">
Plik kantor.html
var xml, xsl, xsltmp;
część head
function init()
{xml = new ActiveXObject('MSXML2.DOMDocument.4.0');
xml.async = false;
Wczytanie pliku xml
xml.load('kantor.xml');
xsl=new ActiveXObject('MSXML2.FreeThreadedDOMDocument.4.0');
xsl.async = false;
Wczytanie pliku xsl
xsl.load('kantor-5.xsl');
xsltmp = new ActiveXObject("Msxml2.XSLTemplate.4.0");
xsltmp.stylesheet = xsl; }
function show(waluta)
{ var xslProc = xsltmp.createProcessor();
xslProc.input = xml;
xslProc.addParameter("waluta", waluta, "");
xslProc.transform();
ekran.innerHTML = xslProc.output; }
</SCRIPT>
METAJĘZYKI
Dodanie parametru do
pliku xsl
Umieszczenie rezultatu w
obiekcie ‘ekran’
17
2015-07-18
<xsl:template match="/program">
<xsl:call-template name="naglowek"/>
<xsl:call-template name="spis">
<xsl:with-param name="drzewo" select="."/>
</xsl:call-template>
<xsl:apply-templates/>
<xsl:call-template name="stopka"/>
</xsl:template>
<xsl:template match="kanal">
<a name="{@nazwa}">
<xsl:value-of select="@nazwa"/> </a>
</xsl:template>
<xsl:template name="naglowek">
<br/>Program telewizyjny - wybrane audycje<br/>
</xsl:template>
<xsl:template name="spis">
<xsl:param name="drzewo"/>
<xsl:for-each select="$drzewo/kanal">
--| <a href="#{@nazwa}">
<xsl:value-of select="@nazwa"/></a> |-</xsl:for-each>
</xsl:template>
METAJĘZYKI
Parametry i hiperłącza
18
2015-07-18
function tr(program){
xmlFile = "tv.xml”; xslFile = "1x.xsl";
…
objXSLTProc.addParameter("data", program, "");
…
parent.pl1.innerHTML = objXSLTProc.output;}
…
<FORM>
<INPUT TYPE="button" VALUE="TVP1" onClick="tr('TVP1');">
<INPUT TYPE="button" VALUE="TVP2" onClick="tr('TVP2');">
<INPUT TYPE="button" VALUE="TVN" onClick="tr('TVN');">
<INPUT TYPE="button" VALUE="POLSAT" onClick="tr('POLSAT');">
</FORM><hr>
<div ID="pl1">pokaz</div>
<xsl:param name="data">*</xsl:param>
<xsl:template match="/program">
<xsl:apply-templates select="kanal[@nazwa=$data]"/>
</xsl:template>
<xsl:template match="kanal">
<xsl:variable name="opis" select="document('tvopis.xml')"/>
…
<xsl:apply-templates>
<xsl:sort select="@osoba"/>
</xsl:apply-templates>
METAJĘZYKI
</xsl:template>
19
2015-07-18
function tr(program){
xmlFile = "tv.xml”; xslFile = "2x.xsl";
…
objXSLTProc.addParameter("data", program, "");
…
parent.pl1.innerHTML = objXSLTProc.output;}
<FORM>
<INPUT TYPE="button" VALUE="Justyna" onClick="tr('Justyna');">
<INPUT TYPE="button" VALUE="Jacek" onClick="tr('Jacek');">
<INPUT TYPE="button" VALUE="Grzesiek" onClick="tr('Grzesiek');">
</FORM>
<hr>
<div ID="pl1">pokaz</div>
<xsl:param name="data">*</xsl:param>
<xsl:template match="/program">
<xsl:apply-templates select="kanal"/>
</xsl:template>
<xsl:template match="kanal">
<xsl:apply-templates select="audycja[@osoba=$data]">
<xsl:sort select="@osoba"/>
</xsl:apply-templates>
</xsl:template>
<xsl:template match="audycja">
<tableMETAJĘZYKI
border="1" width="100%„>
20
2015-07-18
<xsl:param name="obiekt1">*</xsl:param>
<xsl:param name="obiekt2">*</xsl:param>
<xsl:template match="/program">
function tr(pr1,pr2){
xmlFile = "tv.xml”; xslFile = "tv.xsl";
objXSLTProc.addParameter("obiekt1", pr1, "");
objXSLTProc.addParameter("obiekt2", pr2, "");
document.body.innerHTML = objXSLTProc.output;}
…
<FORM>
<INPUT TYPE="text" id="pole1" />
<INPUT TYPE="text" id="pole2" />
<INPUT TYPE="button" value="szukaj"
onClick="tr(document.getElementById('pole1').value,
document.getElementById('pole2').value)"/>
</FORM><hr/> szukane: <div id=„pokaz">brak</div>
<xsl:apply-templates select="kanal">
<xsl:sort select="audycja/@czas"/>
</xsl:apply-templates>
</xsl:template>
<xsl:template match="kanal">
<xsl:apply-templates select="audycja[(@*=$obiekt1) or (@*=$obiekt2) or
(.=$obiekt1) or (.=$obiekt2)]">
</xsl:apply-templates>
</xsl:template>
METAJĘZYKI
21
2015-07-18
<xsl:stylesheet … xmlns:msxsl="urn:schemas-microsoft-com:xslt">
<xsl:param name="sort1">osoba</xsl:param>
<xsl:variable name="tylko.audycje">
<element>
<xsl:for-each select="/program/kanal„>
<xsl:for-each select="audycja">
<xsl:copy-of select="."/>
</xsl:for-each> </xsl:for-each>
</element>
</xsl:variable>
<xsl:template match="/program">
function tr(pr3){xmlFile = "tv.xml”; xslFile = "tv.xsl";
objXSLTProc.addParameter("sort1", pr3, "");
document.body.innerHTML = objXSLTProc.output;
parent.pokaz.innerHTML= " sort: "+pr3;} …
<FORM><INPUT TYPE="text" id="pole3" />
<INPUT TYPE="button" value="szukaj"
onClick="tr(document.getElementById('pole3').value)"/>
</FORM><hr/>
szukane: <div id="pokaz">brak</div>
<xsl:call-template name="wypisz">
<xsl:with-param name="wszystkie" select="$tylko.audycje"/>
</xsl:call-template>
…
<xsl:template name="wypisz„> <xsl:param name="wszystkie"/>
<xsl:for-each select="msxsl:node-set($wszystkie)/element/audycja">
<xsl:sort select="@*[name()=$sort1]"/>
<table border="1" width="100%„><tr>
<td width="60"><xsl:value-of select="@osoba"/></td>
</xsl:template>
METAJĘZYKI
22
2015-07-18
WYSPY XML w HTML
Pozwalają umieścić treści z dokumentu
xml wewnątrz dokumentu html
<HTML><BODY bgcolor=„lime”>
<XML ID="wyspa" src="kantor3.xml"></XML>
<table border="1" datasrc="#wyspa">
<thead><th colspan="3">data</th><th>euro</th>
<th>dolar</th><th>funt</th><th>hrywna</th>
<th>korona</th></thead>
<tr><td><span datafld="dzien"/></td><td>
<span datafld="miesiac"/></td><td>
<span datafld="rok"/></td>
<td><span datafld="dolar"/></td>
<td><span datafld="euro"/></td>
<td><span datafld="funt"/></td>
<td><span datafld="hrywna"/></td>
<td><span datafld="korona"/></td>
METAJĘZYKI
</tr></table></BODY></HTML>
23
2015-07-18
SVG – Scalable Vector Graphics
• Język opisu grafiki dwuwymiarowej
• Grafika jest opisywana za pomocą równań
matematycznych przez co zajmuje mniej
pamięci niż pliki graficzne typu gif, jpg.
• Kilka linków
www.w3.org/TR/SVG - specyfikacja SVG
www.w3.org/Graphics/SVG - strona domowa W3C SVG
www.irt.org/articles/js176 - troche linków i artykułów
www.adobe.com/svg - strona Adobe o SVG, kilka tutoriali
24
METAJĘZYKI
2015-07-18
Przykłady svg
Linia od punktu (x1=10,y1=100) do punktu (x2=222,y2=234) w kolorze
czerwonym
<line x1="10" y1="100" x2="222" y2="234" style="fill:red"/>
Prostokąt od punktu (x=0,y=0) o wysokości 10 (height) i długości 100 (width)
w wypełniony kolorem czerwonym
<rect x="0" y="0" height="10" width="100" style="fill:red"/>
Koło o środku w punkcie (cx=150,cy=150) i promieniu r=50 wypełniony
kolorem zielonym, ze stopniem przeźroczystości 0.5
<circle cx="150" cy="150" r="50„ style="fill:green; fill-opacity: 0.5"/>
tekst z określonymi atrybutami:
<text style = "fill: red; font-size: 24pt" x = "25" y = "250">
juz niedlugo majowka</text>
Animacja elementów – obrót o kąt od 0 do 360 stopni w czasie 4s
nieskończoną ilość razy
<animateTransform attributeName="transform" type="rotate" dur="4s"
from="0" to="360„ repeatCount = "indefinite"/>
25
METAJĘZYKI
2015-07-18