{% load staticfiles %}
<!DOCTYPE html>
<html>
<head>
    <title>Swagger UI</title>
    <link href='//fonts.googleapis.com/css?family=Droid+Sans:400,700' rel='stylesheet' type='text/css'/>
    <link href='{% static "rest_framework_swagger/css/hightlight.default.css" %}' media='screen' rel='stylesheet' type='text/css'/>
    <link href='{% static "rest_framework_swagger/css/screen.css" %}' media='screen' rel='stylesheet' type='text/css'/>
    <script src='{% static "rest_framework_swagger/lib/jquery-1.8.0.min.js" %}' type='text/javascript'></script>
    <script src='{% static "rest_framework_swagger/lib/jquery.slideto.min.js" %}' type='text/javascript'></script>
    <script src='{% static "rest_framework_swagger/lib/jquery.wiggle.min.js" %}' type='text/javascript'></script>
    <script src='{% static "rest_framework_swagger/lib/jquery.ba-bbq.min.js" %}' type='text/javascript'></script>
    <script src='{% static "rest_framework_swagger/lib/handlebars-1.0.rc.1.js" %}' type='text/javascript'></script>
    <script src='{% static "rest_framework_swagger/lib/underscore-min.js" %}' type='text/javascript'></script>
    <script src='{% static "rest_framework_swagger/lib/backbone-min.js" %}' type='text/javascript'></script>
    <script src='{% static "rest_framework_swagger/lib/swagger.js" %}' type='text/javascript'></script>
    <script src='{% static "rest_framework_swagger/swagger-ui.min.js" %}' type='text/javascript'></script>
    <script src='{% static "rest_framework_swagger/lib/highlight.7.3.pack.js" %}' type='text/javascript'></script>

    <script type="text/javascript">
    $(function () {
        window.swaggerUi = new SwaggerUi({
                discoveryUrl:"{{ settings.discovery_url }}",
                apiKey:"{{ settings.api_key }}",
                dom_id:"swagger-ui-container",
                supportHeaderParams: false,
                supportedSubmitMethods: {{ settings.enabled_methods }},
                onComplete: function(swaggerApi, swaggerUi){
                    if(console) {
                        console.log("Loaded SwaggerUI")
                        console.log(swaggerApi);
                        console.log(swaggerUi);
                    }
                  $('pre code').each(function(i, e) {hljs.highlightBlock(e)});
                },
                onFailure: function(data) {
                    if(console) {
                        console.log("Unable to Load SwaggerUI");
                        console.log(data);
                    }
                },
                docExpansion: "none"
            });

            window.swaggerUi.load();
        });

    </script>
</head>

<body>
<div id='header'>
    <div class="swagger-ui-wrap">
        <a id="logo" href="http://swagger.wordnik.com">swagger</a>

        <form id='api_selector'>
            <div class='input icon-btn'>
                <img id="show-pet-store-icon" src="{% static 'rest_framework_swagger/images/pet_store_api.png' %}" title="Show Swagger Petstore Example Apis">
            </div>
            <div class='input icon-btn'>
                <img id="show-wordnik-dev-icon" src="{% static 'rest_framework_swagger/images/wordnik_api.png' %}" title="Show Wordnik Developer Apis">
            </div>
            <div class='input'><input placeholder="http://example.com/api" id="input_baseUrl" name="baseUrl"
                                      type="text"/></div>
            <div class='input'><input placeholder="api_key" id="input_apiKey" name="apiKey" type="text"/></div>
            <div class='input'><a id="explore" href="#">Explore</a></div>
        </form>
    </div>
</div>

<div id="message-bar" class="swagger-ui-wrap">
    &nbsp;
</div>

<div id="swagger-ui-container" class="swagger-ui-wrap">

</div>

</body>

</html>
