Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Mount multiple streams #53

Draft
wants to merge 6 commits into
base: master
Choose a base branch
from
Draft

Mount multiple streams #53

Changes from 1 commit
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
3009d84
mount multiple streams
rcehemann Sep 13, 2020
b9b2139
render all mounted streams
rcehemann Sep 13, 2020
448476b
expose stream in broadcast callback messages
thekeele Sep 15, 2020
09fa767
update broadcast topic name, reorder message elements
thekeele Sep 20, 2020
29e8c52
store stats as map, add phx-value-*
thekeele Sep 20, 2020
c076703
Display something when no streams are running
rcehemann Sep 21, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
274 changes: 143 additions & 131 deletions lib/sen_tweet_web/live/stats_live.html.leex
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,172 +1,184 @@

<%= for {stream, %{"hourly" => hourly, "daily" => daily}} <- @streams do %>

<section class="hero is-light">
<div class="hero-body">
<div class="container">
<h1 class="title is-1 is-spaced has-text-centered">
Hourly Stats
</h1>

<nav class="level">
<div class="level-item has-text-centered">
<div>
<p class="heading">Stream</p>
<p class="title"><%= String.upcase(stream) %></p>
<%= if Enum.count(@streams) > 0 do %>
Copy link
Owner Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You can pattern match and avoid the count here.

if @streams == [] do
  # no streams
else
  # show stats

Copy link
Owner Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The match?/2 macro is an alternative to the above. Whatever reads better to you.

if match?([], @streams) do


<%= for {stream, %{"hourly" => hourly, "daily" => daily}} <- @streams do %>

<section class="hero is-light">
<div class="hero-body">
<div class="container">
<h1 class="title is-1 is-spaced has-text-centered">
Hourly Stats
</h1>

<nav class="level">
<div class="level-item has-text-centered">
<div>
<p class="heading">Stream</p>
<p class="title"><%= String.upcase(stream) %></p>
</div>
</div>
</div>
<div class="level-item has-text-centered">
<div>
<p class="heading">Hour</p>
<p class="title"><%= hourly.current %> UTC</p>
<div class="level-item has-text-centered">
<div>
<p class="heading">Hour</p>
<p class="title"><%= hourly.current %> UTC</p>
</div>
</div>
</div>
</nav>

<nav class="level">
<div class="level-item has-text-centered">
<div>
<p class="heading">Tweets</p>
<p class="title"><%= get_weight(hourly, :tweets, :count) %></p>
</nav>

<nav class="level">
<div class="level-item has-text-centered">
<div>
<p class="heading">Tweets</p>
<p class="title"><%= get_weight(hourly, :tweets, :count) %></p>
</div>
</div>
</div>
<div class="level-item has-text-centered">
<div>
<p class="heading">Average</p>
<p class="title"><%= round_up(get_weight(hourly, :tweets, :average)) %>%</p>
<div class="level-item has-text-centered">
<div>
<p class="heading">Average</p>
<p class="title"><%= round_up(get_weight(hourly, :tweets, :average)) %>%</p>
</div>
</div>
</div>
<div class="level-item has-text-centered">
<div>
<p class="heading">Likes</p>
<p class="title"><%= get_weight(hourly, :likes, :count) %></p>
<div class="level-item has-text-centered">
<div>
<p class="heading">Likes</p>
<p class="title"><%= get_weight(hourly, :likes, :count) %></p>
</div>
</div>
</div>
<div class="level-item has-text-centered">
<div>
<p class="heading">Retweets</p>
<p class="title"><%= get_weight(hourly, :retweets, :count) %></p>
<div class="level-item has-text-centered">
<div>
<p class="heading">Retweets</p>
<p class="title"><%= get_weight(hourly, :retweets, :count) %></p>
</div>
</div>
</div>
</nav>
</nav>
</div>
</div>
</div>
</section>
</section>

<div class="columns">
<div class="column is-two-thirds">
<%= hourly.svg %>
</div>
<div class="columns">
<div class="column is-two-thirds">
<%= hourly.svg %>
</div>

<div class="column">
<div class="box">
<h1 class="title has-text-centered">Tweet Type</h1>
<div class="buttons are-large">
<button class="button is-light is-fullwidth is-outlined <%= is_selected("hourly_text", hourly.filter["type"], hourly.filter["weight"]) %>" phx-click="text" phx-value-stream="<%= stream %>" phx-value-interval="hourly" phx-value-filter="type">Text</button>
<div class="column">
<div class="box">
<h1 class="title has-text-centered">Tweet Type</h1>
<div class="buttons are-large">
<button class="button is-light is-fullwidth is-outlined <%= is_selected("hourly_text", hourly.filter["type"], hourly.filter["weight"]) %>" phx-click="text" phx-value-stream="<%= stream %>" phx-value-interval="hourly" phx-value-filter="type">Text</button>

<button class="button is-light is-fullwidth is-outlined <%= is_selected("hourly_extended", hourly.filter["type"], hourly.filter["weight"]) %>" phx-click="extended" phx-value-stream="<%= stream %>" phx-value-interval="hourly" phx-value-filter="type">Extended Tweet</button>
<button class="button is-light is-fullwidth is-outlined <%= is_selected("hourly_extended", hourly.filter["type"], hourly.filter["weight"]) %>" phx-click="extended" phx-value-stream="<%= stream %>" phx-value-interval="hourly" phx-value-filter="type">Extended Tweet</button>

<button class="button is-light is-fullwidth is-outlined <%= is_selected("hourly_retweeted", hourly.filter["type"], hourly.filter["weight"]) %>" phx-click="retweeted" phx-value-stream="<%= stream %>" phx-value-interval="hourly" phx-value-filter="type">Retweeted Status</button>
<button class="button is-light is-fullwidth is-outlined <%= is_selected("hourly_retweeted", hourly.filter["type"], hourly.filter["weight"]) %>" phx-click="retweeted" phx-value-stream="<%= stream %>" phx-value-interval="hourly" phx-value-filter="type">Retweeted Status</button>

<button class="button is-light is-fullwidth is-outlined <%= is_selected("hourly_quoted", hourly.filter["type"], hourly.filter["weight"]) %>" phx-click="quoted" phx-value-stream="<%= stream %>" phx-value-interval="hourly" phx-value-filter="type">Quoted Status</button>
<button class="button is-light is-fullwidth is-outlined <%= is_selected("hourly_quoted", hourly.filter["type"], hourly.filter["weight"]) %>" phx-click="quoted" phx-value-stream="<%= stream %>" phx-value-interval="hourly" phx-value-filter="type">Quoted Status</button>
</div>
</div>
</div>

<div class="box">
<h1 class="title has-text-centered">Weight By</h1>
<div class="buttons are-large">
<button class="button is-light is-fullwidth is-outlined <%= is_selected("hourly_tweets", hourly.filter["type"], hourly.filter["weight"]) %>" phx-click="tweets" phx-value-stream="<%= stream %>" phx-value-interval="hourly" phx-value-filter="weight">Tweets</button>
<div class="box">
<h1 class="title has-text-centered">Weight By</h1>
<div class="buttons are-large">
<button class="button is-light is-fullwidth is-outlined <%= is_selected("hourly_tweets", hourly.filter["type"], hourly.filter["weight"]) %>" phx-click="tweets" phx-value-stream="<%= stream %>" phx-value-interval="hourly" phx-value-filter="weight">Tweets</button>

<button class="button is-light is-fullwidth is-outlined <%= is_selected("hourly_likes", hourly.filter["type"], hourly.filter["weight"]) %>" phx-click="likes" phx-value-stream="<%= stream %>" phx-value-interval="hourly" phx-value-filter="weight">Likes</button>
<button class="button is-light is-fullwidth is-outlined <%= is_selected("hourly_likes", hourly.filter["type"], hourly.filter["weight"]) %>" phx-click="likes" phx-value-stream="<%= stream %>" phx-value-interval="hourly" phx-value-filter="weight">Likes</button>

<button class="button is-light is-fullwidth is-outlined <%= is_selected("hourly_retweets", hourly.filter["type"], hourly.filter["weight"]) %>" phx-click="retweets" phx-value-stream="<%= stream %>" phx-value-interval="hourly" phx-value-filter="weight">Retweets</button>
<button class="button is-light is-fullwidth is-outlined <%= is_selected("hourly_retweets", hourly.filter["type"], hourly.filter["weight"]) %>" phx-click="retweets" phx-value-stream="<%= stream %>" phx-value-interval="hourly" phx-value-filter="weight">Retweets</button>
</div>
</div>
</div>
</div>
</div>

<section class="hero is-light">
<div class="hero-body">
<div class="container">
<h1 class="title is-1 is-spaced has-text-centered">
Daily Stats
</h1>

<nav class="level">
<div class="level-item has-text-centered">
<div>
<p class="heading">Stream</p>
<p class="title"><%= String.upcase(stream) %></p>
<section class="hero is-light">
<div class="hero-body">
<div class="container">
<h1 class="title is-1 is-spaced has-text-centered">
Daily Stats
</h1>

<nav class="level">
<div class="level-item has-text-centered">
<div>
<p class="heading">Stream</p>
<p class="title"><%= String.upcase(stream) %></p>
</div>
</div>
</div>
<div class="level-item has-text-centered">
<div>
<p class="heading">Date</p>
<p class="title"><%= Date.to_string(daily.current) %></p>
<div class="level-item has-text-centered">
<div>
<p class="heading">Date</p>
<p class="title"><%= Date.to_string(daily.current) %></p>
</div>
</div>
</div>
</nav>

<nav class="level">
<div class="level-item has-text-centered">
<div>
<p class="heading">Tweets</p>
<p class="title"><%= get_weight(daily, :tweets, :count) %></p>
</nav>

<nav class="level">
<div class="level-item has-text-centered">
<div>
<p class="heading">Tweets</p>
<p class="title"><%= get_weight(daily, :tweets, :count) %></p>
</div>
</div>
</div>
<div class="level-item has-text-centered">
<div>
<p class="heading">Average</p>
<p class="title"><%= round_up(get_weight(daily, :tweets, :average)) %>%</p>
<div class="level-item has-text-centered">
<div>
<p class="heading">Average</p>
<p class="title"><%= round_up(get_weight(daily, :tweets, :average)) %>%</p>
</div>
</div>
</div>
<div class="level-item has-text-centered">
<div>
<p class="heading">Likes</p>
<p class="title"><%= get_weight(daily, :likes, :count) %></p>
<div class="level-item has-text-centered">
<div>
<p class="heading">Likes</p>
<p class="title"><%= get_weight(daily, :likes, :count) %></p>
</div>
</div>
</div>
<div class="level-item has-text-centered">
<div>
<p class="heading">Retweets</p>
<p class="title"><%= get_weight(daily, :retweets, :count) %></p>
<div class="level-item has-text-centered">
<div>
<p class="heading">Retweets</p>
<p class="title"><%= get_weight(daily, :retweets, :count) %></p>
</div>
</div>
</div>
</nav>
</nav>
</div>
</div>
</div>
</section>
</section>

<div class="columns">
<div class="column is-two-thirds">
<%= daily.svg %>
</div>
<div class="columns">
<div class="column is-two-thirds">
<%= daily.svg %>
</div>

<div class="column">
<div class="box">
<h1 class="title has-text-centered">Tweet Type</h1>
<div class="buttons are-large">
<button class="button is-light is-fullwidth is-outlined <%= is_selected("daily_text", daily.filter["type"], daily.filter["weight"]) %>" phx-click="text" phx-value-stream="<%= stream %>" phx-value-interval="daily" phx-value-filter="type">Text</button><br />
<div class="column">
<div class="box">
<h1 class="title has-text-centered">Tweet Type</h1>
<div class="buttons are-large">
<button class="button is-light is-fullwidth is-outlined <%= is_selected("daily_text", daily.filter["type"], daily.filter["weight"]) %>" phx-click="text" phx-value-stream="<%= stream %>" phx-value-interval="daily" phx-value-filter="type">Text</button><br />

<button class="button is-light is-fullwidth is-outlined <%= is_selected("daily_extended", daily.filter["type"], daily.filter["weight"]) %>" phx-click="extended" phx-value-stream="<%= stream %>" phx-value-interval="daily" phx-value-filter="type">Extended Tweet</button>
<button class="button is-light is-fullwidth is-outlined <%= is_selected("daily_extended", daily.filter["type"], daily.filter["weight"]) %>" phx-click="extended" phx-value-stream="<%= stream %>" phx-value-interval="daily" phx-value-filter="type">Extended Tweet</button>

<button class="button is-light is-fullwidth is-outlined <%= is_selected("daily_retweeted", daily.filter["type"], daily.filter["weight"]) %>" phx-click="retweeted" phx-value-stream="<%= stream %>" phx-value-interval="daily" phx-value-filter="type">Retweeted Status</button>
<button class="button is-light is-fullwidth is-outlined <%= is_selected("daily_retweeted", daily.filter["type"], daily.filter["weight"]) %>" phx-click="retweeted" phx-value-stream="<%= stream %>" phx-value-interval="daily" phx-value-filter="type">Retweeted Status</button>

<button class="button is-light is-fullwidth is-outlined <%= is_selected("daily_quoted", daily.filter["type"], daily.filter["weight"]) %>" phx-click="quoted" phx-value-stream="<%= stream %>" phx-value-interval="daily" phx-value-filter="type">Quoted Status</button>
<button class="button is-light is-fullwidth is-outlined <%= is_selected("daily_quoted", daily.filter["type"], daily.filter["weight"]) %>" phx-click="quoted" phx-value-stream="<%= stream %>" phx-value-interval="daily" phx-value-filter="type">Quoted Status</button>
</div>
</div>
</div>

<div class="box">
<h1 class="title has-text-centered">Weight By</h1>
<div class="buttons are-large">
<button class="button is-light is-fullwidth is-outlined <%= is_selected("daily_tweets", daily.filter["type"], daily.filter["weight"]) %>" phx-click="tweets" phx-value-stream="<%= stream %>" phx-value-interval="daily" phx-value-filter="weight">Tweets</button>
<div class="box">
<h1 class="title has-text-centered">Weight By</h1>
<div class="buttons are-large">
<button class="button is-light is-fullwidth is-outlined <%= is_selected("daily_tweets", daily.filter["type"], daily.filter["weight"]) %>" phx-click="tweets" phx-value-stream="<%= stream %>" phx-value-interval="daily" phx-value-filter="weight">Tweets</button>

<button class="button is-light is-fullwidth is-outlined <%= is_selected("daily_likes", daily.filter["type"], daily.filter["weight"]) %>" phx-click="likes" phx-value-stream="<%= stream %>" phx-value-interval="daily" phx-value-filter="weight">Likes</button>
<button class="button is-light is-fullwidth is-outlined <%= is_selected("daily_likes", daily.filter["type"], daily.filter["weight"]) %>" phx-click="likes" phx-value-stream="<%= stream %>" phx-value-interval="daily" phx-value-filter="weight">Likes</button>

<button class="button is-light is-fullwidth is-outlined <%= is_selected("daily_retweets", daily.filter["type"], daily.filter["weight"]) %>" phx-click="retweets" phx-value-stream="<%= stream %>" phx-value-interval="daily" phx-value-filter="weight">Retweets</button>
<button class="button is-light is-fullwidth is-outlined <%= is_selected("daily_retweets", daily.filter["type"], daily.filter["weight"]) %>" phx-click="retweets" phx-value-stream="<%= stream %>" phx-value-interval="daily" phx-value-filter="weight">Retweets</button>
</div>
</div>
</div>
</div>
</div>

<% end %>
<% else %>
<section class="hero is-warning">
<div class="hero body">
<div class="container">
<h1 class="title is-1 is-spaced has-text-centered">
😵 No streams running! 😵
</h1>
</div>
</div>
</section>
<% end %>