dashboard-v2/public/templates/includes/head.tmpl

{{define "head"}}
  <title>Tickets | A Discord Support Manager Bot</title>

  <!-- Meta -->
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <meta name="description" content="Management panel for the Discord Tickets bot">

  <link rel="shortcut icon" href="/assets/img/favicon.ico" type="image/x-icon">
  <link rel="icon" href="/assets/img/favicon.ico" type="image/x-icon">

  <!-- Custom CSS -->
  <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700" rel="stylesheet">
  <link href="/assets/css/style.css" rel="stylesheet">

  <style>
    #avatar-sidebar {
      background: url("{{.avatar}}?size=256") center center;
      width: 32px;
      height: 32px;
      display: block;
      background-size: cover;
      border-radius: 50%;
      float: right;

    }
  </style>

  <!-- Vue
  <script src="https://cdn.jsdelivr.net/npm/vue@2.6.11"></script>
  <script src="https://unpkg.com/vue-router/dist/vue-router.js"></script>-->

  <script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.19.2/axios.min.js"
          integrity="sha256-T/f7Sju1ZfNNfBh7skWn0idlCBcI3RwdLSS4/I7NQKQ=" crossorigin="anonymous"></script>

  <script>
      async function getToken() {
          let token = window.localStorage.getItem('token');
          if (token == null) {
              let res = await axios.post('/token', {
                  withCredentials: true
              });

              if (res.status !== 200 || !res.data.success) {
                  console.log("An error occurred whilst retrieving an authentication token. Please contact the developer");
                  console.log(res);
                  return;
              }

              token = res.data.token;
              localStorage.setItem('token', token);
          }

          return token;
      }

      async function setDefaultHeader() {
          const token = await getToken();
          axios.defaults.headers.common['Authorization'] = token;
          axios.defaults.validateStatus = false;
      }

      setDefaultHeader();
  </script>

  <script>
    function showLoadingScreen() {
      const content = document.getElementsByClassName('content')[0];
      content.style.display = 'none';
      document.getElementById('loading-container').style.display = 'block';
    }

    function hideLoadingScreen() {
        document.getElementById('loading-container').style.display = 'none';

        const content = document.getElementsByClassName('content')[0];
        content.style.display = 'block';
        content.classList.add('fade-in');
    }

    function sleep(ms) {
        return new Promise(resolve => setTimeout(resolve, ms));
    }

    async function withLoadingScreen(func) {
        showLoadingScreen();
        await func();
        await sleep(200);
        hideLoadingScreen();
    }
  </script>

  <!-- Bootstrap -->
  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
        integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
  <link href="/assets/css/light-bootstrap-dashboard.css?v=1.4.0" rel="stylesheet"/>
  <link href="/assets/css/animate.min.css" rel="stylesheet"/>
  <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
          integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
          crossorigin="anonymous"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js"
          integrity="sha384-wHAiFfRlMFy6i5SRaxvfOCifBUQy1xHdJ/yoi7FRNXMRBu5WHdZYu1hA6ZOblgut"
          crossorigin="anonymous"></script>
  <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js"
          integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k"
          crossorigin="anonymous"></script>

  <!-- Discord theme -->
  <link href="/assets/css/discordmock.css" rel="stylesheet"/>

  <!-- Icons -->
  <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/all.css"
        integrity="sha384-oS3vJWv+0UjzBfQzYUhtDYW+Pj2yciDJxpsK1OYPAYjqT085Qq/1cq5FLXAZQ7Ay" crossorigin="anonymous">

  <!-- GA -->
  <script type="80be96f83bbfbba3d4097e23-text/javascript">
      window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
      ga('create', 'UA-161945537-1', 'auto');
      ga('send', 'pageview');


  </script>
  <script async src='https://www.google-analytics.com/analytics.js'
          type="80be96f83bbfbba3d4097e23-text/javascript"></script>

  <script>
      function showToast(title, content) {
          const container = document.getElementById('toast-container');

          container.innerHTML += `
            <div class="toast" role="alert" aria-live="assertive" aria-atomic="true" data-autohide="false">
              <div class="toast-header">
                <strong class="mr-auto">${title}</strong>
                <button type="button" class="ml-2 mb-1 close" data-dismiss="toast" aria-label="Close">
                  <span aria-hidden="true">&times;</span>
                </button>
              </div>
              <div class="toast-body">
                ${content}
              </div>
            </div>
          `;

          $('.toast').toast('show');
      }

      function appendTd(tr, content) {
          const td = document.createElement('td');
          td.appendChild(document.createTextNode(content));
          td.classList.add('white');
          tr.appendChild(td);
          return td
      }

      function appendButton(tr, content, onclick) {
          const tdRemove = document.createElement('td');
          const removeButton = document.createElement('button');
          removeButton.type = 'submit';
          removeButton.classList.add('btn', 'btn-primary', 'btn-fill', 'mx-auto');
          removeButton.appendChild(document.createTextNode(content));
          removeButton.onclick = onclick;
          tdRemove.appendChild(removeButton);
          tr.appendChild(tdRemove);
      }
  </script>
{{end}}