<!DOCTYPE html>
<html class="no-js">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title>{{ supporttools_parent_app|default:"AXDD" }} Support Tools</title>
        <meta name="description" content="">
        <meta name="HandheldFriendly" content="True">
        <meta name="MobileOptimized" content="320">
        <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, minimal-ui">
        <meta http-equiv="cleartype" content="on">

        {% load static %}

        <!-- favicon 16px and 32px combined -->
        <link rel="shortcut icon" href="{% static 'uw/ico/favicon.ico' %}" type="image/x-icon">

        <!-- ios icons -->
        <link rel="apple-touch-icon-precomposed" sizes="180x180" href="{% static 'uw/ico/apple-touch-icon-180x180-precomposed.png' %}">
        <link rel="apple-touch-icon-precomposed" sizes="152x152" href="{% static 'uw/ico/apple-touch-icon-152x152-precomposed.png' %}">
        <link rel="apple-touch-icon-precomposed" sizes="144x144" href="{% static 'uw/ico/apple-touch-icon-144x144-precomposed.png' %}">
        <link rel="apple-touch-icon-precomposed" sizes="120x120" href="{% static 'uw/ico/apple-touch-icon-120x120-precomposed.png' %}">
        <link rel="apple-touch-icon-precomposed" sizes="114x114" href="{% static 'uw/ico/apple-touch-icon-114x114-precomposed.png' %}">
        <link rel="apple-touch-icon-precomposed" sizes="76x76" href="{% static 'uw/ico/apple-touch-icon-76x76-precomposed.png' %}">
        <link rel="apple-touch-icon-precomposed" sizes="72x72" href="{% static 'uw/ico/apple-touch-icon-72x72-precomposed.png' %}">
        <link rel="apple-touch-icon-precomposed" sizes="57x57" href="{% static 'uw/ico/apple-touch-icon-57x57-precomposed.png' %}">
        <link rel="apple-touch-icon-precomposed" href="{% static 'uw/ico/apple-touch-icon-precomposed.png' %}">

        <!-- android icons -->
        <link rel="shortcut icon" sizes="196x196" href="{% static 'uw/ico/android-196x196.png' %}">

        <!-- windows8 tile icons -->
        <meta name="msapplication-TileColor" content="#4b2e84">
        <meta name="msapplication-TileImage" content="{% static 'uw/ico/win8-144x144.png' %}">
        <meta name="msapplication-square70x70logo" content="{% static 'uw/ico/win8-70x70.png' %}" />
        <meta name="msapplication-square150x150logo" content="{% static 'uw/ico/win8-150x150.png' %}" />
        <meta name="msapplication-wide310x150logo" content="{% static 'uw/ico/win8-310x150.png' %}" />
        <meta name="msapplication-square310x310logo" content="{% static 'uw/ico/win8-310x310.png' %}" />

        <!-- google fonts -->
        <link href='//fonts.googleapis.com/css?family=Yanone+Kaffeesatz:400,300,700,200' rel='stylesheet' type='text/css'>

        <!-- css dependencies -->
        <link rel="stylesheet" type="text/css" href="//cdn.datatables.net/1.10.4/css/jquery.dataTables.min.css" />
        <link rel="stylesheet" type="text/css" href="//netdna.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" />
        <link rel="stylesheet" type="text/css" href="//netdna.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.css" />
        <link rel="stylesheet" type="text/css" href="//cdn.datatables.net/plug-ins/9dcbecd42ad/integration/bootstrap/3/dataTables.bootstrap.css" />
        <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-jsonview/1.2.3/jquery.jsonview.min.css" />


        <!-- local css -->
        <link rel="stylesheet" type="text/less" href="{% static 'supporttools/css/mobile.less' %}">

        {% if not request.is_mobile and not request.is_tablet %}
        <!-- add desktop styles -->
        <link rel="stylesheet" type="text/less" href="{% static 'supporttools/css/desktop.less' %}">
        {% endif %}

        {% block extra_css %}{% endblock %}

        <!-- chart.js required in head to work -->
        <script src="{% static 'vendor/js/chart.min.js' %}"></script>

        <script src="{% static 'vendor/js/less-1.7.0.min.js' %}"></script>
    </head>
    <body>

        <div class="header">
            <div class="header-inner">

                <div class="clearfix tool-header">
                    <h1 class="pull-left tool-name"><a href="{{ supporttools_parent_app_url|default:'/' }}">{{ supporttools_parent_app|default:"Back" }}</a> <span class="tool-support">Support</span></h1>
                    <div class="pull-right tool-menu" style="display:inline-block;"><a href="#" id="tool_menu_button"><i class="fa fa-bars"></i></a></div>
                </div>

                <div id="tool_menu" class="tool-list hide-div" role="navigation">

                    <div class="clearfix tool-app">
                        <div class="pull-right" style="display:inline-block;"><i class="fa fa-user"></i>&nbsp;{{supporttools_user}}
                        {% url 'saml_logout' as logout_url %}
                        {% if logout_url %}
                        &nbsp;<a class="label label-danger" href="{{ logout_url }}">Logout</a>
                        {% endif %}
                        </div>
                    </div>

                    <h2 class="sr-only">Tool Navigation</h2>

                    <div class="tool-list-inner">
                        {% load sidebar_links %}
                        {% sidebar_links %}
                    </div>

                </div>

            </div>
        </div>

        <div role="tabpanel" id="restclient-tabs" style="display: none;">
          <!-- Nav tabs -->
          <ul class="nav nav-tabs" role="tablist">
            <li role="presentation" class="active"><a href="#digested_json" aria-controls="digested_json" role="tab" data-toggle="tab">Digested JSON</a></li>
            <li role="presentation"><a href="#jsonview_json" aria-controls="jsonview_json" role="tab" data-toggle="tab">Collapsed JSON</a></li>
            <li role="presentation"><a href="#raw_json" aria-controls="raw_json" role="tab" data-toggle="tab">Raw JSON</a></li>
          </ul>
          <!-- Tab panes -->
          <div class="tab-content">
            <div role="tabpanel" class="tab-pane active" id="digested_json"><div class="restclients-digested-response"></div></div>
            <div role="tabpanel" class="tab-pane" id="jsonview_json"><div class="jsonview-response"></div></div>
            <div role="tabpanel" class="tab-pane" id="raw_json"><div class="main-content"></div></div>
          </div>
        </div>

        <div class="content">
            <div class="content-inner">
            <!-- add your site or application content here -->
            {% block content %}{% endblock %}
            </div>
        </div>

        <div class="footer">
            <div class="footer-tagline">Copyright &copy; 2012-{% now "Y" %}<br/>UW Information Technology, AXDD</div>
        </div>

        <!-- dev bar -->
        <div id="developer">
            <span class="label label-danger">{% if request.is_mobile %}mobile{% elif request.is_tablet %}tablet{% else %}desktop{% endif %}</span>
        </div>

        <!-- javascript dependencies -->
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
        <script>window.jQuery || document.write('<script src="{% static "vendor/js/jquery-1.10.2.min.js" %}"><\/script>')</script>
        <script src="//netdna.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
        <script src="//cdn.datatables.net/1.10.4/js/jquery.dataTables.min.js"></script>
        <script src="//cdn.datatables.net/plug-ins/9dcbecd42ad/integration/bootstrap/3/dataTables.bootstrap.js"></script>
        <script src="//cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.0.12/handlebars.min.js"></script>
        <script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/moment.min.js"></script>
        <script src="//cdnjs.cloudflare.com/ajax/libs/jquery-jsonview/1.2.3/jquery.jsonview.min.js"></script>
        <script type="text/javascript">
            window.support = {
                is_mobile: {% if request.user_agent.is_mobile %}true{% else %}false{% endif %},
                is_tablet: {% if request.user_agent.is_tablet %}true{% else %}false{% endif %},
                is_desktop: {% if request.user_agent.is_pc %}true{% else %}false{% endif %}
            };
        </script>

        <!-- local javascript -->
        <script src="{% static 'supporttools/js/main.js' %}"></script>
        {% block extra_js %}{% endblock %}
    </body>
</html>
