{% extends "daisy/base.html" %}

{% load diop_core_settings %}

{% block title %}
    <title>{{ request.site.name }} Dashboard</title>
{% endblock title %}

{% block content-header %}
    <h1 class="lg:text-2xl lg:font-light">Site Overview</h1>
{% endblock content-header %}


{% block content %}
    <!-- top stats full width -->
    <section class="stats stats-vertical xl:stats-horizontal bg-base-100 col-span-12 w-full shadow-xs">
        <div hx-get="{% url 'daisy_status_machines_by_dg' 'pie' 'available' %}"
             hx-swap="outerHTML"
             hx-trigger="load"></div>
        <div hx-get="{% url 'daisy_status_machines_by_dg' 'pie' 'inuse' %}"
             hx-swap="outerHTML"
             hx-trigger="load"></div>
        <div hx-get="{% url 'daisy_status_machines_by_dg' 'pie' 'disconnected' %}"
             hx-swap="outerHTML"
             hx-trigger="load"></div>
        <div hx-get="{% url 'daisy_status_machines_unavailable' 'card' %}"
             hx-swap="outerHTML"
             hx-trigger="load"></div>
    </section>
    <!-- /top stats full width -->


    <!-- card new here -->
    <section class="card bg-base-100 col-span-12 shadow-xs xl:col-span-4">
        <div class="card-body">
            <h1 class="card-title">
                <svg data-src="https://unpkg.com/heroicons/20/solid/sparkles.svg"
                     class="h-10 w-10">
                </svg>
                New here?
                <svg data-src="https://unpkg.com/heroicons/20/solid/users.svg"
                     class="h-6 w-6">
                </svg>
            </h1>
            <br />
            <p>
                If you're new to the platform, click the button below
                for instructions on how to sign up & connect.
            </p>
            <p>
                <div class="card-actions justify-end">
                    <button class="btn btn-warning">
                        <a href="{% settings_value 'DIOP_URL_NEWUSER' %}"
                           class="flex items-center gap-2">
                            <svg data-src="https://unpkg.com/heroicons/20/solid/rocket-launch.svg"
                                 class="h-6 w-6">
                            </svg>
                            Get Started!
                        </a>
                    </button>
                </div>
            </p>
        </div>
    </section>
    <!-- /card -->

    <!-- card questions -->
    <section class="card bg-base-100 col-span-12 shadow-xs xl:col-span-4">
        <div class="card-body">
            <h1 class="card-title">
                <svg data-src="https://unpkg.com/heroicons/20/solid/chat-bubble-left-right.svg"
                     class="h-10 w-10">
                </svg>
                Questions?
            </h1>
            <br />
            <p>
                Check out the <em>Frequently Asked Questions (FAQ)</em> or the
                documentation for
                common questions and answers.
            </p>
            <div class="card-actions mt-auto justify-center gap-6">
                <a href="{% settings_value 'DIOP_URL_FAQ' %}"
                   class="btn btn-info gap-2">
                    <svg data-src="https://unpkg.com/heroicons/20/solid/puzzle-piece.svg"
                         class="h-6 w-6">
                    </svg>
                    FAQ
                </a>
                <a href="{% settings_value 'DIOP_URL_DOCS' %}"
                   class="btn btn-info gap-2">
                    <svg data-src="https://unpkg.com/heroicons/20/solid/swatch.svg"
                         class="h-6 w-6">
                    </svg>
                    Docs
                </a>
            </div>
        </div>
    </section>
    <!-- /card -->

    <!-- card trouble issues -->
    <section class="card bg-base-100 col-span-12 shadow-xs xl:col-span-4">
        <div class="card-body">
            <h1 class="card-title">
                <svg data-src="https://unpkg.com/heroicons/20/solid/fire.svg"
                     class="h-10 w-10">
                </svg>
                Trouble? Issues?
            </h1>
            <br />
            <p>
                If you're experiencing trouble with using the platform,
                please send an email to the support team.
            </p>
            <p>
                <div class="card-actions justify-end">
                    <button class="btn btn-error">
                        <a href="{% settings_value 'DIOP_URL_SUPPORT' %}"
                           class="flex items-center gap-2">
                            <svg data-src="https://unpkg.com/heroicons/20/solid/envelope.svg"
                                 class="h-6 w-6">
                            </svg>
                            Report Issue
                        </a>
                    </button>
                </div>
            </p>
        </div>
    </section>
    <!-- /card -->
{% endblock content %}