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


{% block title %}Welcome {{ title }}{% endblock %}
{% block head %}
{{super()}}
<style>
.dropdown-submenu {
    position: relative;
}

.dropdown-submenu ul li a:hover {
    background-color: #bfbfbf;
}

.dropdown-submenu .dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -1px;
}
.dropdown-menu li a:hover {
    background-color: #bfbfbf;
}
</style>
{% endblock %}

{% block navbar %}
<nav class="navbar navbar-inverse">
    <div class="container-fluid">
        <div class="navbar-header">
            <a class="navbar-brand" href="{{ url_for('index') }}">{{ title }}</a>
        </div>
        <div class="collapse navbar-collapse">
            <ul class="nav navbar-nav">
                <div class="dropdown" style="padding:10px;">
                    <button class="btn btn-danger dropdown-toggle" type="button" data-toggle="dropdown">
                        API Endpoints
                        <span class="caret"></span>
                    </button>
                    <ul class="dropdown-menu">
                        <li class="dropdown-submenu" style="position: relative;">
                            {% for group, endpoints in route_dict.items() %}
                            <a class="test" tabindex="-1" href="#">{{ group }} <span class="caret"></span></a>
                            <ul class="dropdown-menu">
                                {% for endpoint in endpoints %}
                                <li><a tabindex="-1" href="{{ endpoint.path }}"">{{ endpoint.name }}</a></li>
                                {% endfor %}
                            </ul>
                            {% endfor %}
                        </li>
                    </ul>
                </div>
            </ul>
            <ul class="nav navbar-nav navbar-right">
                <li><a href="{{ url_for('token') }}"><span class="glyphicon glyphicon-user"></span> Example Button </a></li>
            </ul>
        </div>
    </div>
</nav>
{% endblock %}


{% block content %}
    <div class="container">
        {% with messages = get_flashed_messages() %}
        {% if messages %}
            {% for message in messages %}
            <div class="alert alert-info" role="alert">{{ message }}</div>
            {% endfor %}
        {% endif %}
        {% endwith %}
        

        {% block app_content %}
        {% endblock %}


{% if 'GET' in allowed_methods %}
    <form id="get-form" class="pull-right">
        <fieldset>
            <div class="btn-group format-selection">
                <a class="btn btn-primary js-tooltip" href='{{ request.url }}' rel="nofollow" title="Make a GET request on the {{ name }} resource">GET</a>

                <button class="btn btn-primary dropdown-toggle js-tooltip" data-toggle="dropdown" title="Specify a format for the GET request">
                    <span class="caret"></span>
                </button>
                <ul class="dropdown-menu">
                    {% for format in available_formats %}
                        <li>
                            <a class="js-tooltip format-option" href='<!-- add_query_param request api_settings.URL_FORMAT_OVERRIDE format -->' rel="nofollow" title="Make a GET request on the {{ name }} resource with the format set to `{{ format }}`">{{ format }}</a>
                        </li>
                    {% endfor %}
                </ul>
            </div>

        </fieldset>
    </form>
{% endif %}

<!--{% if 'OPTIONS' in allowed_methods %}
    <form class="button-form" action="{{ request.url }}" method="POST" class="pull-right">
        <- csrf_token ->
        <input type="hidden" name="_method" value="OPTIONS" />
        <button class="btn btn-primary js-tooltip" title="Make an OPTIONS request on the resource">OPTIONS</button>
    </form>
{% endif %}-->

{% if 'DELETE' in allowed_methods %}
    <form class="button-form" action="{{ request.url }}" method="POST" class="pull-right">
        <!-- csrf_token -->
        <input type="hidden" name="_method" value="DELETE" />
        <button class="btn btn-danger js-tooltip" title="Make a DELETE request on the resource">DELETE</button>
    </form>
{% endif %}


{% if request.endpoint not in ['index','token','thanks'] %}
<div class="content-main">
    <div class="page-header"><h1>{{ view_name }}</h1></div>
    {% if view_description %}
    <div style="margin-top: -10px; margin-bottom: 10px">{{ view_description|safe }}</div>{% endif %}
    <div class="request-info" style="clear: both" >
        <pre class="prettyprint"><b>{{ request.method }}</b> {{ request.url | replace("http://","https://") }}</pre>
    </div>
    <div class="response-info">
        <pre class="prettyprint">
            <div class="meta nocode"><b>HTTP {{ status }}</b>{% autoescape off %}</div>
            {% if content %}{{ content|urlize_quoted_links }}{% endif %}<!-- |urlize_quoted_links --></pre>{% endautoescape %}
    </div>
</div>


        {% if 'POST' in allowed_methods or 'PUT' in allowed_methods or 'PATCH' in allowed_methods %}
        <div>
            <div class="well">
                <div id="generic-content-form">
                    <form action="{{ request.url }}" method="POST" class="form-horizontal">
                        <fieldset>
<div class="control-group">
<label for="id__content_type" class="control-label">Media type:</label>
<div class="controls">
    <select id="id__content_type" name="_content_type">
<option value="application/json" selected="selected">application/json</option>
<option value="application/x-www-form-urlencoded">application/x-www-form-urlencoded</option>
<option value="multipart/form-data">multipart/form-data</option>
</select>
    <span class="help-block"></span>
</div>
</div>
                        <div class="control-group">
                            <label for="id__content" class="control-label">Content:</label>
                            <div class="controls">
                                <textarea name="_content" cols="40" rows="10"></textarea>
                            </div>
                        </div>
                        <div class="form-actions">
                            {% if 'POST' in allowed_methods %}
                            <button class="btn btn-primary" title="Make a POST request on the resource">POST</button>
                            {% endif %}
                            {% if 'PUT' in allowed_methods %}
                            <button class="btn btn-primary js-tooltip" name="_method" value="PUT" title="Make a PUT request on the resource">PUT</button>
                            {% endif %}
                            {% if 'PATCH' in allowed_methods %}
                            <button class="btn btn-primary js-tooltip" name="_method" value="PATCH" title="Make a PATCH request on the resource">PATCH</button>
                            {% endif %}
                            </div>
                        </fieldset>
                    </form>
                </div>
            </div>
        </div>
        {% endif %}

</div>
<!-- END content-main -->
{% endif %}
    </div>
{% endblock %}

{% block scripts %}
{{super()}}
<script>
    $(document).ready(function(){
      $('.dropdown-submenu a.test').on("click", function(e){
        $(this).next('ul').toggle();
        e.stopPropagation();
        e.preventDefault();
      });
    });
    $('#myCollapsible').collapse({
        toggle: false
    })
</script>
{% endblock %}