<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    {% if title %}
    <title>Datasaur - {{ title }}</title>
    {% else %}
    <title>Datasaur</title>
    {% endif %}
    <!-- Custom CSS -->
    <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='styles.css') }}"/>
    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
    <!-- Google font -->
    <link href="https://fonts.googleapis.com/css2?family=Ubuntu&display=swap" rel="stylesheet"/>
    <!-- FAVICON.ICO -->

    <!--
    <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
    <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
    <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
    <link rel="manifest" href="/site.webmanifest">
    <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
    <meta name="msapplication-TileColor" content="#da532c">
    <meta name="theme-color" content="#ffffff"> -->


    <link rel="apple-touch-icon" sizes="180x180" href="{{ url_for('static', filename='favicon/apple-touch-icon.png') }}">
    <link rel="icon" type="image/png" sizes="32x32" href="{{ url_for('static', filename='favicon/favicon-32x32.png') }}">
    <link rel="icon" type="image/png" sizes="16x16" href="{{ url_for('static', filename='favicon/favicon-16x16.png') }}">
    <link rel="manifest" href="{{ url_for('static', filename='favicon/site.webmanifest') }}">
    <link rel="mask-icon" href="{{ url_for('static', filename='favicon/safari-pinned-tab.svg') }}" color="#5bbad5">
    <meta name="msapplication-TileColor" content="#da532c">
    <meta name="theme-color" content="#ffffff">
    <!-- D3 javascript -->
    <!-- <script src="https://d3js.org/d3.v5.min.js" defer></script> -->
    <!-- Fontawesome icons -->
    <script src="https://kit.fontawesome.com/cba779aa10.js" crossorigin="anonymous"></script>
    <!-- Jquery -->
    <script
			  src="https://code.jquery.com/jquery-3.5.1.js"
			  integrity="sha256-QWo7LDvxbWT2tbbQ97B53yJnYU3WhH/C8ycbRAkjPDc="
			  crossorigin="anonymous"></script>
    <!-- canvg, for exporting SVG as iamges -->
    <script type="text/javascript" src="https://unpkg.com/canvg@3.0.4/lib/umd.js"></script>
    <!-- handsontable -->
    <script src="https://cdn.jsdelivr.net/npm/handsontable@7.4.2/dist/handsontable.full.min.js"></script>
    <link href="https://cdn.jsdelivr.net/npm/handsontable@7.4.2/dist/handsontable.full.min.css" rel="stylesheet" media="screen">
    
    <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.3/d3.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/topojson/1.6.9/topojson.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/datamaps/0.5.9/datamaps.all.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/save-svg-as-png@1.4.17/lib/saveSvgAsPng.min.js"></script>
    <script src="https://unpkg.com/canvg@3.0.4/lib/umd.js"></script>

    {{ JSGlue.include() }}
  </head>
  <body>
    <nav class="navbar navbar-expand-md navbar-dark bg-gradient shadow sticky-top" role="navigation">
      <div class="container">
      <a href="{{ url_for('main.index') }}">
        <img class="logo" src="{{ url_for('static', filename='images/siteimages/logo.png') }}" alt="Datasaur Logo">
      </a>
      <!-- <a class="navbar-brand text-light" href="{{ url_for('main.index') }}">Survey Site</a> -->
      <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 justify-content-end" id="navbarSupportedContent">
        <ul class="navbar-nav">
          {% if current_user.is_authenticated %}
          <li class="nav-item">
            <a class="nav-link text-light" href="{{ url_for('users.logout') }}">Logout</a>
          </li>
          <li class="nav-item">
            <a class="nav-link text-light" href="{{ url_for('surveys.home') }}">Home</a>
          </li>
          <li class="nav-item">
            <a class="nav-link text-light" href="{{ url_for('main.feedback') }}">Feedback</a>
          </li>
          <li class="nav-item">
            <a class="nav-link text-light" href="{{ url_for('users.account') }}">Account</a>
          </li>
          {% else %}
          <li class="nav-item">
            <a class="nav-link text-light" href="{{ url_for('users.login') }}">Login</a>
          </li>
          <li class="nav-item">
            <a class="nav-link text-light" href="{{ url_for('users.register') }}">Register</a>
          </li>
          {% endif %}
        </ul>
      </div>
    </div>
    </nav>
    {% with messages = get_flashed_messages(with_categories=true) %}
    {% if messages %}
      {% for category, message in messages %}
        <div class="alert alert-{{ category }} alert-dismissible mb-0">
          {{ message }}
          <button type="button" class="close" data-dismiss="alert" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
      {% endfor %}
    {% endif %}
    {% endwith %}

    <!-- Bootstrap scripts -->
    <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script>
    {% block content %} {% endblock %}


    
  </body>
</html>
