Changeset 02b96c5 in OpenWorkouts-current for ow/templates/profile.pt

Timestamp:

Mar 12, 2019, 12:47:38 PM (5 years ago)

Author:

Borja Lopez <borja@…>

Branches:

current

Children:

8ba32d9

Parents:

d9453fc

Message:

(#7) Added calendar heatmap chart to the profile page.

The calendar shows the current month, each day without a workout represented
by a light grey square, each day with workout data in a red/pink color, picked
up from a gradient generated based on the app main colors, and calculated based
on the amount of workout time for the day.

A tooltip is shown on hover with more info (only the total workouts time for
now)

File:

• ow/templates/profile.pt (modified) (2 diffs)

ow/templates/profile.pt

@@ -51 +51 @@
             </ul>
           </div>
+          <div class="calendar-heatmap js-calendar-heatmap">
+          </div>
         </div>
 
@@ -462 +464 @@
      sport_stats.setup();
 
+     var heatmap_chart = owjs.calendar_heatmap_chart({
+         chart_selector: 'div.js-calendar-heatmap',
+         url: "${request.resource_url(user, 'month')}",
+         // Trick to have all those shortened day names translated
+         day_names_list: "${_('Mo Tu We Th Fr Sa Su')}".split(' ')
+     });
+     heatmap_chart.render();
+
      var year_stats = owjs.year_stats({
          link_selector: 'a.js-choose-year-stats',