Fejlett Programozási Technikák 2. 7/2
A mai előadás tartalma: CSS XML DTD XSLT WEBdav SyncML WAP WML
Problémák Tartalom, formázás egyveleg HTML formázó készlet szegényes HTML a dokumentum szerkezetét adja A böngészőre volt bízva a megjelenítés Netscape, IE, új elemek Egységes megoldás CSS
Előnyei Tartalom, formázás elkülönül Nyílt szabvány Sok böngésző támogatja Stílust definiál Megkönnyíti a munkát
Definiálható HTML elemen belül HTML dokumentum fejrészében Külső css fájlban Több külső css fájlban
Érvényesítési sorrend Böngésző alapértelmezett css Külső css Fejrész css Egyes elemekben definiált
A CSS bejegyzés felépítése Választó Tulajdonság Érték
Példa Body { color:yellow } p { font-family:”sans serif” } P text-align: center; color: black; font-family: arial h1, h2, h3, h4, h5, h6 { color: green}
Hivatkozások: Class p.jobb {text-align: right} p.kozep {text-align: center} … <p class=”jobb”>Ez a bekezdés jobbra lesz igazítva<p> <p class=”bal”>Ez a bekezdés jobbra lesz igazítva<p>
Hivatkozások: Általános .kozep {text-align: center} <input type=”text” class=”kozep”> <p class=”kozep”>Középre igazítva</p>
Hivatkozások: id #intro { font-size:110%; font-weight:bold; color:#0000ff; background-color:transparent } p#intro
Definiálás Külső oldal: Fejrészben: Az adott elemnél: <head> <link rel="stylesheet" type="text/css" href="mina.css" /> </head> Fejrészben: <style type="text/css"> hr {color: sienna} p {margin-left: 20px} body {background-image: url("images/back40.gif")} </style> Az adott elemnél: <p style="color: sienna; margin-left: 20px"> Ez egy bekezdés</p>
Formázási lehetőségek Háttér Szöveg Betű Keretvonal Margó Padding Listák
XML SGML (bonyolult) HTML Előre definiált elemkészlet Csak megjelenítés Hibakezelés (<li>, 30%)
XML nyelvcsalád XML Adatleíró nyelv XSL, XSLT Xpath XML Shema XQL …
XML Nincs nyelvtana Nincs elemkészlete Tetszőleges nyelvtan Tetszőleges elemkészlet Nagyon rugalmas
Példa <Feladat sorszam="14"> <vegrahajto>Kardos Katalin</vegrahajto> <megbizo>Nagy Emese</megbizo> <hatarido>2002.05.01</hatarido> </Feladat>
Szabályok Jelölőelemeket használ Minden kezdőelemhez tartozik záró Az elemek egymásba ágyazhatóak Nem metszhetik egymást az elem párok US-ASCII kódolás, ha nem azt jelezni kell Érzékeny a kis és nagy betűkre Nem kötelező de jó ha van hozzá DTD és azt betartja Jól formázott Érvényes
Szerkezet PI DTD Fejléc Törzs <?xml version="1.0"?> <!DOCTYPE Feladat SYSTEM "DTD\feladat.dtd"> <Feladat sorszam="14"> <vegrahajto>Kardos Katalin</vegrahajto> <megbizo>Nagy Emese</megbizo> <hatarido>2002.05.01</hatarido> </Feladat> DTD Fejléc Gyökér elem Törzs
Elemek <elem tulajdonság=”valami”> érték </elem> Nem célszerű tulajdonságot használni Nyitó elem Záró elem
Névtér URI xmlns <?xml version="1.0"?> <!DOCTYPE Feladat SYSTEM "DTD\feladat.dtd"> <Pelda1:Feladat xmlns:Pelda1="http://wilma.cab.u-szeged.hu :8080/cocoon/pelda1.xml"> <Pelda1:vegrahajto>Kardos Katalin</Pelda1:vegrahajto> <Pelda1:megbizo>Nagy Emese</Pelda1:megbizo> <Pelda1:hatarido>2002.05.01</Pelda1:hatarido> </Pelda1:Feladat>
DTD Öndokumentálás Nyeltan Elemkészlet Hibajavítás (B2B)
Példa <!ELEMENT Pelda1:Feladat (Pelda1:vegrehajto, Pelda1:megbizo, Pelda1:hatarido)> <!ELEMENT Pelda1:vegrehajto (#PCDATA)> <!ELEMENT Pelda1:megbizo (#PCDATA)> <!ELEMENT Pelda1:hatarido (#PCDATA)>
Ismétlődés operátorok Nincs Pontosan egyszer kell szerepelnie ? Egyszer vagy egyszer sem + Legalább egyszer * Akárhányszor (0 is) <!ELEMENT Pelda1:Feladat ((Pelda1:vegrehajto, Pelda1:hatarido))+, Pelda1:megbizo)>
Tulajdonságok <!ATTLIST feladat munkahely (irinyi|arpadter)> Módosító: #IMPLIED -- Nem feltétlenül szükséges. #REQUIRED -- Szükséges. #FIXED -- Kötelező a jelenléte és az értéke egyaránt. ”alapértelmezett érték”
XSLT
Felépítése XSLT egy XML dokumentum; melynek névtere (http://www.w3.org/TR/REC-xml-names) A legtöbb stíluslap önálló Gyökere <xsl:stylesheet> vagy <xsl:transform>
Példa <xsl:stylesheet xmlns:xsl="http://www.w3c.org/1999/XSL/Transform" xmlns:Pelda1="http://wilma.cab.u-szeged.hu:8080/ cocoon/xslp1.xml"> <xsl:template match="Pelda1:Feladat"> ez kerül az adott elem helyére </xsl:template> </xsl:stylesheet>
Eszközök IE 6.0 Cocoon Java Servlet XML formátum XSLT feldolgozó Utófeldolgozó HTML, XHTML, WML, PDF, XSL:FO
Példa(XML) <?xml version="1.0" encoding="ISO-8859-2"?> <oldal> <cim>Hello</cim> <tartalom> <para>Ez egy bekezdés</para> </tartalom> </oldal>
Példa(XSLT) <?xml version="1.0"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:template match="oldal"> <html> <head> <title><xsl:value-of select="cim" /></title> </head> <body> <xsl:apply-templates /> </body> </html> </xsl:template> </xsl:stylesheet>
For-each <?xml version="1.0" encoding="ISO-8859-2"?> <oldal> <munkatársak> <név> <vezetéknév>Nagy</vezetéknév> <keresztnév>Tamás</keresztnév> </név> <vezetéknév>Szép</vezetéknév> <keresztnév>Ilona</keresztnév> <vezetéknév>Kiss</vezetéknév> <keresztnév>Tihamér</keresztnév> </munkatársak> </oldal>
For-each <?xml version="1.0" encoding="ISO-8859-2"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:template match="munkatársak"> <html> <head> </head> <body> <table border="1" cellspacing="0" cellpadding="8"> <tr> <td><b>Vezetéknév</b></td> <td><b>Keresztnév</b></td> </tr> <xsl:for-each select="név" > <td><xsl:value-of select="vezetéknév" /></td> <td><xsl:value-of select="keresztnév" /></td> </xsl:for-each> </table> </body> </html> </xsl:template> </xsl:stylesheet>
Eredmény
Sorbarendezés <?xml version="1.0" encoding="ISO-8859-2"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:template match="munkatársak"> <ul> <xsl:apply-templates select="név"> <xsl:sort select="vezetéknév"/> <xsl:sort select="keresztnév"/> </xsl:apply-templates> </ul> </xsl:template> <xsl:template match="név"> <li> <xsl:value-of select="vezetéknév"/> <xsl:text> </xsl:text> <xsl:value-of select="keresztnév"/> </li> </xsl:stylesheet>
Sorszámozás <?xml version="1.0" encoding="ISO-8859-2"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:template match="munkatársak"> <xsl:for-each select="név"> <xsl:sort select="vezetéknév"/> <xsl:sort select="keresztnév"/> <p> <xsl:number value="position()" format="1. "/> <xsl:value-of select="."/> </p> </xsl:for-each> </xsl:template> </xsl:stylesheet>
if <?xml version="1.0" encoding="ISO-8859-2"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:template match="oldal"> <table> <xsl:apply-templates/> </table> </xsl:template> <xsl:template match="név"> <tr> <td> <xsl:if test="keresztnév='Ilona'">---></xsl:if> </td> </tr> </xsl:stylesheet>
WEBdav Közös munka elősegítése Kompatíbilis a HTTP-vel Azonosítás Zárolás Tulajdonság kezelés Hierarchia kezelés Kompatíbilis a HTTP-vel
Metódusok PROPFIND -- lekérdezi az URI segítségével megcímezett erőforrás általunk megadott paramétereit. PROPPATCH -- manipulálja URI segítségével megcímezett erőforrás általunk megadott paramétereit. MKCOL -- segítségével tudunk új erőforrásokat, erőforráshalmazokat létrehozni GET, HEAD -- változatlan POST -- változatlan DELETE -- erőforrások, vagy erőforrások halmazának törlése, ha egyszerre többet szeretnénk törölni és egyet vagy többet nem tudunk törölni akkor egyet sem fog törölni. PUT -- erőforrásokat tölthetünk fel a szerverre, ha a megfelelő hierarchia már lére van hozva a MKCOL által COPY -- erőforrások, erőforráshalmazok másolását biztosítja beállítható mélységben MOVE -- hasonló mint a COPY csak törli az erőforrást LOCK – zárolás UNLOCK -- zárolás feloldása
Zárolás Shared Exclusive XML kód Paraméter továbbítás
Példa PROPPATCH /bar.html HTTP/1.1 Host: www.foo.com Content-Type: text/xml; charset="utf-8„ Content-Length: xxxx <?xml version="1.0" encoding="utf-8" ?> <D:propertyupdate xmlns:D="DAV:" xmlns:Z="http://www.w3.com/standards/z39.50/"> <D:set> <D:prop> <Z:authors> <Z:Author>Jim Whitehead</Z:Author> <Z:Author>Roy Fielding</Z:Author> </Z:authors> </D:prop> </D:set> <D:remove> <D:prop><Z:Copyright-Owner/></D:prop> </D:remove> </D:propertyupdate>
SyncML Tartalom szinkronizálás HTTP protokollra épül XML alapú Klines-szerver
Függvények <Add> adat hozzáadás <Alert> értesíti a célt <Atomic> együtt kell végrehajtani <Copy> adatok másolása <Delete> adat törlése <Exec> program futtatása <Get> adat letöltése <Map>két adatkészlet közötti kapcsolat frissítése <Put> felmásolás <Replace> felülírás <Search> keresés <Sequence> a programok sorban hajtódjonak végre <Sync> két adathalmazt szinkronizál