{% extends 'base.html' %}
{% import "bootstrap/wtf.html" as wtf %}

{% block head %}
    {{ super() }}
    {% block title %}
        <title>GitHubHealth: {{ ghh.user.name }}</title>
    {% endblock %}
{% endblock %}


{% block body %}

    {% block navbar %}
    {% endblock %}

    {% block header %}
        {{ super() }}
    {% endblock %}

    {% block loading %}
        {{ super() }}
    {% endblock %}

    {% block content %}
        <div class="user-content">
            <p>Logged in as <a href="{{ ghh.user.url }}">{{ ghh.user.name }}</a>.</p>
            <div class="health-link">
                <p style="width: 280px; margin: 0px;">Check out the health of your repos (combined) here</p>
                <a style="position: relative; top: -5px; left: -5px;" href="{{ url_for('status', resource_name=ghh.user.name) }}" class="quicklink" target="_blank">
                    <img class="health-icon" src="{{ url_for('static', filename='favicon.ico') }}">
                </a>
            </div>
            <p style="position: relative; top: -5px;">Or you can browse the resources you have liked or contributed to.  Here are the links to their GitHub pages and their health statuses.</p>
        </div>
        <div class="user-table">
            {{ ghh.user.metadata_html|safe }}
        </div>
        <form action="" method="post" class="form limit" id="more_form" role="form">
            <div>
                {{ more_form.csrf_token() }}
                results
                <input class="nbr-input" name="input_from" required type="number" value={{ ghh.user.metadata.input_from }} data-toggle="tooltip">
                to
                <input class="nbr-input" name="input_to" required type="number" value={{ ghh.user.metadata.input_to }} data-toggle="tooltip">
                of
                {{ ghh.user.metadata.total }}
                <input class="btn btn-more btn-primary" id="metadata-more" name="more" onclick="loading_search()" type="submit" value="more...">
            </div>
        </form>
        <form action="" method="post" class="form search-request" id="search_form" role="form">
            You can also search for other resources you haven't liked or contributed to (users, orgs, repos):
            {{ search_form.csrf_token() }}
            <div class="form-group" id="search-request">
                <input id="search_request" name="search_request" type="text" value data-toggle="tooltip" title="Enter a search term.">
                <button class="btn-search" id="search" name="search" onclick="loading_search()" type="submit" value="Search" data-toggle="tooltip" title="search!">
                    <img class="search" src="{{ url_for('static', filename='assets/search.svg') }}">
                </button>
            </div>
            <div class="form-check">
                <label class="form-check-label">
                    <input class="form-check-input" checked id="search_users" name="search_users" type="checkbox" value="y" data-toggle="tooltop" title="include users in search?"> users
                </label>
                <div style="min-width: 10px; max-width: 10px;"></div>
                <label class="form-check-label">
                    <input class="form-check-input" checked id="search_orgs" name="search_orgs" type="checkbox" value="y" data-toggle="tooltip" title="include orgs in search?"> orgs
                </label>
                <div style="min-width: 10px; max-width: 10px;"></div>
                <label class="form-check-label">
                    <input class="form-check-input" checked id="search_repos" name="search_repos" type="checkbox" value="y" data-toggle="tooltip" title="include repos in search?"> repos
                </label>
            </div>
            <div class="form-group" id="ignore">
                <label class="form-control-label ignore" for="ignore">ignore</label>
                <input class="form-control" name="ignore" type="text" value data-toggle="tooltip" title="exclude from search results. Separate with comma (,).">
            </div>
            <input class="btn btn-primary" id="search" name="search" onclick="loading_search()" type="submit" value="Search">
        </form>
        {{ super() }}
    {% endblock %}

    {% block error_warning %}
        {{ super() }}
    {% endblock %}

    {% block footer %}
        {{ super() }}
    {% endblock %}


    {% block scripts %}
        {{ super() }}
        <script>
            $SCRIPT_ROOT = {{ request.script_root|tojson }};
            // update all table "health" elements to a link for that repo status
            $("#T_user-metadata").children("tbody").children("tr").children("td").each(function () {
                if (this.cellIndex == 3) {
                    if (this.innerText == "health") {
                        let this_repo_owner = this.previousElementSibling.previousElementSibling.innerText;
                        let this_repo_name = this.previousElementSibling.innerText;
                        let this_repo_status_url = $SCRIPT_ROOT.concat("/repo_status/", this_repo_owner, "/", this_repo_name);
                        let this_img_tag = '<img class="health-icon" src="'.concat($SCRIPT_ROOT, "/static/favicon.ico", '">');
                        this.innerHTML = '<a href="'.concat(this_repo_status_url,  '" class="quicklink" target="_blank">', this_img_tag, '</a>');
                    };
                };
            });
        </script>
    {% endblock %}

{% endblock %}
