
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">

        <link rel="stylesheet" href="{{ theme_path }}" />

        <script src="/static/js/terrareg/user-preferences.js"></script>

        <script defer src="/static/js/fontawesome/all-v6.0.0.js"></script>
        <script src="/static/js/jquery/jquery-6.3.0.min.js"></script>
        <script src="/static/js/jquery/jquery.cookie-1.4.1.js"></script>

        <!-- Data tables -->
        <link rel="stylesheet" href="/static/css/datatables/dataTables.bulma-1.11.5.min.css" />
        <!-- <script src="/static/js/datatables/jquery.dataTables-1.11.5.min.js"></script> -->
        <script src="https://cdn.datatables.net/1.11.5/js/jquery.dataTables.js" ></script>
        <script src="/static/js/datatables/dataTables.bulma-1.11.5.min.js"></script>

        <link rel="stylesheet" href="/static/css/datatables/responsive.bulma-2.3.0.min.css" />
        <script src="/static/js/datatables/dataTables.responsive-2.3.0.min.js"></script>
        <script src="/static/js/datatables/responsive.bulma-2.3.0.min.js"></script>
        <script src="/static/js/datatables/full_numbers_no_ellipses.js"></script>
        
        <link rel="stylesheet" type="text/css" href="/static/css/datatables/rowGroup.bulma-1.2.0.min.css"/>
        <script type="text/javascript" src="/static/js/datatables/dataTables.rowGroup-1.2.0.min.js"></script>

        
        <link rel="stylesheet" type="text/css" href="/static/css/datatables/buttons.dataTables-2.2.3.min.css">
        <script src="/static/js/datatables/dataTables.buttons-2.2.3.min.js"></script>
        
        <!-- Navigo router -->
        <script src="/static/js/navigo/navigo-8.11.1.min.js"></script>

        <link rel="stylesheet" href="/static/css/terrareg.css">

        <link rel="icon" type="image/x-icon" href="/static/images/favicon.ico" />

        <meta name="viewport" content="width=device-width, initial-scale=1.0"/>

        <script src="/static/js/terrareg/config.js"></script>
        <script src="/static/js/terrareg/module_provider.js"></script>
        <script src="/static/js/terrareg/provider.js"></script>

        <script>
          function navbar_search_modules() {
            let search_string = document.getElementById('navBarSearchInput').value;
            window.location.href = '/search?q=' + encodeURIComponent(search_string);
          }
          function navbar_search_keyup(event) {
            // If enter
            if (event.keyCode === 13) {
              // Cancel default action
              event.preventDefault();
              // Trigger search
              navbar_search_modules();
            }
          }

          async function setupPageLogin() {
            let loggedIn = await isLoggedIn(); 
            if (loggedIn.authenticated) {
              $('#navbar_login_link').attr('href', '/logout');
              $('#navbar_login_icon').removeClass('fa-lock');
              $('#navbar_login_icon').addClass('fa-right-from-bracket');
              $('#navbar_login_span').html('Logout');

              let showCreateModule = false;
              if (loggedIn.site_admin) {
                // Show settings drop-down
                $('#navbarSettingsDropdown').css('display', 'flex');

                // Show create namespace button
                $('#navbarCreateNamespaceButton').css('display', 'block');

                showCreateModule = true;
              } else if (Object.values(loggedIn.namespace_permissions).indexOf('FULL') !== -1) {
                showCreateModule = true;
              }
              if (showCreateModule) {
                // Show create drop-down
                $('#navbarCreateDropdown').css('display', 'flex');
                // Show create module button
                $('#navbarCreateModuleButton').css('display', 'block');
                // Show create provider button
                $('#navbarCreateProviderButton').css('display', 'block');
              }

            }{% if TEMPLATE_NAME != "error.html" %} else if (!loggedIn.read_access && window.location.pathname !== '/login') {
              // If not logged in and read access is not allowed,
              // and not currently redirect to login page
              window.location.href = '/login';
            }{% endif %}
          }

          $(document).ready(() => {
            setupPageLogin();
            populateFooterVersionText();
          });
        </script>

        <style>
          /* Stop links in cards from being blue */
          .card a {
            color: #000000;
          }
        </style>

	<title>{% block title %}{% endblock %} - {{ terrareg_application_name }}</title>

        {% block header %}{% endblock %}
    </head>


    <body>
        {% if SITE_WARNING %}
        <div id="site-warning">
          {{SITE_WARNING}}
        </div>
        {% endif %}
        <nav class="navbar is-transparent">
            <div class="navbar-brand">
              <a class="navbar-item" href="/">
              <img src="{{ terrareg_logo_url }}" alt="{{ terrareg_application_name }}" width="80">
            </a>
              <div class="navbar-burger burger" data-target="navbarRegistryDropdown">
                <span></span>
                <span></span>
                <span></span>
              </div>
            </div>
        
            <div  class="navbar-menu">
              <div class="navbar-start">
                <a class="navbar-item" href="/">Home</a>

                <div id="navbarModulesDropdown" class="navbar-item has-dropdown is-hoverable">
                  <a class="navbar-link" href="#">Modules</a>
                  <div class="navbar-dropdown is-boxed">
                    <a class="navbar-item" href="/search/modules">Search</a>
                    <a class="navbar-item" href="/modules">Namespaces</a>
                  </div>
                </div>

                <div id="navbarProvidersDropdown" class="navbar-item has-dropdown is-hoverable">
                  <a class="navbar-link" href="#">Providers</a>
                  <div class="navbar-dropdown is-boxed">
                    <a class="navbar-item" href="/search/providers">Search</a>
                    <a class="navbar-item" href="/providers">Namespaces</a>
                  </div>
                </div>

                <div style="display: none;" id="navbarCreateDropdown" class="navbar-item has-dropdown is-hoverable">
                  <a class="navbar-link" href="#">Create</a>
                  <div class="navbar-dropdown is-boxed">
                    <a id="navbarCreateNamespaceButton" style="display: none;" class="navbar-item" href="/create-namespace">Namespace</a>
                    <a id="navbarCreateModuleButton" style="display: none;" class="navbar-item" href="/create-module">Module</a>
                    <a id="navbarCreateProviderButton" style="display: none;" class="navbar-item" href="/create-provider">Provider</a>
                  </div>
                </div>

                <div style="display: none;" id="navbarSettingsDropdown" class="navbar-item has-dropdown is-hoverable">
                  <a class="navbar-link" href="#">Settings</a>
                  <div class="navbar-dropdown is-boxed">
                    <a id="navbarUserGroupsButton" class="navbar-item" href="/user-groups">User Groups</a>
                    <a id="navbarAuditHistoryButton" class="navbar-item" href="/audit-history">Audit History</a>
                  </div>
                </div>

                <div class="navbar-item" id="navbarSearch">
                  <div class="field has-addons">
                    <div class="control">
                      <input id="navBarSearchInput" onkeyup="navbar_search_keyup(event);" class="input" type="text" placeholder="Search modules">
                    </div>
                    <div class="control">
                      <a id="navBarSearchButton" onclick="navbar_search_modules();" class="button is-info">
                        Search
                      </a>
                    </div>
                  </div>
                </div>
              </div>

              <div class="navbar-end">

                <div class="navbar-item">
                  <div class="field is-grouped">
                    <p class="control">
                      <a class="button is-primary" href="https://gitlab.dockstudios.co.uk/pub/terrareg">
                      <span class="icon">
                        <i class="fa fa-code"></i>
                      </span>
                      <span>Source code</span>
                    </a>
                    </p>
                  </div>
                </div>

                <div class="navbar-item">
                  <div class="field is-grouped">
                    <p class="control">
                      <a id="navbar-user-preferences-link" class="button is-primary" onclick="userPreferencesModalShow();">
                      <span class="icon">
                        <i id="navbar-user-preferences" class="fa fa-gear"></i>
                      </span>
                      <span id="navbar-user-preferences-span">Preferences</span>
                    </a>
                    </p>
                  </div>
                </div>

                <div class="navbar-item">
                  <div class="field is-grouped">
                    <p class="control">
                      <a id="navbar_login_link" class="button is-primary" href="/login">
                      <span class="icon">
                        <i id="navbar_login_icon" class="fa fa-sign-in"></i>
                      </span>
                      <span id="navbar_login_span">Login</span>
                    </a>
                    </p>
                  </div>
                </div>

              </div>
            </div>
          </nav>
        

        <section class="section">

            {% block content %}{% endblock %}

        </section>

        {% block footer %}
        <footer class="footer">
          <div class="content has-text-centered">
            <p>
              Made with <span class="icon"><i class="far fa-heart"></i></span> - <a href="https://gitlab.dockstudios.co.uk/pub/terrareg">Terrareg</a><span id="terrareg-version"></span>
            </p>

            <p id="provider-tos">
            </p>
            {% block additional_footer %}{% endblock %}
          </div>
        </footer>
        {% endblock %}


        <!-- User preferences modal -->
        <div id="user-preferences-modal" class="modal">
          <div class="modal-background" onclick="userPreferencesModalClose();"></div>
        
          <div class="modal-content">
            <div class="box">
              <p>User Preferences</p>
              <br />

              <div class="field">
                <label class="label"><input id="user-preferences-show-beta" class="checkbox" type="checkbox" /> Show 'beta' versions</label>
              </div>

              <div class="field">
                <label class="label"><input id="user-preferences-show-unpublished" class="checkbox" type="checkbox" /> Show 'unpublished' versions</label>
              </div>

              <div class="field">
                <label class="label">
                  Terraform Version for compatibility checks
                  <input id="user-preferences-terraform-compatibility-version" class="input" type="text" placeholder="1.3.0" />
                </label>
              </div>

              <div class="field">
                <label class="label">
                  Theme
                </label>
                <div class="select is-small">
                  <select id="user-preferences-theme">
                    <option value="default">Default</option>
                    <option value="cherry-dark">Cherry Dark</option>
                    <option value="lux">Lux</option>
                    <option value="pulse">Pulse</option>
                  </select>
                </div>
              </div>

              <div>
                Note: The current page is reloaded when preferences are saved.
              </div>
              <br />

              <button class="button" aria-label="close" onclick="userPreferencesModalSave();">Save</button>
              <button class="button" aria-label="close" onclick="userPreferencesModalClose();">Close</button>
            </div>
          </div>
        
          <button class="modal-close is-large" aria-label="close" onclick="userPreferencesModalClose();"></button>
        </div>
        <!-- !User preferences modal -->

    </body>
</html>
