I have a bunch of IOT devices generating event to my Elixir app. Each IOT device has its own topic/channel in Hub. What I would like to build is a monitor GUI where I have a list of all the IOT devices I can click and then I subscribe on all events from that device, I can click on another device and then I should unsubscribe from the old device and subscribe to the clicked device. I see Drab as a perfect fit for this but im not able to get it to work and im not sure what is the best way to design my code for this use case. This is what I have so far.
defmodule BfgWebWeb.PageController do
use BfgWebWeb, :controller
def index(conn, _params) do
market_ids = BfgEngine.MarketsServer.list_market_ids()
render conn, "index.html", market_ids: market_ids, genevent: ""
end
end
defmodule BfgWebWeb.PageCommander do
use Drab.Commander
require Hub
require Logger
# onconnect :connected
defhandler subscribe_market(socket, _sender, market_id) when is_float(market_id) do
market_id = Float.to_string(market_id)
Logger.debug("Change subscription to #{market_id} is it string #{is_binary(market_id)}")
# TODO where can I save this sub so that I can use it to unsubscribe later Hub.unsubscribe(sub)
sub = Hub.subscribe(market_id, _)
handle_event(socket)
end
# def connected(socket) do
# sub = Hub.subscribe("market_id", _)
# Logger.debug("Connected and subscribed to market_id #{inspect sub}")
# handle_event(socket)
# end
defp handle_event(socket) do
receive do
msg ->
Logger.warn("Got msg #{inspect msg}")
{:ok, events} = Drab.Live.peek(socket, :genevent)
socket
|> poke(genevent: inspect(msg) <> "\n" <> events)
end
handle_event(socket)
end
end
That could be a tricky part. Are “market_ids” float? Actually I’ve never tested handlers with guards. I am using apply/3 to run the handler. Hmm, need to try it.
Could you please remove the guard and paste the exact output? Is it showing “Change subscripiton to …” in the logs?
So, from the Drab point-of-view everything works, you have “change subscription to …” message. I understand that everything after Hub.subscript does not work.
I would suggest checking what is returned by Hub.subscribe. I understand it subscribes something to self(), which is received later. You may try to debug it in iex, without phoenix or drab involved.
I have Hub working in my core application. Im just trying to get the GUI layer working now.
How would you suggest I can switch subscriptions? To do that I ned to save the sub returned by Hub.subscribe and the second problem is to cancel the one long running process I start when I hit a button and to start another one.
This is wrong: [debug] Change subscription to 1.14630004 is it string true
It should say: [debug] Change subscription to 1.146300040 is it string true
But the additional argument cuts off, not sure what is going on since the argument shown in the button is the right on but the additional argument is one digit short.
In your model, you start the handler function and do a receive forever. Fair enough, but to cancel this from the other process, you need to store the pid somewhere, and send the cancel message to it, or just kill it.
Sorry, but without the knowledge of Hub I can’t tell more. Maybe it already got the unsubscribe api?
So am I understanding correct if I say drab is starting a new process (GenServer?) for each call I make to any defhandler, and self() would be the pid of the process this call as spawned?
Welcome to the float hell. This is why you should never use floats in non-scientific applications Especially when inter-operating between different languages.
I would suggest that you should send string to the backend, so instead of:
<%= for market_id <- @market_ids do %>
<button type="button" class="btn btn-default" drab-click="subscribe_market(<%= market_id %>)"><%= market_id %></button>
<% end %>
do:
<%= for market_id <- @market_ids do %>
<button type="button" class="btn btn-default" drab-click="subscribe_market('<%= market_id %>')"><%= market_id %></button>
<% end %>
Or multiple it by 10000000 and use integer.
That would save you a lot of sleepless nights
But the only real solution is to not to use floats. Never ever.
This is because Drab is a kind of interoperability stuff between browser and server.
I’ve been thinking about casting everything as string, it would be easier to implement, but we would loose quite essential information about the type.
Now, you can pass the argument to the handler as any valid, JSONable javascript, so if you do drab-click="subscribe_market([1, 2, 3])" you’ll get an Elixir list in you handler.
Vice versa, if you set the object property with set_prop(socket, "#myelem", property: [1, 2, 3]) you expect that document.getElementById("myelem").property == [1, 2, 3]. An array, not a string “[1,2,3]”.
Especially when inter-operating between different languages.
Thanks for the help!
