guido/plays-hub
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

finish activity ui

Browse Source
This commit is contained in:
Guido Schweizer
2025-06-22 08:51:48 +02:00
parent e79626972f
commit 7c14e469c9
19 changed files with 378 additions and 101 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
app/views/statistics/_activity_heatmap.html.erb
View File

@@ -1,4 +1,4 @@
<div style="background: #fff; border-radius: 16px; box-shadow: 0 2px 12px rgba(0,0,0,0.06); padding: 2em 2.5em; margin: 2em 0 2.5em 0; width: 100%; max-width: 1200px; margin-left: auto; margin-right: auto;">
<div style="background: #fff; border-radius: 16px; box-shadow: 0 2px 12px rgba(0,0,0,0.06); padding: 2em 2.5em; margin: 2em 0 2.5em 0; width: 100%; max-width: 1110px; margin-left: auto; margin-right: auto;">
<h2 style="margin-top:0; font-size: 1.4em; color: #0071e3;">Activity History</h2>
<div id="activity-heatmap" style="margin-top: 1em;"></div>
<script>

12
app/views/statistics/_longest_streak.html.erb Normal file
View File

@@ -0,0 +1,12 @@
<div class="dashboard-widget dashboard-longest-streak">
<% if streak %>
<h3 class="widget-title">Longest Listening Streak</h3>
<div class="widget-content">
<div><strong>Streak:</strong> <%= streak[:length] %> days (<%= streak[:start_date].strftime('%b %d, %Y') %> – <%= streak[:end_date].strftime('%b %d, %Y') %>)</div>
<div><strong>Total Plays:</strong> <%= streak[:total_plays] %></div>
<div><strong>Most Played Song:</strong> <%= streak[:most_played_song] || 'N/A' %> <%= "(#{streak[:most_played_song_count]} plays)" if streak[:most_played_song] %></div>
</div>
<% else %>
<div style="color: #888;">No listening streak yet. Start playing to build your first streak!</div>
<% end %>
</div>

3
app/views/statistics/_placeholder.html.erb
View File

@@ -1,3 +0,0 @@
<div style="background: #fff; border-radius: 16px; box-shadow: 0 2px 12px rgba(0,0,0,0.06); padding: 2em 2.5em; color: #888; display: flex; align-items: center; justify-content: center; min-height: 100px;">
<span>(Placeholder widget)</span>
</div>

5
app/views/statistics/_total_plays.html.erb
View File

@@ -4,8 +4,11 @@
<%= @total_plays %>
</div>
<% if defined?(@since_date) && @since_date.present? %>
<div style="margin-top: 0.8em; color: #888; font-size: 1em; font-weight: 400;">
<div style="margin-top: 0.4em; color: #888; font-size: 1em; font-weight: 400;">
since <%= @since_date.strftime('%b %-d, %Y') %>
</div>
<% end %>
<div class="widget-content" style="margin-top: 1.2em;">
<strong>This year:</strong> <%= @year_plays %> plays
</div>
</div>

6
app/views/statistics/index.html.erb
View File

@@ -1,5 +1,5 @@
<main>
<h1>Statistics Dashboard</h1>
<h1>Statistics Dashboard - <%= current_user.email %></h1>
<%= javascript_include_tag 'activity_heatmap', 'data-turbo-track': 'reload' %>
<!-- Activity Heatmap (full width) -->
@@ -10,11 +10,11 @@
<!-- Top 5 Artists Widget -->
<%= render partial: 'statistics/top_artists', locals: { top_artists_all_time: @top_artists_all_time, top_artists_year: @top_artists_year, top_artists_upcoming: @top_artists_upcoming } %>
<!-- Right column: Total Plays + Placeholder stacked -->
<div style="display: flex; flex-direction: column; gap: 2em; flex: 1 1 220px; min-width: 220px; max-width: 320px; align-self: flex-start;">
<div style="display: flex; flex-direction: column; gap: 2em; flex: 1 1 220px; min-width: 220px; max-width: 620px; align-self: flex-start;">
<!-- Total Plays Widget -->
<%= render partial: 'statistics/total_plays', locals: { total_plays: @total_plays } %>
<!-- Placeholder Widget -->
<%= render partial: 'statistics/placeholder' %>
<%= render partial: 'statistics/longest_streak', locals: { streak: @streak } %>
</div>
</div>
</main>