<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>{% block title %}HTCondorView{% endblock title %}</title>
    <base href="{{ base }}">
    {% block favicon %}
        <link rel="icon" type="image/png" href="static/favicon.png">
    {% endblock favicon %}

    {% block stylesheets %}
        <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.14.1/themes/smoothness/jquery-ui.css">
        <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css" 
              rel="stylesheet" 
              integrity="sha384-sRIl4kxILFvY47J16cr9ZwB07vP4J8+LH7qKQnuqkuIAvNWLzeN8tE5YBujZqJLB" crossorigin="anonymous">
        <link rel="stylesheet" 
              href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css">
        <link rel="stylesheet" href="static/htcondorview.css?version=8"/>
    {% endblock stylesheets %}

    {% block js %}
        <script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.slim.min.js" 
                integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" 
                crossorigin="anonymous"></script>
        <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.8/dist/umd/popper.min.js" 
                integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r" 
                crossorigin="anonymous"></script>
        <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/js/bootstrap.bundle.min.js" 
                integrity="sha384-FKyoEForCGlyvwx9Hj09JcYn3nv7wiPVlz7YYwJrWVcXK/BmnVDxM+D2scQbITxI" 
                crossorigin="anonymous"></script>

        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.14.1/jquery-ui.min.js"></script> 
        <script src="static/htcondorview.js?version=13"></script>
        <script src="https://www.gstatic.com/charts/loader.js"></script>
        <script>
            google.charts.load('current', {packages: ['corechart','table','treemap','annotatedtimeline']});
            google.charts.setOnLoadCallback(googleChartsLoaded);
        </script>
		<script>
		   let lastReloadTime = new Date().getTime();
           document.addEventListener("visibilitychange", function() {
               if ((!document.hidden) && (new Date().getTime() - lastReloadTime >= 3700000)){
		          lastReloadTime = new Date().getTime();
                  location.reload();
               }
           });
        </script>
        <script>
        /**
         * Util to format graph query strings by replacing newlines between parameters with '&' characters, 
         * and escaping '%' characters.
         */
        function urlEscapeGraphQuery(query) {
            return query.replace(/\n\s*/g,'&').replace(/^\&|\&$/,'').replace(/%/g, '%25');
        }

        /**
         * Enable bootstrap tooltips
         */
        $(function () {
            $('[data-toggle="tooltip"]').tooltip()
        })
        </script>

        <script>
            /**
             * Util for showing help modals
             */
            function showModal(modalId) {
                const modal = new bootstrap.Modal(document.getElementById(modalId));
                modal.show();
            }
        </script>

    {% endblock js %}

    {% block style %}{% endblock style %}

    {% block head %}{% endblock head %}
    
</head>
<body>
    <nav class="navbar sticky-top navbar-expand-md navbar-dark bg-dark">
			<div class="navbar-logo">
                <a href="{{url_for('landing.ce_user_landing_page')}}"><img width="145px" src="static/navbar_logo.svg"></a>
			</div>
		
			<div class="navbar-brand abs container">
               <div class="row flex-nowrap">
                    {% if prev_page %}
                    <div class="navbar-nav col site-link">
                        <a class="nav-link" href="{{ prev_page.url }}" 
                           id="prev-page-link"
                           data-toggle="tooltip" 
                           data-placement="left" 
                            title="{{ prev_page.tooltip }}">
                            <div style="display: flex; flex-direction: row;">
                                <i class="bi bi-chevron-left"></i>
                                <span style="white-space: pre-wrap;">{{ prev_page.title }}</span>
                            </div>
                        </a>
                    </div>
                    {% endif %} 

                    <div class="col">
                        <span>{{ page_title }}</span>
                        {% if page_subtitle %}
                        <br/>
                        <span style="font-size: 1rem;"> {{ page_subtitle }} </span>
                        {% endif %}
                    </div>

                    {% if next_page %}
                    <div class="navbar-nav col site-link">
                        <a class="nav-link" href="{{ next_page.url }}" 
                            id="next-page-link"
                            data-toggle="tooltip" 
                            data-placement="right" 
                            title="{{ next_page.tooltip }}">
                            <div style="display: flex; flex-direction: row;">
                                <span style="white-space: pre-wrap;">{{ next_page.title }}</span>
                                <i class="bi bi-chevron-right"></i>
                            </div>
                        </a>
                    </div>
                    {% endif %} 
               </div>
			</div>


            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
                    aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
            </button>

            <div class="collapse navbar-collapse" id="navbarSupportedContent">
                <ul class="navbar-nav ml-auto">
                    {% for name, link in linkmap.items() %}
                        {% if link is string %}
                            <li class="nav-item">
                                <a class="nav-link" href="{{ link }}" onclick="window.location='{{ link }}'+'?' + ['host', 'r'].map(param => `${param}=${new URLSearchParams(window.location.search).get(param)}`).filter(param => param.includes('=null') === false).join('&');return false;">{{ name }}</a>
                            </li>
                        {% else %}
                            <li class="nav-item dropdown">
                                <a class="nav-link dropdown-toggle" href="#" id="{{ name }}" role="button"
                                   data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                    {% filter title %}{{ name }}{% endfilter %}
                                </a>

                                {% if loop.revindex < 3 %}
								<div class="dropdown-menu dropdown-menu-right" aria-labelledby="{{ name }}">
								{% else %}
                                <div class="dropdown-menu dropdown-menu" aria-labelledby="{{ name }}">
								{% endif %}
                                    {% for subname, sublink in link.items() %}
                                        <a class="dropdown-item" href="{{ sublink }}" onclick="window.location='{{ sublink }}'+'?' + ['host', 'r'].map(param => `${param}=${new URLSearchParams(window.location.search).get(param)}`).filter(param => param.includes('=null') === false).join('&');return false;">{{ subname }}</a>
                                    {% endfor %}
                                </div>
                            </li>
                        {% endif %}
                    {% endfor %}
                </ul>
            </div>


    </nav>

{% macro get_vaxis(resource) -%}
    {% set vaxis_options = '&vAxis.maxValue=3&vAxis.format=short' %}
    {%- if resource == 'Memory' -%}
        Gigabytes (GBs, 1K=TB, 1M=PB){{ vaxis_options }}
    {%- elif resource == 'Cpus' -%}
        CPU Cores{{ vaxis_options }}
    {%- elif resource == 'Gpus' -%}
        GPU Devices{{ vaxis_options }}
    {%- elif resource == 'Disk' -%}
        Gigabytes (GBs, 1K=TB, 1M=PB){{ vaxis_options }}
    {%- elif resource == 'Bcus' -%}
        BCUs (1 CPU/4GB Mem/4GB Disk){{ vaxis_options }}
    {%- else -%}
        {{ resource }}{{ vaxis_options }}
    {%- endif -%}
{%- endmacro %}

{% macro get_column(resource) -%}
    {%- if resource == 'Memory' -%}
        Memory&div=Memory,1000,Memory&unselect=Memory
    {%- else -%}
        {{ resource }}
    {%- endif -%}
{%- endmacro %}

{% block body %}
{% endblock body %}

<!-- vizlog is where errors will go. -->
<div id="vizlog"></div>

</body>
</html>
