Phx.Live.Favicon (Phoenix Live Favicon v0.1.0)

Provides commands for manipulating the Favicon of Phoenix Live View applications while minimizing data over the wire.

The available command actions support a variety of utility operations useful for Favicon manipulation. Such as setting or removing tag attributes and adding or removing CSS classes for vector (SVG) favicons.

The elements selected for manipulation are found by Javascript client code document.querySelectorAll("link[rel*=icon]").

Link to this section Summary

Functions

Add a class_name to the list of classes on all favicon link elements

Remove an attribute from all favicon link elements

Remove a class_name from the list of classes on all favicon link elements

Reset all favicon link elements to their initial values

Reset an attribute to it's initial value on all favicon link elements

Set a new value to the attribute on all favicon link elements

Set the class on all favicon link elements

Set the value of the {dynamic} part of the attribute to variant on all favicon link elements

Toggle class_name on all favicon link elements

Link to this section Types

@type attr() :: atom() | binary()
Link to this type

class_name()

@type class_name() :: binary()
@type value() :: binary()
@type variant() :: binary()

Link to this section Functions

Link to this function

add_class(socket, class_name)

Add a class_name to the list of classes on all favicon link elements

Link to this function

remove_attr(socket, attr, value)

Remove an attribute from all favicon link elements

Link to this function

remove_class(socket, class_name)

Remove a class_name from the list of classes on all favicon link elements

@spec reset(Phoenix.LiveView.Socket.t()) :: map()

Reset all favicon link elements to their initial values

Link to this function

reset_attr(socket, attr)

Reset an attribute to it's initial value on all favicon link elements

Link to this function

set_attr(socket, attr, value)

Set a new value to the attribute on all favicon link elements

Link to this function

set_class(socket, class)

Set the class on all favicon link elements

Link to this function

set_dynamic(socket, attr, variant)

Set the value of the {dynamic} part of the attribute to variant on all favicon link elements

dynamic-attributes

Dynamic attributes

To define a dynamic attribute, the element in the template must have a data-dynamic-[attr] attribute with a value containing the placeholder notation {dynamic}.

Example

<link rel='icon' href="default_fav.png" data-dynamic-href="favs/{dynamic}/fav-16x16.png">

When an event is pushed with set_dynamic(:href, "new_message") the result wil look like:

<link rel='icon' href="favs/new_message/fav-16x16.png">
Link to this function

toggle_class(socket, class_name)

Toggle class_name on all favicon link elements