Allow streamers to hide viewer count and viewers to default the viewer count to expanded/minimized

lib/glimesh/accounts/user_preference.ex

@@ -14,6 +14,7 @@ defmodule Glimesh.Accounts.UserPreference do
     field :show_mod_icons, :boolean, default: true
     field :show_mature_content, :boolean, default: false
     field :gift_subs_enabled, :boolean, default: true
+    field :maximize_viewer_count, :boolean, default: true
 
     timestamps()
   end
@@ -29,7 +30,8 @@ defmodule Glimesh.Accounts.UserPreference do
       :show_timestamps,
       :show_mature_content,
       :show_mod_icons,
-      :gift_subs_enabled
+      :gift_subs_enabled,
+      :maximize_viewer_count
     ])
     |> unique_constraint(:user_id)
   end

lib/glimesh/streams/channel.ex

@@ -46,6 +46,8 @@ defmodule Glimesh.Streams.Channel do
     field :poster, Glimesh.ChannelPoster.Type
     field :chat_bg, Glimesh.ChatBackground.Type
 
+    field :show_viewer_count, :boolean, default: true
+
     # This is used when searching for live channels that are live or hosted
     field :match_type, :string, virtual: true
 
@@ -105,7 +107,8 @@ defmodule Glimesh.Streams.Channel do
       :require_confirmed_email,
       :minimum_account_age,
       :allow_hosting,
-      :backend
+      :backend,
+      :show_viewer_count
     ])
     |> validate_length(:chat_rules_md, max: 8192)
     |> validate_length(:title, max: 250)

lib/glimesh_web/live/user_live/components/viewer_count.ex

@@ -7,34 +7,50 @@ defmodule GlimeshWeb.UserLive.Components.ViewerCount do
   @impl true
   def render(assigns) do
     ~H"""
-    <button
-      class="btn btn-danger btn-responsive"
-      data-toggle="tooltip"
-      title="Viewers"
-      phx-click="toggle"
-    >
-      <%= if @visible do %>
-        <span class="d-none d-lg-block">
-          <%= gettext("%{count} Viewers", count: @viewer_count) %>
-        </span>
-        <span class="d-lg-none">
-          <%= gettext("%{count} ", count: @viewer_count) %><i class="far fa-eye"></i>
-        </span>
-      <% else %>
-        <i class="far fa-eye-slash"></i>
-      <% end %>
-    </button>
+    <%= case @viewer_count_state do %>
+      <% value when value in [:visible, :maximize] -> %>
+        <button
+          class="btn btn-danger btn-responsive"
+          data-toggle="tooltip"
+          title="Viewers"
+          phx-click="toggle"
+        >
+          <span class="d-none d-lg-block">
+            <%= gettext("%{count} Viewers", count: @viewer_count) %>
+          </span>
+          <span class="d-lg-none">
+            <%= gettext("%{count} ", count: @viewer_count) %><i class="far fa-eye"></i>
+          </span>
+        </button>
+      <% :minimize -> %>
+        <button
+          class="btn btn-danger btn-responsive"
+          data-toggle="tooltip"
+          title="Viewers"
+          phx-click="toggle"
+        >
+          <i class="far fa-eye-slash"></i>
+        </button>
+      <% _ -> %>
+    <% end %>
     """
   end
 
   @impl true
-  def mount(_params, %{"channel_id" => channel_id} = session, socket) do
+  def mount(
+        _params,
+        %{"channel_id" => channel_id, "viewer_count_state" => viewer_count_state} = session,
+        socket
+      ) do
     if session["locale"], do: Gettext.put_locale(session["locale"])
     {:ok, topic} = Streams.subscribe_to(:viewers, channel_id)
 
     viewer_count = Presence.list_presences(topic) |> Enum.count()
 
-    {:ok, socket |> assign(:visible, true) |> assign(:viewer_count, viewer_count)}
+    {:ok,
+     socket
+     |> assign(:viewer_count_state, viewer_count_state)
+     |> assign(:viewer_count, viewer_count)}
   end
 
   @impl true
@@ -50,6 +66,21 @@ defmodule GlimeshWeb.UserLive.Components.ViewerCount do
 
   @impl true
   def handle_event("toggle", %{}, socket) do
-    {:noreply, assign(socket, :visible, !socket.assigns.visible)}
+    new_state =
+      case socket.assigns.viewer_count_state do
+        :visible ->
+          :minimize
+
+        :minimize ->
+          :maximize
+
+        :maximize ->
+          :minimize
+
+        _ ->
+          socket.assigns.viewer_count_state
+      end
+
+    {:noreply, assign(socket, :viewer_count_state, new_state)}
   end
 end

lib/glimesh_web/live/user_live/stream.ex

@@ -14,6 +14,8 @@ defmodule GlimeshWeb.UserLive.Stream do
         maybe_user = Accounts.get_user_by_session_token(session["user_token"])
         streamer = Accounts.get_user!(channel.streamer_id)
 
+        viewer_count_state = get_viewer_count_state(maybe_user, channel)
+
         {:ok,
          %{
            :redirect_to_hosted_target => redirect_to_hosted_target,
@@ -64,7 +66,8 @@ defmodule GlimeshWeb.UserLive.Stream do
            |> assign(:player_error, nil)
            |> assign(:user, maybe_user)
            |> assign(:ultrawide, false)
-           |> assign(:webrtc_error, false)}
+           |> assign(:webrtc_error, false)
+           |> assign(:viewer_count_state, viewer_count_state)}
         end
 
       nil ->
@@ -236,4 +239,25 @@ defmodule GlimeshWeb.UserLive.Stream do
       image_url: avatar_url
     }
   end
+
+  defp get_viewer_count_state(
+         %Glimesh.Accounts.User{} = user,
+         %Glimesh.Streams.Channel{} = channel
+       ) do
+    %{:maximize_viewer_count => user_viewer_count_pref} =
+      Glimesh.Accounts.get_user_preference!(user)
+
+    cond do
+      channel.show_viewer_count == false ->
+        :hide
+
+      user_viewer_count_pref == false ->
+        :minimize
+
+      true ->
+        :visible
+    end
+  end
+
+  defp get_viewer_count_state(nil, _channel), do: :visible
 end

lib/glimesh_web/live/user_live/stream.html.heex

@@ -142,7 +142,10 @@
                   <div class="btn-group" role="group" aria-label="Third group">
                     <%= live_render(@socket, GlimeshWeb.UserLive.Components.ViewerCount,
                       id: "viewer-count",
-                      session: %{"channel_id" => @channel.id}
+                      session: %{
+                        "channel_id" => @channel.id,
+                        "viewer_count_state" => @viewer_count_state
+                      }
                     ) %>
                   </div>
                 </div>

lib/glimesh_web/live/user_settings/components/channel_settings_live.html.heex

@@ -54,14 +54,7 @@
       "Create and design a channel custom to you by uploading unique images and identifying what type of content viewers can expect from your channel. You can customize the content that appears under your stream on your Profile page."
     ) %>
   </p>
-  <div class="row">
-    <div class="col-sm-6">
-      <div class="form-group">
-        <%= label(f, gettext("Channel Primary Language")) %>
-        <%= select(f, :language, Application.get_env(:glimesh, :locales), class: "form-control") %>
-        <%= error_tag(f, :language) %>
-      </div>
-    </div>
+  <div class="row pt-2 pb-4">
     <div class="col-sm-6">
       <div class="form-group">
         <%= label(f, gettext("Mature Content")) %>
@@ -74,6 +67,27 @@
         <%= error_tag(f, :mature_content) %>
       </div>
     </div>
+    <div class="col-sm-6">
+      <div class="form-group">
+        <%= label(f, gettext("Show Viewer Count")) %>
+        <div class="custom-control custom-switch">
+          <%= checkbox(f, :show_viewer_count, class: "custom-control-input") %>
+          <label class="custom-control-label" for={input_id(f, :show_viewer_count)}>
+            <%= gettext("Show viewer count on channel page") %>
+          </label>
+        </div>
+        <%= error_tag(f, :mature_content) %>
+      </div>
+    </div>
+  </div>
+  <div class="row">
+    <div class="col-sm-6">
+      <div class="form-group">
+        <%= label(f, gettext("Channel Primary Language")) %>
+        <%= select(f, :language, Application.get_env(:glimesh, :locales), class: "form-control") %>
+        <%= error_tag(f, :language) %>
+      </div>
+    </div>
   </div>
   <div class="row">
     <div class="col-sm-6">

lib/glimesh_web/templates/user_settings/preference.html.eex

@@ -76,6 +76,15 @@
                 <small class="form-text text-muted"><%= gettext("Shows the timeout / ban / etc icons on a chat message.") %></small>
             </div>
 
+            <div class="form-group">
+                <%= label f, gettext("Viewer Count:") %>
+                <div class="custom-control custom-switch">
+                    <%= checkbox f, :maximize_viewer_count, class: "custom-control-input" %>
+                    <%= label f, :maximize_viewer_count, gettext("Expand the viewer count on channel pages"), class: "custom-control-label" %>
+                </div>
+                <small class="form-text text-muted"><%= gettext("Sets the default state of the viewer count on channel pages to be expanded/minimized.") %></small>
+            </div>
+
             <%= submit gettext("Update Settings"), class: "btn btn-primary mt-4" %>
 
             <% end %>

priv/repo/migrations/20221112022848_add_viewer_count_toggle_preferences.exs

@@ -0,0 +1,13 @@
+defmodule Glimesh.Repo.Migrations.AddViewerCountTogglePreferences do
+  use Ecto.Migration
+
+  def change do
+    alter table(:channels) do
+      add :show_viewer_count, :boolean, default: true
+    end
+
+    alter table(:user_preferences) do
+      add :maximize_viewer_count, :boolean, default: true
+    end
+  end
+end

test/glimesh_web/live/user_live/stream_test.exs

@@ -362,4 +362,63 @@ defmodule GlimeshWeb.UserLive.StreamTest do
       assert html =~ "stream-title-edit"
     end
   end
+
+  describe "Viewer count" do
+    setup do
+      streamer = streamer_fixture()
+
+      %{
+        channel: streamer.channel,
+        streamer: streamer
+      }
+    end
+
+    test "is shown by default", %{conn: conn, streamer: streamer} do
+      %{:conn => logged_in_conn} = register_and_log_in_user(%{conn: conn})
+
+      {:ok, _, html} =
+        live(logged_in_conn, Routes.user_stream_path(logged_in_conn, :index, streamer.username))
+
+      assert html =~ "Viewers"
+    end
+
+    test "is minimized if logged in user has set preference", %{conn: conn, streamer: streamer} do
+      user = user_fixture()
+      user_preferences = Glimesh.Accounts.get_user_preference!(user)
+
+      Glimesh.Accounts.update_user_preference(user_preferences, %{:maximize_viewer_count => false})
+
+      logged_in_conn = log_in_user(conn, user)
+
+      {:ok, _, html} =
+        live(logged_in_conn, Routes.user_stream_path(logged_in_conn, :index, streamer.username))
+
+      assert html =~ "fa-eye-slash"
+    end
+
+    test "is maximized if logged in user has set preference", %{conn: conn, streamer: streamer} do
+      user = user_fixture()
+      user_preferences = Glimesh.Accounts.get_user_preference!(user)
+      Glimesh.Accounts.update_user_preference(user_preferences, %{:maximize_viewer_count => true})
+      logged_in_conn = log_in_user(conn, user)
+
+      {:ok, _, html} =
+        live(logged_in_conn, Routes.user_stream_path(logged_in_conn, :index, streamer.username))
+
+      assert html =~ "Viewers"
+    end
+
+    test "is hidden if streamer has set preference", %{conn: conn, streamer: streamer} do
+      user = user_fixture()
+      user_preferences = Glimesh.Accounts.get_user_preference!(user)
+      Glimesh.Accounts.update_user_preference(user_preferences, %{:maximize_viewer_count => true})
+      Glimesh.Streams.update_channel(streamer, streamer.channel, %{:show_viewer_count => false})
+      logged_in_conn = log_in_user(conn, user)
+
+      {:ok, _, html} =
+        live(logged_in_conn, Routes.user_stream_path(logged_in_conn, :index, streamer.username))
+
+      refute html =~ "Viewers"
+    end
+  end
 end

test/glimesh_web/live/user_live_components/viewer_count_test.exs

@@ -15,13 +15,20 @@ defmodule GlimeshWeb.UserLive.Components.ViewerCountTest do
     setup :create_channel
 
     test "shows no viewer without loading stream", %{conn: conn, channel: channel} do
-      {:ok, _, html} = live_isolated(conn, @component, session: %{"channel_id" => channel.id})
+      {:ok, _, html} =
+        live_isolated(conn, @component,
+          session: %{"channel_id" => channel.id, "viewer_count_state" => :visible}
+        )
 
       assert html =~ "0 Viewers"
     end
 
     test "shows one viewer by loading a stream", %{conn: conn, channel: channel} do
-      {:ok, view, _} = live_isolated(conn, @component, session: %{"channel_id" => channel.id})
+      {:ok, view, _} =
+        live_isolated(conn, @component,
+          session: %{"channel_id" => channel.id, "viewer_count_state" => :visible}
+        )
+
       streamer = Glimesh.Accounts.get_user!(channel.user_id)
 
       assert render(view) =~ "0 Viewers"
@@ -42,9 +49,39 @@ defmodule GlimeshWeb.UserLive.Components.ViewerCountTest do
     end
 
     test "can hide the viewer count", %{conn: conn, channel: channel} do
-      {:ok, view, _} = live_isolated(conn, @component, session: %{"channel_id" => channel.id})
+      {:ok, view, _} =
+        live_isolated(conn, @component,
+          session: %{"channel_id" => channel.id, "viewer_count_state" => :visible}
+        )
 
       assert view |> element("button") |> render_click() =~ "far fa-eye-slash"
     end
+
+    test "is minimized if preference set", %{conn: conn, channel: channel} do
+      {:ok, view, _} =
+        live_isolated(conn, @component,
+          session: %{"channel_id" => channel.id, "viewer_count_state" => :minimize}
+        )
+
+      assert render(view) =~ "far fa-eye-slash"
+    end
+
+    test "can be maximized if minimized", %{conn: conn, channel: channel} do
+      {:ok, view, _} =
+        live_isolated(conn, @component,
+          session: %{"channel_id" => channel.id, "viewer_count_state" => :minimize}
+        )
+
+      assert view |> element("button") |> render_click() =~ "Viewers"
+    end
+
+    test "is hidden if preference set", %{conn: conn, channel: channel} do
+      {:ok, view, _} =
+        live_isolated(conn, @component,
+          session: %{"channel_id" => channel.id, "viewer_count_state" => :hidden}
+        )
+
+      refute render(view) =~ "Viewers"
+    end
   end
 end