{% extends "framework.html" %}

{% block content %}

{% block action_modals %}
{% include "modals/objects/edit_user_modal.html" %}
{% include "modals/objects/edit_password_modal.html" %}
{% include "modals/collections/new_prediction_setting_modal.html" %}
{% include "modals/objects/manage_api_token_modal.html" %}
{% include "modals/objects/delete_user_modal.html" %}
{% endblock action_modals %}

<div class="panel-group" id="user-detail">
    <div class="panel panel-default">
        <div class="panel-heading" id="headingPanel" style="font-size:2rem;height: 46px">
            {{ user.username }}
            <div id="actionsButton"
                 style="float: right;font-weight: normal;font-size: medium;position: relative; top: 50%; transform: translateY(-50%);z-index:100;display: none;"
                 class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button"
                                     aria-haspopup="true" aria-expanded="false"><span
                    class="glyphicon glyphicon-wrench"></span> Actions <span class="caret"></span><span
                    style="padding-right:1em"></span></a>
                <ul id="actionsList" class="dropdown-menu">
                    {% block actions %}
                    {% include "actions/objects/user.html" %}
                    {% endblock %}
                </ul>
            </div>
        </div>
        <div class="panel-body">
            <p> On this page you can modify your account or set preferences such as prediction settings.</p>
        </div>
    </div>
    <!-- Default Package -->
    <div class="panel panel-default panel-heading list-group-item" style="background-color:silver">
        <h4 class="panel-title">
            <a id="default-package-link" data-toggle="collapse" data-parent="#user-detail"
               href="#default-package">Default Package</a>
        </h4>
    </div>
    <div id="default-package" class="panel-collapse collapse in">
        <div class="panel-body list-group-item">
            <li class="list-group-item">
                <a href="{{ user.default_package.url }}"> {{ user.default_package.name }}</a>
            </li>
        </div>
    </div>

    <!-- Groups -->
    {% if meta.available_groups|length > 0 %}
    <div class="panel panel-default panel-heading list-group-item" style="background-color:silver">
        <h4 class="panel-title">
            <a id="group-links" data-toggle="collapse" data-parent="#user-detail"
               href="#groups">Groups</a>
        </h4>
    </div>
    <div id="groups" class="panel-collapse collapse in">
        <div class="panel-body list-group-item">
            {% for g in meta.available_groups %}
            <li class="list-group-item">
                <a href="{{ g.url }}"> {{ g.name }}</a>
            </li>
            {% endfor %}
        </div>
    </div>
    {% endif %}

    <!-- Current Prediction Settings -->
    <div class="panel panel-default panel-heading list-group-item" style="background-color:silver">
        <h4 class="panel-title">
            <a id="current-prediction-setting-links" data-toggle="collapse" data-parent="#user-detail"
               href="#current-prediction-setting">Current Prediction Setting</a>
        </h4>
    </div>
    <div id="current-prediction-setting" class="panel-collapse collapse in">
        <div class="panel-body list-group-item">
            <table class="table table-bordered table-hover">
                <tr style="background-color: rgba(0, 0, 0, 0.08);">
                    <th scope="col" width="20%">Parameter</th>
                    <th scope="col" width="80%">Value</th>
                </tr>
                <tbody>
                {% if user.default_setting.model %}
                <tr>
                    <td width="20%">Model</td>
                    <td width="80%">
                        <table width="100%" class="table table-bordered table-hover">
                            <tbody>
                            <tr>
                                <td colspan="2">
                                    <li class="list-group-item">
                                        <a href="{{user.default_setting.model.url}}">
                                            {{ user.default_setting.model.name }}
                                        </a>
                                    </li>
                                </td>
                            </tr>
                            <tr>
                                <th width="20%">Model Parameter</th>
                                <th width="80%">Parameter Value</th>
                            </tr>
                            <tr>
                                <td width="20%">
                                    Threshold
                                </td>
                                <td width="80%">
                                    {{ user.default_setting.model_threshold }}
                                </td>
                            </tr>
                            </tbody>
                        </table>
                    </td>
                </tr>
                {% endif %}
                {% if user.default_setting.rule_packages.all %}
                <tr>
                    <td width="20%">Rule Packages</td>
                    <td width="80%">
                        <table width="100%" class="table table-bordered table-hover">
                            <tbody>
                            <tr>
                                <td colspan="2">
                                    {% for p in user.default_setting.rule_packages.all %}
                                    <li class="list-group-item">
                                        <a href="{{p.url}}">
                                            {{ p.name }}
                                        </a>
                                    </li>
                                    {% endfor %}
                                </td>
                            </tr>
                            </tbody>
                        </table>
                    </td>
                </tr>
                {% endif %}
                <tr>
                    <td>
                        <p>Max Nodes</p>
                    </td>
                    <td>
                        <p>{{ user.default_setting.max_nodes }}</p>
                    </td>
                </tr>
                <tr>
                    <td>
                        <p>Max Depth</p>
                    </td>
                    <td>
                        <p>{{ user.default_setting.max_depth }}</p>
                    </td>
                </tr>
                </tbody>
            </table>
        </div>
    </div>
</div>
{% endblock content %}