Drab v0.7.2 Release Notes
-
๐ New Features
use Drab.Controller
is now optional0๏ธโฃ When using default commander name, corresponding to the controller (like PageCommander -> PageController), there is no need to mark controller as
Drab.Controller
anymore.Shared Commanders should be declared in the page controller
All shared commanders must be explicitly declared in the controller:
use Drab.Controller, commanders: [My.Shared.Commander]
โ In this version, system generates warning message if commanders are not declared. This warning will become error in v0.8.0
defhandler
macro for creating event handlers in commandersSince this version, all event handlers, whenever they are in shared or "normal" commander, must be declared with
public
ordefhandler
macro. Usedefhandler
instead of the standarddef
.This:
public :button_clicked def button_clicked(socket, sender), do: ...
is an equivalent of:
defhandler button_clicked(socket, sender), do: ...
โ In this version, system generates warning message if the function is not declared as handler. This warning will become error in v0.8.0
Create Reusable Drab Components with Shared Commanders
โก๏ธ Accomplished this with the new
Drab.Core.this_commander/1
function, returning the unique selector of the sourrounding commander tag, so you may easly reduce the region where your update works.โก๏ธ Having the page as below, we want the button to update
.spaceholder1
only within the range ofdrab-commander
.<div drab-commander="DrabTestApp.Shared1Commander"> <div class="spaceholder1">Nothing</div> <button drab-click="button_clicked">Shared 1</button> </div> <div drab-commander="DrabTestApp.Shared1Commander"> <div class="spaceholder1">Nothing</div> <button drab-click="button_clicked">Shared 2</button> </div>
๐ Just like we can use
Drab.Core.this/1
to select the exact sender of the event, we may haveDrab.Core.this_commander/1
, to build a selector which chooses the desired object:defhandler button_clicked(socket, sender) do set_prop socket, this_commander(sender) <> " .spaceholder1", innerText: "changed" end
๐ Notice the space before โ.spaceholder1โ.
this_commander/1
returns the string like[drab-id="f59d54e6-a924-4e72-90d1-5177efecac9b"]
, so you may build any selector based on it.