<!DOCTYPE html>
<html lang="en" class="h-100">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <title>Logs - gallery-dl-server</title>

    <link rel="preconnect" href="https://fonts.googleapis.com" />
    <link rel="preconnect" href="https://fonts.gstatic.com" />

    <link
      rel="stylesheet"
      href="https://fonts.googleapis.com/css2?family=Kristi&display=swap"
      crossorigin="anonymous"
    />

    <link
      rel="stylesheet"
      href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css"
      integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH"
      crossorigin="anonymous"
    />

    <link rel="stylesheet" href="/static/styles/common.css?v=0.1.2" />
    <link rel="stylesheet" href="/static/styles/logs.css?v=0.1.2" />

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

    <link rel="icon" href="/static/icons/favicon-16x16.png" sizes="16x16" type="image/png" />
    <link rel="icon" href="/static/icons/favicon-32x32.png" sizes="32x32" type="image/png" />

    <link rel="apple-touch-icon" href="/static/icons/apple-touch-icon.png" sizes="180x180" />

    <link rel="manifest" href="/static/icons/site.webmanifest" />

    <script
      src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
      integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz"
      crossorigin="anonymous"
    ></script>
  </head>

  <body class="d-flex flex-column h-100">
    <header class="container-fluid d-flex justify-content-between align-items-center px-3 py-1">
      <div id="header-left">
        <a id="home" class="py-0" href="/gallery-dl">dl&nbsp;</a>
        <a id="logs" class="py-3" href="/gallery-dl/logs">Logs</a>
      </div>

      <div id="header-right">
        <a
          href="https://github.com/qx6ghqkz/gallery-dl-server"
          target="_blank"
          rel="noopener noreferrer"
          >gallery-dl-server</a
        >
        v{{ app_version }}</div
      >
    </header>

    <main class="d-flex flex-column h-100 p-3">
      <div class="container-fluid d-flex justify-content-between align-items-center px-3">
        <div>
          <h1 class="display-6">Logs</h1>
        </div>

        <div>
          <button id="refresh-logs" class="btn btn-custom">Refresh</button>
          <button id="clear-logs" class="btn btn-custom">Clear logs</button>

          <a class="btn btn-custom" href="/stream/logs">View plain text</a>
          <a class="btn btn-custom" href="/stream/logs" download="gallery-dl-server.log" >Download</a>
        </div>
      </div>

      <pre id="container-logs" class="h-100 m-3">{{ logs }}</pre>
    </main>

    <script src="/static/scripts/logs.js?v=0.1.3"></script>
  </body>
</html>
