Crearea extensiilor Tracy

Puteți găsi extensii utile pentru Tracy pe Componette.

Extensii pentru bara Tracy

Crearea unei noi extensii pentru Tracy Bar este simplă. Trebuie să implementați interfața Tracy\IBarPanel cu metodele getTab() și getPanel(). Metodele trebuie să returneze codul HTML al unei file (eticheta mică de pe Tracy Bar) și al unui panou (pop-up afișat după ce se face clic pe filă). Dacă getPanel() nu returnează nimic, va fi afișată doar fila. Dacă getTab() nu returnează nimic, nu se afișează nimic și getPanel() nu va fi apelată.

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

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

Înregistrare

Înscrierea se face prin apelarea Tracy\Bar::addPanel():

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

sau vă puteți înregistra pur și simplu panoul în configurația aplicației:

tracy:
	bar:
		- ExamplePanel

Tab Cod HTML

Ar trebui să arate ceva de genul acesta:

<span title="Explaining tooltip">
	<svg>...</svg>
	<span class="tracy-label">Title</span>
</span>

Imaginea trebuie să fie în format SVG. Dacă nu aveți nevoie de tooltip, puteți lăsa <span> afară.

Codul HTML al panoului

Ar trebui să arate ceva de genul acesta:

<h1>Title</h1>

<div class="tracy-inner">
<div class="tracy-inner-container">
	... content ...
</div>
</div>

Titlul ar trebui să fie același cu cel din fila sau să conțină informații suplimentare.

O extensie poate fi înregistrată de mai multe ori, astfel încât se recomandă să nu se utilizeze atributul id pentru stilizare. Puteți utiliza clase, de preferință în tracy-addons-<class-name>[-<optional>] format. Atunci când creați CSS, este mai bine să utilizați #tracy-debug .class, deoarece o astfel de regulă are o prioritate mai mare decât resetarea.

Stiluri implicite

În panou, elementele <a>, <table>, <pre>, <code> au stiluri implicite. Pentru a crea o legătură pentru a ascunde sau afișa un alt element, conectați-le cu atributele href și id și clasa tracy-toggle.

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

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

În cazul în care starea implicită este colapsată, adăugați clasa tracy-collapsed la ambele elemente.

Utilizați un contor static pentru a preveni duplicarea ID-urilor pe o pagină.

Extensii Bluescreen

Puteți adăuga propriile vizualizări de excepție sau panouri, care vor apărea pe ecranul albastru.

Extensia este realizată astfel:

Tracy\Debugger::getBlueScreen()->addPanel(function (?Throwable $e) { // excepție capturată
	return [
		'tab' => '...Title...',
		'panel' => '...content...',
	];
});

Funcția este apelată de două ori, mai întâi excepția însăși este trecută în parametrul $e, iar panoul returnat este redat la începutul paginii. Dacă nu se returnează nimic, panoul nu este redat. Apoi este apelată cu parametrul null, iar panoul returnat este redat sub callstack. Dacă funcția returnează 'bottom' => true în matrice, panoul este redat chiar în partea de jos a paginii.