Aplikacje internetowe laboratorium XML, DTD, XML Schema, XSL

Transkrypt

1 Aplikacje internetowe laboratorium XML, DTD, XML Schema, XSL Celem ćwiczenia jest stworzenie dokumentu XML, wyposażenie dokumentu w specyfikację struktury (przy użyciu DTD i XML Schema), oraz transformacja dokumentu XML do postaci HTML przy użyciu arkuszy stylów XSL. Do wykonania ćwiczenia potrzebny jest dowolny edytor plików tekstowych oraz przeglądarka internetowa. 1. Stwórz plik pracownicy.xml zawierający informacje o wszystkich zespołach i pracownikach zespołów. Wykorzystaj poniższy kod: <?xml version="1.0" encoding="iso "?> <INSTYTUT NAZWA="INSTYTUT INFORMATYKI" ULICA="PIOTROWO 2" KOD="60-965" MIASTO="POZNAN"> <ZESPOLY> <ZESPOL> <NAZWA>ADMINISTRACJA</NAZWA> <PRACOWNICY> <PRACOWNIK ID_PRAC="p180"> <NAZWISKO>MAREK</NAZWISKO><ETAT>SEKRETARKA</ETAT><PLACA>410,2</PLACA> </PRACOWNICY> <ZESPOL> <NAZWA>ALGORYTMY</NAZWA> <PRACOWNICY> <PRACOWNIK ID_PRAC="p110"> <NAZWISKO>BLAZEWICZ</NAZWISKO><ETAT>PROFESOR</ETAT><PLACA>1350</PLACA> </PRACOWNICY> <ZESPOL> <NAZWA>SYSTEMY EKSPERCKIE</NAZWA> <PRACOWNICY> <PRACOWNIK ID_PRAC="p230"> <NAZWISKO>HAPKE</NAZWISKO><ETAT>ASYSTENT</ETAT><PLACA>480</PLACA> <PRACOWNIK ID_PRAC="p200"> <NAZWISKO>ZAKRZEWICZ</NAZWISKO><ETAT>STAZYSTA</ETAT><PLACA>208</PLACA> </PRACOWNICY> <ZESPOL> <NAZWA>SYSTEMY ROZPROSZONE</NAZWA> <PRACOWNICY> <PRACOWNIK ID_PRAC="p220"> <NAZWISKO>KONOPKA</NAZWISKO><ETAT>ASYSTENT</ETAT><PLACA>480</PLACA> <PRACOWNIK ID_PRAC="p190"> <NAZWISKO>MATYSIAK</NAZWISKO><ETAT>ASYSTENT</PLACA><PLACA>371</ETAT> <PRACOWNIK ID_PRAC="p170"> <NAZWISKO>JEZIERSKI</NAZWISKO><ETAT>ASYSTENT</ETAT><PLACA>439,7</PLACA> <PRACOWNIK ID_PRAC="p160"> <NAZWISKO>KOSZLAJDA</NAZWISKO><ETAT>ADIUNKT</ETAT><PLACA>590</PLACA> </PRACOWNICY> <ZESPOL> <NAZWA>BADANIA OPERACYJNE</NAZWAZESPOLU> </ZESPOLY> </INSTYTUT> 2. Sprawdź, czy plik jest poprawnie wyświetlany przez przeglądarkę. Znajdź błędy w dokumencie i je napraw.

2 3. Stwórz opis DTD (ang. Document Type Definition) struktury danych przechowywanych w pliku pracownicy.xml. W nagłówku pliku pracownicy.xml dodaj poniższy kod: <?xml version="1.0" encoding="iso "?> <!DOCTYPE INSTYTUT [ <!ELEMENT INSTYTUT (ZESPOLY)> <!ATTLIST INSTYTUT NAZWA CDATA #REQUIRED ULICA CDATA #IMPLIED KOD CDATA #IMPLIED MIASTO CDATA #FIXED "POZNAN"> <!ELEMENT ZESPOLY (ZESPOL)+> <!ELEMENT ZESPOL (NAZWA,PRACOWNICY?)> <!ELEMENT NAZWA (#PCDATA)> <!ELEMENT PRACOWNICY (PRACOWNIK)+> <!ELEMENT PRACOWNIK (NAZWISKO,ETAT,PLACA)> <!ATTLIST PRACOWNIK ID_PRAC ID #REQUIRED> <!ELEMENT NAZWISKO (#PCDATA)> <!ELEMENT ETAT (#PCDATA)> <!ELEMENT PLACA (#PCDATA)> <!ENTITY szef "DYREKTOR"> ]> <INSTYTUT NAZWA="INSTYTUT INFORMATYKI"...> 4. Dodaj do zespołu ADMINISTRACJA nowego pracownika zdefiniowanego jak poniżej i zobacz, jak dokument jest wyświetlany w przeglądarce. Zwróć uwagę na to, w jaki sposób przeglądarka interpretuje encję XML. <PRACOWNIK ID_PRAC="p100"> <NAZWISKO>WEGLARZ</NAZWISKO><ETAT>&szef;</ETAT><PLACA>1730</PLACA> 5. Wykorzystaj walidator do sprawdzenia poprawności swojego pliku pracownicy.xml 6. Pracownikowi ZAKRZEWICZ zmień wartość atrybutu ID_PRAC na "p220" i ponownie zwaliduj dokument. Zapoznaj się z komunikatem o błędzie. Przywróć poprawną wersję dokumentu. 7. Pracownikowi JEZIERSKI usuń znacznik <PLACA>439,7</PLACA> i ponownie zwaliduj dokument. Zapoznaj się z komunikatem o błędzie. Przywróć poprawną wersję dokumentu.

3 8. Stwórz dokument zespoly.xml posługując się poniższym kodem. Sprawdź, czy dokument jest poprawnie wyświetlany przez przeglądarkę. <?xml version="1.0" encoding="iso "?> <ZESPOLY> <ZESPOL ID="10"> <NAZWA>ADMINISTRACJA</NAZWA><ADRES>PIOTROWO 3A</ADRES> <ZESPOL ID="20"> <NAZWA>SYSTEMY ROZPROSZONE</NAZWA><ADRES>PIOTROWO 3A</ADRES> <ZESPOL ID="30"> <NAZWA>SYSTEMY EKSPERCKIE</NAZWA><ADRES>STRZELECKA 14</ADRES> <ZESPOL ID="40"> <NAZWA>ALGORYTMY</NAZWA><ADRES>WLODKOWICA 16</ADRES> <ZESPOL ID="50"> <NAZWA>BADANIA OPERACYJNE</NAZWA><ADRES>MIELZYNSKIEGO 30</ADRES> </ZESPOLY> 9. Uruchom program Oxygen XML Editor. Stwórz nowy document XML Schema. W tym celu przejdź do menu File -> New, z dostępnej listy wybierz XML Schema i kliknij Create. Pojawi się szkielet definicji schematu. Przejdź z trybu edycji graficznej (Design) do trybu edycji tekstowej (Text na dole ekranu) i zamiast istniejącej zawartości wstaw poniższy kod. Zapisz plik jako zespoly.xsd. <?xml version="1.0" encoding="iso "?> <xs:schema targetnamespace=" elementformdefault="qualified" attributeformdefault="unqualified" xmlns=" xmlns:xs=" <xs:element name="zespoly"> <xs:annotation> <xs:documentation> Zbior zespolow skladajacych sie na Instytut Informatyki </xs:documentation> </xs:annotation> <xs:complextype> <xs:sequence> <xs:element name="zespol" maxoccurs="unbounded"> <xs:complextype> <xs:sequence> <xs:element name="nazwa" type="xs:string"/> <xs:element name="adres" type="xs:string"/> </xs:sequence> <xs:attribute name="id" type="xs:integer" use="required"/> </xs:complextype> </xs:element> </xs:sequence> </xs:complextype> </xs:element> </xs:schema>

4 10. Otwórz plik zespoly.xml w programie Oxygen XML Editor i dodaj deklarację wiążącą ten dokument ze stworzonym właśnie schematem XML. Znacznik początkowy powinien mieć postać: <ZESPOLY xmlns=" xmlns:xsi=" xsi:schemalocation=" zespoly.xsd"> 11. Zwaliduj utworzony dokument. Do tego celu możesz posłużyć się walidatorem na stronie lub wykorzystać walidator wbudowany w narzędzie Oxygen XML Editor (Ctrl + Shift + v). 12. Do znacznika <ZESPOL> reprezentującego zespół BADANIA OPERACYJNE dodaj atrybut informujący, że dany zespół nie zatrudnia pracowników. Jako wartość atrybutu wpisz literały false lub 0. <ZESPOL ID="50" CZY_PRACOWNICY="false"> <NAZWA>BADANIA OPERACYJNE</NAZWA> <ADRES>MIELZYNSKIEGO 30</ADRES> 13. Do schematu dodaj informację o atrybucie CZY_PRACOWNICY. W tym celu przejdź do graficznej edycji schematu, kliknij prawym przyciskiem myszy (PPM) na elemencie ZESPOL, wybierz Append child -> Attribute i zmień nazwę utworzonego atrybutu na CZY_PRACOWNICY. Następnie w sekcji Attributes edytora ustaw dla tego atrybutu typ logiczny (Type: xs:boolean). Obejrzyj w trybie edycji tekstu wygenerowaną definicję elementu. 14. Zwaliduj dokument. Następnie, zmień wartość atrybutu na literał brak i ponów walidację dokumentu. Przywróć poprawną wersję dokumentu. 15. Do dokumentu zespoly.xml dodaj, po liście zespołów, datę wygenerowania raportu. Przed znacznikiem zamykającym </ZESPOLY> wprowadź poniższy kod:... <DATA_RAPORTU> </DATA_RAPORTU> </ZESPOLY> 16. Do schematu dodaj definicję atrybutu <DATA_RAPORTU>, po definicji elementu <ZESPOL>. W tym celu, w edytorze graficznym kliknij PPM na elemencie <ZESPOL>, wybierz Insert after -> Element i nazwij element DATA_RAPORTU. Następnie ustaw typ elementu na xs:date i obejrzyj w trybie edycji tekstu wygenerowaną definicję elementu. 17. Zwaliduj dokument. Celowo wprowadź błąd do podanej daty, np. zastąp ją datą 31 lutego Czy walidator znajdzie błąd? Przywróć poprawną formę dokumentu.

5 18. Do każdego zespołu dodaj znacznik reprezentujący adres . Przykładowo, zespół SYSTEMY ROZPROSZONE powinien być reprezentowany w pliku zespoly.xml w następujący sposób: <ZESPOL ID="20"> <NAZWA>SYSTEMY ROZPROSZONE</NAZWA> <ADRES>PIOTROWO 3A</ADRES> < >systemy.rozproszone@cs.put.poznan.pl</ > 19. Dodaj do schematu definicję nowego znacznika i zwaliduj dokument. W tym celu kliknij PPM na elemencie ADRES, wybierz Insert after -> Element, nazwij go . Jako typ elementu wybierz [ST - restriction], a jako typ bazowy (Base Type) xs:string. Następnie w sekcji Facets edytora, w polu Patterns spróbuj samemu wpisać wyrażenie regularne sprawdzające poprawność adresu . Obejrzyj w trybie edycji tekstu wygenerowaną definicję elementu. 20. Przykładowe wyrażenie regularne sprawdzające poprawność adresu ma postać [a-za-z\.]+@([a-za-z0-9]+\.)+[a-za-z]{2,6} 21. Na końcu dokumentu XML, po dacie publikacji raportu, dodaj znacznik przechowujący format raportu. Załóżmy, że raport może przyjmować tylko i wyłącznie formaty: tekstowy, HTML, PDF.... <DATA_RAPORTU> </DATA_RAPORTU> <FORMAT_RAPORTU>pdf</FORMAT_RAPORTU> </ZESPOLY> 22. Dodaj do schematu definicję nowego znacznika i zwaliduj dokument. Kliknij PPM na elemencie <DATA_RAPORTU>, wybierz Insert after -> Element i nazwij go FORMAT_RAPORTU. Jako typ elementu wybierz [ST - restriction], a jako typ bazowy (Base Type) xs:string. Następnie w sekcji Facets edytora, w polu Enumerations dodaj wartości: txt, pdf oraz html. Obejrzyj w trybie edycji tekstu wygenerowaną definicję elementu. 23. Jako wartość atrybutu <FORMAT_RAPORTU> wprowadź doc i zwaliduj dokument. Następnie, przywróć poprawną wersję dokumentu.

6 24. Twój schemat powinien mieć teraz następującą postać: 25. Stwórz plik transform.xsl zawierający kod XSL służący do transformacji dokumentu pracownicy.xml do postaci HTML. Wypełnij plik następującym kodem: <?xml version="1.0" encoding="windows-1250"?> <xsl:stylesheet version="1.0" xmlns:xsl=" xmlns:fo=" <xsl:template match="instytut"> <html> <head> <title>lista pracowników Instytutu Informatyki</title> </head> <body> <xsl:apply-templates/> </body> </html> </xsl:stylesheet>

7 26. Dopisz do pliku pracownicy.xml powiązanie z arkuszem stylistycznym XSL. Jako drugą linijkę pliku pracownicy.xml umieść następujący kod. Następnie, otwórz plik pracownicy.xml w przeglądarce i zaobserwuj wynik. Przeanalizuj źródło zbudowanej strony HT ML. Co się stało ze znacznikami, dla których w arkuszu stylistycznym nie znaleziono reguł? <?xml-stylesheet type="text/xsl" href="transform.xsl"?> 27. Dodaj do arkusza stylistycznego XSL regułę czytającą nazwę instytutu. Odśwież dokument w przeglądarce i zaobserwuj wynik. <xsl:template match="instytut"> <html> <head> <title>lista pracowników Instytutu Informatyki</title> </head> <body> <h1> <xsl:value-of select="@nazwa"/> </h1> <xsl:apply-templates/> </body> </html> 28. Analogicznie, zmodyfikuj szablon dopasowywany do znacznika <INSTYTUT> w taki sposób, aby poprawnie wyświetlić adres i kod instytutu. <xsl:template match="instytut"> <html> <head> <title>lista pracowników Instytutu Informatyki</title> </head> <body> <h1> <xsl:value-of select="@nazwa"/> </h1> <h2> <xsl:value-of select="@ulica"/> </h2> <h2> <xsl:value-of select="@kod"/> <xsl:value-of select="@miasto"/> </h2> <xsl:apply-templates/> </body> </html> 29. Poniżej kodu pocztowego i nazwy miasta dodaj fragment statycznego tekstu:... </h2> <xsl:text>poniżej znajduje się lista zespołów wraz pracownikami każdego zespołu</xsl:text>

8 30. Dodaj szablon dopasowujący się do znacznika <ZESPOL> i zaobserwuj działanie szablonu w przeglądarce. <xsl:template match="zespol"> <div class="zespol"> <xsl:number/>.<xsl:value-of select="nazwa"/> <table> <xsl:attribute name="border">1</xsl:attribute> <tr> <th>id</th><th>nazwisko</th><th>etat</th><th>placa</th> </tr> <xsl:apply-templates select="pracownicy"/> </table> </div> 31. Dodaj szablon dopasowujący się do znacznika <PRACOWNIK> i zaobserwuj działanie szablonu w przeglądarce. <xsl:template match="pracownik"> <tr> <td><xsl:value-of select="@id_prac"/></td> <td><xsl:value-of select="nazwisko"/></td> <td><xsl:value-of select="etat"/></td> <td><xsl:value-of select="placa"/></td> </tr> 32. W kolejnym kroku ukryjemy tabelkę dla tych zespołów, które nie zatrudniają żadnych pracowników. Zamiast tabelki pojawi się napis Brak pracowników. Zmodyfikuj szablon dopasowywany do elementu <ZESPOL> w następujący sposób: <xsl:template match="zespol"> <div class="zespol"> <xsl:number/>.<xsl:value-of select="nazwa"/> <xsl:choose> <xsl:when test="pracownicy"> <table> <xsl:attribute name="border">1</xsl:attribute> <tr> <th>id</th><th>nazwisko</th><th>etat</th><th>placa</th> </tr> <xsl:apply-templates select="pracownicy"/> </table> </xsl:when> <xsl:otherwise> <br/><em>brak pracowników</em> </xsl:otherwise> </xsl:choose> </div>

9 33. Kolejnym krokiem będzie podświetlenie pracowników zatrudnionych na etacie asystenta kolorem błękitnym. Zmodyfikuj szablon dopasowywany do znacznika <PRACOWNIK> w następujący sposób: <xsl:template match="pracownik"> <tr> <xsl:if test="etat='asystent'"> <xsl:attribute name="bgcolor">#addfff</xsl:attribute> </xsl:if> <td><xsl:value-of select="@id_prac"/></td> <td><xsl:value-of select="nazwisko"/></td> <td><xsl:value-of select="etat"/></td> <td><xsl:value-of select="placa"/></td> </tr> 34. W przypadku, gdy ten sam węzeł musi być wielokrotnie przetwarzany przez szablon, można posłużyć się atrybutem MODE w celu kontrolowania kolejności aplikacji szablonów. W tym ćwiczeniu poniżej listy zespołów umieścimy listę asystentów. Zauważ, że wymaga to wielokrotnego odwiedzenia węzłów <PRACOWNIK>, raz w trakcie generowania listy pracowników zespołu, a drugi raz w celu wygenerowania osobnej listy asystentów. Dodaj nowy szablon: <xsl:template match="zespoly" mode="lista_asystentow"> <h3>lista asystentów</h3> <ul> <xsl:for-each select="//pracownik"> <xsl:if test="etat='asystent'"> <li><xsl:value-of select="nazwisko"/></li> </xsl:if> </xsl:for-each> </ul> 35. Sprawdź, czy szablon jest uwzględniany podczas generacji. Dodaj do szablonu dopasowywanego do elementu <INSTYTUT> jawne wywołanie szablonów działających w trybie lista asystentów.... <xsl:apply-templates/> <xsl:apply-templates mode="lista_asystentow"/> </body> </html>

10 zadanie opcjonalne 36. Ostatnim krokiem będzie wykorzystanie parsera Xalan-Java. Pobierz parser ze strony Rozpakuj archiwum do katalogu, w którym prowadzisz ćwiczenie. Dodaj ścieżkę do głównego archiwum parsera do zmiennej systemowej CLASSPATH i wygeneruj wynikowy kod HTML bezpośrednio do pliku. Pełna dokumentacja opcji parsera dostępnych z linii poleceń znajduje się tutaj: C:\> set CLASSPATH=xalan-j_2_7_0/xalan.jar;%CLASSPATH% C:\>java org.apache.xalan.xslt.process -IN pracownicy.xml -XSL transform.xsl -OUT pracownicy.html