Makro pro tlačítko – problém s parametry

bluray

Dobrý den, chci si vytvořit makro pro div, který bude zobrazovat tlačítko:

<div class="btn btn-success">Odeslat</div>

Vytvořil jsem si tedy makro:

public function buttonStart(MacroNode $macroNode, PhpWriter $phpWriter){
return $phpWriter->write('
                    if ($_l->tmp = array_filter(%node.array))
                    echo \'<div class="btn btn-success\'. %escape(implode(" ", array_unique($_l->tmp))) . \'">\'
               ');
}

Momentálně to funguje tak, že mohu do parametru class přidávat další třídy. V latte to vypadá takto:

{btnSuccess pokusCssTrida} Odeslat {/btnSuccess}

Vygeneruje se:

<div class="btn btn-success pokusCssTrida">Odeslat</div>

Já bych ale chtěl mít možnost tomu divu nastavovat další parametry např:

{btnSuccess class="pokusCssTrida" id="tlacitko"}Odeslat{/btnSuccess}

Vygeneruje se:

<div class="btn btn-success pokusCssTrida" id="tlacitko">Odeslat</div>

Popřípadě třeba složitější případ:

{btnSuccess class="pokusCssTrida" id="tlacitko" icon="fa-home"}Odeslat{/btnSuccess}

By vygeneroval:

<div class="btn btn-success pokusCssTrida" id="tlacitko"><i class="fa fa-home"></i>Odeslat</div>

Nevím jak pořádně pracovat s parametry toho latte makra. node.array mi nevrátí klasické pole ale string formátovaný jako pole. S tím se nepracuje moc dobře, kdybych dostal pole [pokusCssTrida, id=>tlacitko] tak se s tím bude pracovat lépe. další věc je jak to programovat. do metody PhpWriter::write vstupuje string, to se dost blbě programuje když musím řešit spoustu escapování a v řetězci mi IDE nenapovídá. jak to řešíte vy? Ale to už je detail, největší problém mám se zpracováním těch parametrů. Nemůžu si třeba nějak pomoci třídou Nette\Utils\Html?

Děkuji za pomoc

greeny

Myslím že by mohlo fungovat něco takového (psáno z hlavy, možná tam budou chyby):

$phpWriter->write("\$_el = \Nette\Utils\Html::el('div', ['class' => 'btn btn-success']); \$_el->addAttributes(%node.array); echo \$_el;");

A použití:

{btnSuccess [class => myClass, id => myId]}Success{/btn}

Ale IMHO je tohle už trochu overkill. Makra by měly zvyšovat přehlednost kódu, ale když máš čisté HTML, tak tam to vůbec nevadí. Na tvém místě bych si ty tlačítka psal ručně, zas tolik práce to není a IDE ti bude napovídat mnohem lépe než v případě maker.

bluray

To je další věc kterou bych rád prodiskutoval. Zkouším pracovat s Bootstrapem a dělá mi problém zapamatovat si spoustu tříd které tam jsou. Pro tlačítko je to třída btn která má ale dalších 6 variant pro různé barvy. myslím si že je jednodušší napsat {btnSuccess} než rozepisovat celý div. Většinou tam nikdy žádné parametry navíc nebudou šlo mi jenom o to kdyby byly potřeba tak aby tam pro ně byla podpora. tvůj kod vyzkouším.

Pavel Kravčík

Pamatovat si je nemusíš. Buď se podíváš do jejich dokumentace, která je hodně pěkně a přehledně zpracovaná a nebo můžeš použít nápovědu IDE (ctrl+space většinou). A ty názvy jsou dost vypovídající btn-block, btn-xs.

A možná si tím trochu uškodíš do budoucna. Jednoduchou změnou se dají dopsat nové barvy a styly. Takže například používáme btn-purple, btn-pink apod. :)

David Kudera

Myslím, že tohle není tak úplně zamýšlený způsob využití maker. Jasně, u inputů to funguje, ale to jsou form makra a jinak jednoduše by to asi ani nešlo…

Jinak ale btn btn-success mi nepřijde o moc složitější než {btnSuccess. Navíc mi to IDE pěkně obarví :-)

Ale taky mám asi na 2 místech v aplikaci podobně udělaná tlačítka. Jen ne přes makra, ale přes komponenty. Tyhle moje tlačítka můžou být totiž v různých stavech, mají různé signály a jsou na více místech webu. Pak mám třeba pro oblíbené položky {control favoriteButton, $book}.

greeny

Pokud budeš používat bootstrap nějak častěji, tak zjistíš, že ty třídy jsou vlastně docela jednoduchý.

Vždycky máš základní třídu (např. btn, alert, …) a k ní máš barevné modifikátory (btn-success, alert-danger, …). Ty barevné modifikátory jsou všude stejné a jak si řekl, je jich 6 (success, warning, danger, info, primary, default). Myslím, že čas strávený učením se těchto 6 barev je mnohonásobně menší než čas strávený psaním toho makra :P navíc když máš v názvu makra tu barvu (success), tak už se jí musíš naučit stejně :P

bluray

Tak už se mi to podařilo dostat do skoro funkčního stavu. jenom poslední detail:

$el = Html::el('div class="btn btn-success"');
$el->addAttributes(['class' => 'pokus']);

Vygeneruje toto:

<div class="pokus"></div>

vitkutny

$el = Html::el('div class="btn btn-success"');

přidá attributy

[
	'class' => 'btn btn-success'
]

je lepší vytvořit přímo jako pole

		$el = Html::el('div', ['class' => ['btn', 'btn-success']]);

[
	'class' => [
		'btn',
		'btn-success'
	]
]

a poté můžeš přidávat jednodušše

$el->attrs['class'][] = 'pokus';

addAttributes nelze použít jelikož používá array_merge, nikoli array_merge_recursive

bluray

Děkuji za pomoc, už to funguje.