Crearea extensiilor pentru Tracy

Un depozit de extensii gata făcute pentru Tracy poate fi găsit la Componette.

Extensii pentru Tracy Bar

Crearea unei noi extensii pentru Tracy Bar nu este complicată. Creați un obiect care implementează interfața Tracy\IBarPanel, care are două metode getTab() și getPanel(). Metodele trebuie să returneze codul HTML al tab-ului (eticheta mică afișată direct pe Bar) și al panoului. Dacă getPanel() nu returnează nimic, se va afișa doar eticheta. Dacă getTab() nu returnează nimic, nu se va afișa nimic și nici getPanel() nu va mai fi apelată.

class ExamplePanel implements Tracy\IBarPanel
{
	public function getTab()
	{
		return /* ... */;
	}

	public function getPanel()
	{
		return /* ... */;
	}
}

Înregistrare

Înregistrarea se face folosind Tracy\Bar::addPanel():

Tracy\Debugger::getBar()->addPanel(new ExamplePanel);

Sau puteți înregistra panoul direct în configurația aplicației:

tracy:
	bar:
		- ExamplePanel

Codul HTML al tab-ului

Ar trebui să arate aproximativ așa:

<span title="Etichetă explicativă">
	<svg>...</svg>
	<span class="tracy-label">Titlu</span>
</span>

Imaginea ar trebui să fie în format SVG. Dacă descrierea explicativă nu este necesară, <span> cu atributul title poate fi omis.

Codul HTML al panoului

Ar trebui să arate aproximativ așa:

<h1>Titlu</h1>

<div class="tracy-inner">
<div class="tracy-inner-container">
	... conținut ...
</div>
</div>

Titlul ar trebui să fie fie același cu titlul tab-ului, fie poate conține informații suplimentare.

Trebuie luat în considerare faptul că o extensie se poate înregistra de mai multe ori, de exemplu cu setări diferite, deci pentru stilizare nu se pot folosi id-uri CSS, ci doar clase, în formatul tracy-addons-<NumeClasa>[-<optional>]. Clasa se scrie apoi în div împreună cu clasa tracy-inner. La scrierea CSS, este util să scrieți #tracy-debug .clasa, deoarece regula va avea o prioritate mai mare decât resetarea.

Stiluri implicite

În panou sunt prestilizate <a>, <table>, <pre>, <code>. Dacă doriți să creați un link care ascunde și afișează un alt element, conectați-le prin atributele href și id și clasa tracy-toggle:

<a href="#tracy-addons-NumeClasa-{$counter}" class="tracy-toggle">Detalii</a>

<div id="tracy-addons-NumeClasa-{$counter}">...</div>

Dacă starea implicită trebuie să fie restrânsă, adăugați ambelor elemente clasa tracy-collapsed.

Folosiți un contor static pentru a evita crearea de ID-uri duplicate pe aceeași pagină.

Extensii pentru Bluescreen

În acest mod se pot adăuga vizualizări personalizate ale excepțiilor sau panouri care se afișează pe bluescreen.

Extensia se creează cu această comandă:

Tracy\Debugger::getBlueScreen()->addPanel(function (?Throwable $e) { // excepția capturată
	return [
		'tab' => '...Etichetă...',
		'panel' => '...Cod HTML al panoului...',
	];
});

Funcția este apelată de două ori, mai întâi în parametrul $e este transmisă excepția însăși și panoul returnat se desenează la începutul paginii. Dacă nu returnează nimic, panoul nu se desenează. Apoi este apelată cu parametrul null și panoul returnat se desenează sub callstack. Dacă funcția returnează în array cheia 'bottom' => true, panoul se desenează complet jos.