quetzal v0.1.4 Quetzal.LiveView behaviour View Source

Quetzal Live View provides easy interface to handle events, components and messages into Quetzal architechture in a fast and fashion way. It uses Phoenix Live View to render components and their upgrades.

In order to use set the Quetzal.LiveView instead Phoenix.LiveView directly over your live module:

Example:

You don't need mount/2 or render/1 when using the Quetzal Live View is all done:

defmodule AppWeb.PieLive do
  use Quetzal.LiveView
end

In order to render components to the live view use the components/0 callback:

Example:

This will render a pie graph into the view using custom components:

defmodule AppWeb.PieLive do
  use Quetzal.LiveView

  @impl Quetzal.LiveView
  def components() do
    Quetzal.Graph.graph [id: "mypiegraph"], [type: "pie", labels: ["RED", "BLUE"], values: [20, 10]]
  end
end

You can use the graph and other components to extend your views with custom graphs, tables, etc.

Also is possible upgrade the components from the server live view, use update_components/1 over your live view:

Example:

This example generates a random number and push to live view so Quetzal updates the component in the view:

defmodule AppWeb.PieLive do
  use Quetzal.LiveView

  @impl Quetzal.LiveView
  def components(_session) do
    [{Quetzal.Graph, [id: "mypie"], [type: "pie", labels: ["Red", "Blue"], values: [10, 20]]}]
  end

  def trigger_update() do
    :timer.sleep(5000)
    white = :rand.uniform(100)
    black = :rand.uniform(100)
    gray = :rand.uniform(100)
    components = [mypie: [labels: ["Black", "White", "Gray"], values: [black, white, gray]]]
    update_components(components)
    trigger_update()
  end
end

Link to this section Summary

Functions

Updates the components sending a message to live view, it receives components as string as in Quetzal components definition

Link to this section Functions

Link to this function

update_components(components)

View Source

Updates the components sending a message to live view, it receives components as string as in Quetzal components definition

Example:

components = [mypiegraph: [labels: ["Black", "White", "Gray"], values: [black, white, gray]]]
update_components(components) 

Link to this section Callbacks

Link to this callback

components(session)

View Source
components(session :: map()) :: any()