activity.html

{% extends "base.html" %}
{% block title %}Activity · Kishaloy Roy{% endblock %}

{% block head %}
<link rel="stylesheet" href="{{ url_for('static', filename='css/activity.css') }}">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/chart.umd.min.js"></script>
{% endblock %}

{% block content %}
  <h1 class="page-title">Activity log</h1>
  <p class="page-desc">My Programming Hours, Visualized.</p>

  <div class="actions">
    <a class="btn" href="{{ url_for('activity_raw') }}">View daily cards</a>
  </div>

  <div class="chart-card">
    <div class="chart-wrap">
      <canvas id="activityChart"></canvas>
    </div>
  </div>

  <div class="cards">
    {% for d in latest_three|reverse %}
      <div class="day-card">
        <div class="day-title">Date: <span class="mono">{{ d.date }}</span></div>
        <ul class="day-list">
          <li>Programmed <span class="mono">{{ d.hours }}</span> hours.</li>
          <li>Pressed <span class="mono">{{ d.keys_pressed }}</span> keys.</li>
          <li>Wrote <span class="mono">{{ d.lines }}</span> lines.</li>
        </ul>
      </div>
    {% endfor %}
  </div>

  <script>
    const initialDaysData = {{ days|tojson }};
  </script>
  <script src="{{ url_for('static', filename='js/activity_chart.js') }}"></script>
{% endblock %}