Szablon:Diagram

Z Terraria Wiki
Przejdź do nawigacji Przejdź do wyszukiwania
This template uses Lua.
Ten szablon wykorzystuje Moduł:Diagram, będący skryptem napisanym w języku programowania Lua. Aby lepiej zapoznać się z tym językiem odwiedź podane strony Terraria Wiki:Lua (en).
Template-info.svg Dokumentacja Poniższa dokumentacja jest załączona do Szablon:Diagram/doc. (edytuj | historia)

Jest to szablon do renderowania prostych diagramów składających się z ramek i linii łączących, takich jak drzewo genealogiczne oparte na składni ASCII. Drzewa są wyświetlane jako tabele HTML z wykorzystaniem atrybutów CSS i mogą zawierać dowolne znaczniki wiki w obrębie pól.

Szablon został pierwotnie przeniesiony z Template:Family tree on The Witcher Wiki przez Rye Greenwood. Aby dostosować go do potrzeb Terraria Wiki, Westgrass całkowicie go przepisał, poprawiając działanie i znacznie optymalizując wydajność.

Należy pamiętać, że niektóre symbole rysowania linii różnią się od oryginału.

Parametry

Do opisania ogólnego układu drzewa należy użyć parametru |summary=text. To streszczenie dotyczy accessibility: czytane jest na głos czytelnikom niedowidzącym, którzy korzystają z czytania z ekranu i jest niewidoczne dla widzących czytelników.

Układ

Wszystkie nienazwane parametry opisują zawartość tabeli diagramów. Każdy parametr określa kafelków lub pudełko.

  • Kafelki to symbole do rysowania linii składające się z linii poziomych i pionowych oraz ich różnych narożników i skrzyżowań. Kafelki są określane za pomocą symboli jednoznakowych, które mniej więcej przypominają wyglądem kafelki.

Istnieją specjalne przypadki:

    • Pusty kafelek, określony przez wprowadzenie pustych parametrów (pusty ciąg lub spacje ). Zostanie po prostu zignorowany i nie wytworzy żadnej komórki.
    • Kafelek przestrzenny określony przez znak _, 0 lub O. Wytworzy komórkę przestrzenną, która nie zawiera zawartości, ale zajmuje przestrzeń komórkową, podobnie jak inne komórki.
    • Nowy wiersz określony przez znak #. Kończy bieżący wiersz i rozpoczyna kolejny wiersz przy następnym parametrze.

Tabela obsługiwanych płytek znajduje się poniżej.

Linie ciągłe:
,
v
.
6
)
+
(
9
`
^
'
&
-
I
_
?
Linie przerywane:
F
V
7
;
D
X
C
"
L
A
J
a
~
:
0
e
Łączone (1):
r
y
n
]
$
[
c
h
j
Łączone (2):
p
u
q
E
x
3
b
t
d
Łączone (3):
/
Y
\
B
O
G
R
U
4
Łączone (4):
i
M
!
W
<
2
>
5
Łączone (5):
P
H
f
g
K
N
k
s
T
Z
o
m
S
Q
w
z
  • Pudełka mogą zawierać dowolne znaczniki wiki. Zawartość pól jest określana za pomocą dodatkowych nazwanych parametrów dołączanych do wywołania szablonu. Pola mogą mieć dowolną nazwę, która jest prawidłową nazwą parametru szablonu, chociaż można uniknąć nazw pojedynczych znaków, aby zapobiec konfliktom z symbolami kafelków.

Każde pudełko ma domyślnie szerokość 3 kafelków i 1 wysokość kafelków i zwykle ma niebieską ramkę o szerokości 2 pikseli. Rozmiar pudełka można zmienić w następujący sposób:

{{diagram
|_| FOO |~|~|y|~| BAR |_|#
|_|_|,|-|-|-|^|-|-|.|_|_|#
|_|_|I|_|_|_|_|   BAR2  |#
|  FOO2 |_|_|_|         |#
|_|_|_|_|_|_|_|         |#
|FOO=Pudełko 1
|BAR=Pudełko 2
|FOO2=Pudełko 3
|FOO2_cols = 4
|BAR2=Pudełko 4
|BAR2_cols = 5
|BAR2_rows = 3
}}

which produces a result like this:

Pudełko 1Pudełko 2
Pudełko 4
Pudełko 3

Uwaga: Jeśli utworzysz komórkę zawierającą wiele wierszy, musisz umieścić nazwę pola w pierwszym wierszu.

Style

Opcjonalne parametry |style=, |class= i |id= mogą być użyte do ustawienia stylów/klas/identyfikatorów CSS dla samej tabeli diagramów.

Wygląd pól może być kontrolowany przez opcjonalny parametr |boxstyle=. Służy on do dołączania dowolnych deklaracji CSS bezpośrednio do atrybutów stylu pudełka. Na przykład następujący kod:

{{diagram
|summary=Pudełko 1 połączona z pudełkiem 2, połączone z dziećmi pudełko 3 i pudełko 4

|boxstyle=background:#dfd; color:#000;

|_| FOO |y| BAR |_|#
|_|_|,|-|^|-|.|_|_|#
|_| FOO2|_| BAR2|_|#

|FOO=Pudełko 1|BAR=Pudełko 2
|FOO2=Pudełko 3|BAR2=Pudełko 4
}}

zwróci wynik podobny do tego:

Pudełko 1Pudełko 2
Pudełko 3Pudełko 4

Atrybuty stylu można nawet ustawić dla poszczególnych pól, jak w poniższym przykładzie:

{{diagram
|summary = Białe pudełko z trójką dzieci: Czerwone pudełko, Zielone pudełko, Niebieskie pudełko, wszystkie są ze sobą w połączone

|_|_|_|_|WHITE|_|_|_|_|#
|_|,|-|-|'|!|`|-|-|.|_|#
| RED |~|GREEN|~|BLUE |#

|WHITE= Białe pudełko
|WHITE_boxstyle = background-color: #fff; color:#000;

|RED = Czerwone pudełko
|RED_boxstyle   = background-color: #faa; color:#000;

|GREEN = Zielone pudełko
|GREEN_boxstyle = background-color: #afa; color:#000;

|BLUE = Niebieskie pudełko
|BLUE_boxstyle  = background-color: #aaf; color:#000;
}}

zwróci wynik podobny do tego:

Białe pudełko
Czerwone pudełkoZielone pudełkoNiebieskie pudełko

Możesz także przypisać CSS według klasy/identyfikatora, w następujący sposób:

{{diagram
|summary = Białe pudełko z trójką dzieci: Czerwone pudełko, Zielone pudełko, Niebieskie pudełko, wszystkie są ze sobą w połączone

|_|_|_|_|WHITE|_|_|_|_|#
|_|,|-|-|'|!|`|-|-|.|_|#
| RED |~|GREEN|~|BLUE |#

|boxclass = box

|WHITE = Białe pudełko
|WHITE_id = white-box | WHITE_class = type-A

|RED = Czerwone pudełko
|RED_class = box-red

|GREEN = Zielone pudełko
|GREEN_class = type-A box-green

|BLUE = Niebieskie pudełko
|BLUE_class = type-B box-blue
}}

oraz CSS:

.box{
  /* dla wszystkich pudełek */
}
.type-A{
  /* style dla wszystkich pudełek typu-A */
}
.type-B{
  /* style dla wszystkich pudełek typu-B */
}
#white-box{
  /* style dla BIAŁYCH */
}
.box-red{
  /* style dla CZERWONYCH */
}
.box-green{
  /* style dla ZIELONYCH */
}
.box-blue{
  /* style dla NIEBIESKICH */
}

Uwaga: Sam diagram zawsze będzie miał klasę .diagram, a wszystkie pola na diagramach zawsze będą miały klasę .diagram-box.

Przykład użycia

Kod:

{{diagram
|summary=Mam brata Stasia i młodszą siostrę: moja mama poślubiła mojego tatę, a rodzicami mojego taty byli Stefan i Joanna; mieli kolejne dziecko, ciocię Karolinę.

|_|_|_| GMa |~|y|~| GPa |_|#
|_|_|_|_|_|_|_|)|-|-|-|.|_|#
|_|_| MOM |y| DAD |_|DAISY|#
|_|,|-|-|-|+|-|-|-|.|_|_|_|#
| JOE |_| ME  |_| SIS |_|_|#

|GMa=Stefan
|GPa=Joanna
|JOE=Mój brat Staś
|ME='''Ja!'''
|SIS=Moja młodsza siostra
|MOM=Mama
|DAD=Tata
|DAISY=[[Nimfa|Ciocia Karolina]]
}}

zwróci następujący wynik:

StefanJoanna
MamaTataCiocia Karolina
Mój brat StaśJa!Moja młodsza siostra