{% extends "core/templates/index.jinja" %}
{% block content %}
<style>
    {% include 'titles/diva/templates/css/diva_style.css' %}
</style>
<div class="container">
    {% include 'titles/diva/templates/diva_header.jinja' %}
    {% if profile is defined and profile is not none and profile|length > 0 %}
    <div class="row">
        <div class="col-lg-8 m-auto mt-3">
            <div class="card bg-card rounded">
                <table class="table-large table-rowdistinct">
                    <caption align="top" class="text-center">OVERVIEW</caption>
                    <tr>
                        <th>Player name:</th>
                        <th>{{ profile[3] }}</th>
                        <th>
                            <button type="button" class="btn btn-primary btn-sm" data-bs-toggle="modal"
                                data-bs-target="#name_change">Edit</button>
                        </th>
                        <th>Level string:</th>
                        <th>{{ profile[4] }}</th>
                        <th>
                            <button type="button" class="btn btn-primary btn-sm" data-bs-toggle="modal"
                                data-bs-target="#lv_change">Edit</button>
                        </th>
                    </tr>
                    <tr>
                        <td>Lvl:</td>
                        <td>{{ profile[5] }}</td>
                        <td></td>
                        <td></td>
                        <td></td>
                        <td></td>
                    </tr>
                    <tr>
                        <td>Lvl points:</td>
                        <td>{{ profile[6] }}</td>
                        <td></td>
                        <td></td>
                        <td></td>
                        <td></td>
                    </tr>
                    <tr>
                        <td>Vocaloid points:</td>
                        <td>{{ profile[7] }}</td>
                        <td></td>
                        <td></td>
                        <td></td>
                        <td></td>
                    </tr>
                </table>
            </div>
        </div>
    </div>
    {% if error is defined %}
    {% include "core/templates/widgets/err_banner.jinja" %}
    {% endif %}
    {% elif sesh is defined and sesh is not none and sesh.user_id > 0 %}
    No profile information found for this account.
    {% else %}
    Login to view profile information.
    {% endif %}
</div>
<div class="modal fade" id="name_change" tabindex="-1" aria-labelledby="name_change_label" data-bs-theme="dark"
    aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">Name change</h5>
            </div>
            <div class="modal-body">
                <form id="new_name_form" action="/game/diva/update.name" method="post" style="outline: 0;">
                    <label class="form-label" for="new_name">new name:</label>
                    <input class="form-control" aria-describedby="newNameHelp" form="new_name_form" id="new_name"
                        name="new_name" maxlength="14" type="text" required>
                    <div id="newNameHelp" class="form-text">name must be full-width character string.
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <input type=submit class="btn btn-primary" type="button" form="new_name_form">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="lv_change" tabindex="-1" aria-labelledby="lv_change_label" data-bs-theme="dark"
    aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">Level string change</h5>
            </div>
            <div class="modal-body">
                <form id="new_lv_form" action="/game/diva/update.lv" method="post" style="outline: 0;">
                    <label class="form-label" for="new_lv">new level string:</label>
                    <input class="form-control" aria-describedby="newLvHelp" form="new_lv_form" id="new_lv" name="new_lv"
                        maxlength="14" type="text" required>
                    <div id="newLvHelp" class="form-text">level string must be full-width character string.
                    </div>
                </form>
                <div class="modal-footer">
                    <input type=submit class="btn btn-primary" type="button" form="new_lv_form">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}