{% extends 'babybuddy/page.html' %}
{% load breadcrumb cards i18n %}

{% block title %}{% trans "Dashboard" %} - {{ object }}{% endblock %}

{% block breadcrumbs %}
    <li class="breadcrumb-item"><a href="{% url 'core:child-list' %}">{% trans "Children" %}</a></li>
    <li class="breadcrumb-item fw-bold">
        {% child_quick_switch object 'dashboard:dashboard-child' %}
    </li>
    <li class="breadcrumb-item active" aria-current="page">{% trans "Dashboard" %}</li>
{% endblock %}

{% block content %}
    <div id="dashboard-child" class="row" data-masonry='{"percentPosition": true }'>
        <div class="col-sm-6 col-lg-4">
            {% card_timer_list object %}
        </div>
        <div class="col-sm-6 col-lg-4">
            {% card_feeding_last object %}
        </div>
        <div class="col-sm-6 col-lg-4">
            {% card_diaperchange_last object %}
        </div>
        <div class="col-sm-6 col-lg-4">
            {% card_pumping_last object %}
        </div>
        <div class="col-sm-6 col-lg-4">
            {% card_sleep_last object %}
        </div>
        <div class="col-sm-6 col-lg-4">
            {% card_feeding_last_method object %}
        </div>
        <div class="col-sm-6 col-lg-4">
            {% card_feeding_recent object %}
        </div>
        <div class="col-sm-6 col-lg-4">
            {% card_statistics object %}
        </div>
        <div class="col-sm-6 col-lg-4">
            {% card_sleep_recent object %}
        </div>
        <div class="col-sm-6 col-lg-4">
            {% card_sleep_naps_day object %}
        </div>
        <div class="col-sm-6 col-lg-4">
            {% card_tummytime_day object %}
        </div>
        <div class="col-sm-6 col-lg-4">
            {% card_diaperchange_types object %}
        </div>
    </div>
{% endblock %}

{% block javascript %}
    {% if user.settings.dashboard_refresh_rate %}
        <script type="application/javascript">
            BabyBuddy.Dashboard.watch('dashboard-child', {{ user.settings.dashboard_refresh_rate_milliseconds }});
        </script>
    {% else %}
        <script type="application/javascript">
            BabyBuddy.Dashboard.watch('dashboard-child', false);
        </script>
    {% endif %}
{% endblock %}
