Generator mikropodsumowań jest to zestaw instrukcji do tworzenia mikropodsumowania na bazie treści strony WWW. Strony WWW mogą odwoływać się do generatorów przez elementy <link rel="microsummary">
w elementach <head>
. Generatory mogą także być niezależnie pobierane i instalowane przez użytkowników, jeśli zawierają listę stron z którymi współpracują.
W tym kursie zajmiemy się tworzeniem generatora mikropodsumowań dla strony domowej Spread Firefox, która wyświetla aktualną liczbę pobrań Firefoksa i podaje ją wraz z tekstem Pobrań Firefoksa:; na przykład: Pobrań Firefoksa: 174475447.
Stworzymy arkusz transformacji XSLT, który przekonwertuje stronę w jej mikropodsumowanie, nauczymy się określać z jakimi stronami pracuje generator i jak przystosować go do pobierania i instalacji.
W każdym kroku tworzenia arkusza transformacji oraz innych elementów kodu w tym kursie, nowy materiał będzie pogrubiony, aby ułatwić Ci poruszanie się po tekście.
Początki
Generatory są to dokumenty XML, których korzeniem (root element) jest element <generator>
w przestrzeni nazw https://www.mozilla.org/microsummaries/0.1. Aby rozpocząć tworzenie generatora, stwórz nowy, pusty plik tekstowy i dodaj deklarację XML oraz pusty znacznik <generator>
:
<?xml version="1.0" encoding="UTF-8"?>
<generator xmlns="https://www.mozilla.org/microsummaries/0.1">
</generator>
Nadawanie nazwy
Generatory powinny posiadać atrybut name
opisujący mikropodsumowania, które te generatory tworzą. Nazwy powinny być wystarczająco dokładne, aby użytkownik miał świadomość jakie dane to mikropodsumowanie dostarcza. Ponieważ nasz generator będzie tworzył mikropodsumowania wyświetlające liczbę pobrań Firefoksa, nazwijmy je "Liczba pobrań Firefoksa":
<?xml version="1.0" encoding="UTF-8"?>
<generator xmlns="https://www.mozilla.org/microsummaries/0.1"
name="Liczba pobrań Firefoksa">
</generator>
Dodawanie arkusza transformacji XSLT
Generatory muszą zawierać arkusze transformacji XSLT (znane także jako arkusze XSLT), które transformują treść strony w mikropodsumowanie. XSLT jest potężnym językiem do transformacji dokumentów w inne formy prezentacji tych samych danych.
Dodaj arkusz transformacji XSLT do generatora, poprzez dołączenie go wewnątrz elementu <template>
:
<?xml version="1.0" encoding="UTF-8"?> <generator xmlns="https://www.mozilla.org/microsummaries/0.1" name="Liczba pobrań Firefoksa"> <template> <transform xmlns="https://www.w3.org/1999/XSL/Transform" version="1.0"> </transform> </template> </generator>
Zwróć uwagę, że chociaż generatory mikropodsumowań mogą obsługiwać dowolny XSLT, także taki, który tworzy sformatowany tekst, Firefox aktualnie obsługuje tylko czysty tekst jako wynik przetwarzania XSLT.
Określanie typu wyjścia
Jako, że arkusz transformacji XSLT ma tworzyć tekst mikropodsumowania, powinniśmy dodać element <output>
XSLT:
<?xml version="1.0" encoding="UTF-8"?> <generator xmlns="https://www.mozilla.org/microsummaries/0.1" name="Liczba pobrań Firefoksa"> <template> <transform xmlns="https://www.w3.org/1999/XSL/Transform" version="1.0"> <output method="text"/> </transform> </template> </generator>
Użycie prostego XSLT <template>
Procesor XSLT transformuje dokumenty porównując każdy element <template>
w arkuszu transformacji ze zbiorem węzłów w dokumencie. Kiedy atrybut match
elementu <template>
pasuje do węzła, procesor wykonuje transformację określoną przez zawartość tego elementu.
Jest to potężny mechanizm, ponieważ pozwala trawersować drzewo węzłów dokumentu, rekursywnie tworząc wyjście bazujące na zawartości samego dokumentu. Ale w naszym przypadku, kiedy tworzymy mikropodsumowanie dla strony Spread Firefox, potrzebujemy tylko jednego elementu <template>
, który pasuje do korzenia (root node) dokumentu i jest wykonywany raz:
<?xml version="1.0" encoding="UTF-8"?> <generator xmlns="https://www.mozilla.org/microsummaries/0.1" name="Liczba pobrań Firefoksa"> <template> <transform xmlns="https://www.w3.org/1999/XSL/Transform" version="1.0"> <output method="text"/> <template match="/"> </template> </transform> </template> </generator>
Dołączanie licznika pobrań
Aby dołączyć licznik pobrań do wyjścia arkusza transformacji XSLT, musimy dodać element <value-of>
do szablonu. Atrybut select
tego elementu zawiera wyrażenie XPath, które wskazuje na węzeł zawierający liczbę pobrań.
XPath jest językiem służącym do identyfikacji węzłów w dokumentach HTML/XML. Posiada także podstawowe funkcje do manipulacji tymi węzłami i ich zawartością. Najłatwiej stworzyć wyrażenie XPath, które wskazuje na węzeł, który chcesz uchwycić, korzystając z rozszerzenia XPath Checker.
Zainstaluj to rozszerzenie (uruchamiając ponownie Firefoksa, aby zakończyć instalację), a następnie wejdź na stronę Spread Firefox, znajdź licznik pobrań Firefoksa (duża liczba na górze strony w prawej kolumnie), kliknij prawym klawiszem myszy na tym elemencie i z menu kontekstowego wybierz View XPath (Pokaż XPath).
XPath Checker otworzy nowe okno. Będzie w nim pole XPath zawierające wyrażenie XPath wskazujące na węzeł licznika pobrań: id('download-count').
Dodaj element <value-of>
do elementu <template>
. Ustaw atrybut select
tego elementu na wyrażenie XPath:
<?xml version="1.0" encoding="UTF-8"?> <generator xmlns="https://www.mozilla.org/microsummaries/0.1" name="Licznik pobrań Firefoksa"> <template> <transform xmlns="https://www.w3.org/1999/XSL/Transform" version="1.0"> <output method="text"/> <template match="/"> <value-of select="id('download-count')"/> </template> </transform> </template> </generator>
Dodawanie tekstu
Aby dodać napis Pobrań Firefoksa:> do mikropodsumowania, potrzebujemy do elementu <template>
dodać element <text>
zawierający wybrany napis.
Dodaj element <text>
do szablonu XSLT z treścią Pobrań Firefoksa::
<?xml version="1.0" encoding="UTF-8"?> <generator xmlns="https://www.mozilla.org/microsummaries/0.1" name="Licznik pobrań Firefoksa"> <template> <transform xmlns="https://www.w3.org/1999/XSL/Transform" version="1.0"> <output method="text"/> <template match="/"> <text>Pobrań Firefoksa: </text> <value-of select="id('download-count')"/> </template> </transform> </template> </generator>
Zwróć uwagę, że, w odróżnieniu od języka HTML, gdzie białe znaki są prezentowane w postaci pojedynczej spacji, przestrzeń między znacznikami XSLT nie zostanie włączona do wyjścia XSL. Pamiętaj, aby dodać spację na końcu, wewnątrz znacznika, aby oddzielić napis od liczby.
Po tej zmianie, właśnie skończyliśmy pisać arkusz transformacji XSLT, który konwertuje stronę domową Spread Firefox do postaci mikropodsumowania.
Określanie listy stron na których generator działa
Teraz, kiedy napisaliśmy już arkusz transformacji, musimy określić do jakich stron on pasuje. Gdybyśmy byli twórcami strony Sread Firefox, moglibyśmy po prostu dodać odnośnik do generatora wewnątrz samej stron, dodając znacznik <link rel="microsummary">
w sekcji <head>
:
<head> ... <link rel="microsummary" href="path/to/our/generator.xml"> </head>
Niestety, nie jesteśmy nimi. Możemy jednak określić stronę z która generator współpracuję wewnątrz samego generatora, a następnie udostępnić nasz generator do pobrania i instalacji innym. Aby określić strony, na których generator działa, należy użyć elementu <pages>
wewnątrz elementu <generator>
:
<?xml version="1.0" encoding="UTF-8"?> <generator xmlns="https://www.mozilla.org/microsummaries/0.1" name="Licznik pobrań Firefoksa"> <template> <transform xmlns="https://www.w3.org/1999/XSL/Transform" version="1.0"> <output method="text"/> <template match="/"> <text>Pobrań Firefoksa </text> <value-of select="id('download-count')"/> </template> </transform> </template> <pages> </pages> </generator>
Element <pages>
może zawierać dowolną liczbę elementów <include>
oraz <exclude>
, określających strony na których, generator, odpowiednio, działa, lub nie działa.
Aby sprawić, by generator działał na danej stronie, dodaj element <include>
, i jako zawartość podaj mu wyrażenie regularne pasujące do adresu tej strony. Aby określić, że generator nie pracuje z daną stroną, dodaj element <exclude>
i jako zawartość podaj wyrażenie regularne pasujące do adresu strony.
Domyślnie, generatory nie pracują z żadną stroną, więc musisz bezpośrednio określić listę stron, z którymi współpracują, i nie musisz wyłączać żadnych stron, chyba, że wcześniej je włączyłeś.
Dodaj element <include>
pasujący do strony domowej Spread Firefox:
<?xml version="1.0" encoding="UTF-8"?> <generator xmlns="https://www.mozilla.org/microsummaries/0.1" name="Licznik pobrań Firefoksa"> <template> <transform xmlns="https://www.w3.org/1999/XSL/Transform" version="1.0"> <output method="text"/> <template match="/"> <text>Pobrań Firefoksa </text> <value-of select="id('download-count')"/> </template> </transform> </template> <pages> <include>https://(www\.)?spreadfirefox\.com/(index\.php)?</include> </pages> </generator>
Udostępnianie generatora do pobrania
Kiedy nasz generator działa już ze stroną Spread Firefox, ostatnią rzeczą, jaka nam pozostała, to sprawić, aby można go było pobrać. Aby to zrobić, musimy postawić stronę WWW i stworzyć odnośnik JavaScript na tej stronie, który wywoła metodę Firefoksa window.sidebar.addMicrosummaryGenerator(), aby pobrać i zainstalować generator.
Na przykład, jeśli wystawisz plik generatora w sieci pod adresem https://people.mozilla.com/~myk/micro...-generator.xml, i chcesz, aby użytkownicy mogli go zainstalować z https://people.mozilla.com/~myk/micro...ial/index.html, musisz dodać poniższy kod do pliku index.html page:
<a href="javascript:window.sidebar.addMicrosummaryGenerator('https://people.mozilla.com/~myk/microsummaries/tutorial/sfx-generator.xml')">Zainstaluj mikropodsumowanie strony domowej Spread Firefox!</a>
Niestety, naciśnięcie tego odnośnika w przeglądarkach nie obsługujących mikropodsumowań, wywoła błąd JavaScript, więc, aby to poprawić, powinniśmy sprawdzić, czy użytkownik korzysta z przeglądarki obsługującej mikropodsumowania i wyświetlić wyjaśnienie jeśli nie. Może to wyglądać na przykład tak:
<script>
const warning = "Ups! Potrzebujesz przeglądarki obsługującej mikropodsumowania jak Firefox 2.0, aby zainstalować i używać generatorów mikropodsumowań.";
function addGenerator(url) {
if (typeof window.sidebar == "object" &&
typeof window.sidebar.addMicrosummaryGenerator == "function")
window.sidebar.addMicrosummaryGenerator(url);
else
alert(warning);
}
</script>
<a href="javascript:addGenerator('https://people.mozilla.com/~myk/microsummaries/tutorial/sfx-generator.xml')">Zainstaluj mikropodsumowanie strony domowej Spread Firefox!</a>
Uwaga. Ze względu na błąd błąd 341283, addMicrosummaryGenerator() nie akceptuje relatywnych adresów URL.
Podsumowanie
Powinieneś mieć teraz generator mikropodsumowań, który wyświetla aktualną liczbę pobrań Firefoksa. Dodaj stronę domową Spread Firefox do zakładek i wybierz mikropodsumowanie z rozwijanego menu Podsumowanie w oknie dialogowym Dodaj zakładkę.
Aby dowiedzieć się więcej o Mikropodsumowaniach, zajrzyj na stronę domową Mikropodsumowań (en).