Add admin logs view

partitioncloud/modules/admin.py

@@ -2,7 +2,8 @@
 """
 Admin Panel
 """
-from flask import Blueprint, render_template, session
+import os
+from flask import Blueprint, render_template, session, current_app, send_file
 
 from .db import get_db
 from .auth import admin_required
@@ -35,3 +36,28 @@ def index():
         users=users,
         user=current_user
     )
+
+
+@bp.route("/logs")
+@admin_required
+def logs():
+    """
+    Admin panel logs page
+    """
+    user = User(user_id=session.get("user_id"))
+
+    return render_template(
+        "admin/logs.html",
+        user=user
+    )
+
+
+@bp.route("/logs.txt")
+@admin_required
+def logs_txt():
+    """
+    Admin panel logs page
+    """
+    return send_file(
+        os.path.join(current_app.instance_path, "logs.txt")
+    )

partitioncloud/static/scripts/logs.js

@@ -0,0 +1,20 @@
+let logsEmbed = document.getElementById("logs-embed");
+
+logsEmbed.addEventListener("load", () => {
+    var cssLink = document.createElement("link");
+    
+    cssLink.href = "/static/style/logs.css";
+    cssLink.rel = "stylesheet";
+    cssLink.type = "text/css";
+
+    // add css
+    logsEmbed.contentDocument.head.appendChild(cssLink);
+
+    // Scroll to bottom
+    logsEmbed.contentWindow.scrollTo(0, logsEmbed.contentDocument.body.scrollHeight);
+});
+
+// check if the iframe is already loaded (happened with FF Android)
+if (logsEmbed.contentDocument.readyState == "complete") {
+    logsEmbed.dispatchEvent(new Event("load"));
+}

partitioncloud/static/style/colors.css

@@ -0,0 +1,65 @@
+/** Color Schemes */
+/* Themes used: Catppuccin Latte & Moccha
+ * https://github.com/catppuccin/catppuccin */
+
+/* Dark theme: Catpuccin Mocha */
+:root {
+    --color-rosewater: #f5e0dc;
+    --color-flamingo: #f2cdcd;
+    --color-pink: #f5c2e7;
+    --color-mauve: #cba6f7;
+    --color-red: #f38ba8;
+    --color-maroon: #eba0ac;
+    --color-peach: #fab387;
+    --color-yellow: #f9e2af;
+    --color-green: #a6e3a1;
+    --color-teal: #94e2d5;
+    --color-sky: #89dceb;
+    --color-sapphire: #74c7ec;
+    --color-blue: #89b4fa;
+    --color-lavender: #b4befe;
+    --color-text: #cdd6f4;
+    --color-subtext1: #bac2de;
+    --color-subtext0: #a6adc8;
+    --color-overlay2: #9399b2;
+    --color-overlay1: #7f849c;
+    --color-overlay0: #6c7086;
+    --color-surface2: #585b70;
+    --color-surface1: #45475a;
+    --color-surface0: #313244;
+    --color-base: #1e1e2e;
+    --color-mantle: #181825;
+    --color-crust: #11111b;
+}
+
+/* Light theme: Catppuccin Latte */
+@media (prefers-color-scheme: light) {
+    :root {
+        --color-rosewater: #dc8a78;
+        --color-flamingo: #dd7878;
+        --color-pink: #ea76cb;
+        --color-mauve: #8839ef;
+        --color-red: #d20f39;
+        --color-maroon: #e64553;
+        --color-peach: #fe640b;
+        --color-yellow: #df8e1d;
+        --color-green: #40a02b;
+        --color-teal: #179299;
+        --color-sky: #04a5e5;
+        --color-sapphire: #209fb5;
+        --color-blue: #1e66f5;
+        --color-lavender: #7287fd;
+        --color-text: #4c4f69;
+        --color-subtext1: #5c5f77;
+        --color-subtext0: #6c6f85;
+        --color-overlay2: #7c7f93;
+        --color-overlay1: #8c8fa1;
+        --color-overlay0: #9ca0b0;
+        --color-surface2: #acb0be;
+        --color-surface1: #bcc0cc;
+        --color-surface0: #ccd0da;
+        --color-base: #eff1f5;
+        --color-mantle: #e6e9ef;
+        --color-crust: #dce0e8;
+    }
+}

partitioncloud/static/style/logs.css

@@ -0,0 +1,10 @@
+@import url('/static/style/colors.css');
+
+body {
+    background-color: var(--color-crust);
+    color: var(--color-text);
+}
+
+pre {
+    white-space: pre;
+}

partitioncloud/static/style/style.css

@@ -1,75 +1,7 @@
+@import url('/static/style/colors.css');
 /** @import url('https://www.augustin64.fr/static/font/iosevka.css'); */
 
 
-/** Color Schemes */
-/* Themes used: Catppuccin Latte & Moccha
- * https://github.com/catppuccin/catppuccin */
-
-/* Dark theme: Catpuccin Mocha */
-:root {
-    --color-rosewater: #f5e0dc;
-    --color-flamingo: #f2cdcd;
-    --color-pink: #f5c2e7;
-    --color-mauve: #cba6f7;
-    --color-red: #f38ba8;
-    --color-maroon: #eba0ac;
-    --color-peach: #fab387;
-    --color-yellow: #f9e2af;
-    --color-green: #a6e3a1;
-    --color-teal: #94e2d5;
-    --color-sky: #89dceb;
-    --color-sapphire: #74c7ec;
-    --color-blue: #89b4fa;
-    --color-lavender: #b4befe;
-    --color-text: #cdd6f4;
-    --color-subtext1: #bac2de;
-    --color-subtext0: #a6adc8;
-    --color-overlay2: #9399b2;
-    --color-overlay1: #7f849c;
-    --color-overlay0: #6c7086;
-    --color-surface2: #585b70;
-    --color-surface1: #45475a;
-    --color-surface0: #313244;
-    --color-base: #1e1e2e;
-    --color-mantle: #181825;
-    --color-crust: #11111b;
-
-    /* --font-family: Iosevka Web; /* Specify the font here */
-}
-
-/* Light theme: Catppuccin Latte */
-@media (prefers-color-scheme: light) {
-    :root {
-        --color-rosewater: #dc8a78;
-        --color-flamingo: #dd7878;
-        --color-pink: #ea76cb;
-        --color-mauve: #8839ef;
-        --color-red: #d20f39;
-        --color-maroon: #e64553;
-        --color-peach: #fe640b;
-        --color-yellow: #df8e1d;
-        --color-green: #40a02b;
-        --color-teal: #179299;
-        --color-sky: #04a5e5;
-        --color-sapphire: #209fb5;
-        --color-blue: #1e66f5;
-        --color-lavender: #7287fd;
-        --color-text: #4c4f69;
-        --color-subtext1: #5c5f77;
-        --color-subtext0: #6c6f85;
-        --color-overlay2: #7c7f93;
-        --color-overlay1: #8c8fa1;
-        --color-overlay0: #9ca0b0;
-        --color-surface2: #acb0be;
-        --color-surface1: #bcc0cc;
-        --color-surface0: #ccd0da;
-        --color-base: #eff1f5;
-        --color-mantle: #e6e9ef;
-        --color-crust: #dce0e8;
-    }
-}
-
-
 /** Various settings (variables) */
 :root {
     --sidebar-size: max(10vw, 160px);
@@ -773,3 +705,12 @@ midi-player {
     margin-bottom: 100px;
     margin-top: 20px;
 }
+
+#logs-embed {
+    margin: auto;
+    height: 80vh;
+    width: 95%;
+    padding: 5px;
+    border-radius: 5px;
+    background-color: var(--color-crust);
+}

partitioncloud/templates/admin/index.html

@@ -6,10 +6,13 @@
 
 <div id="actions-rapides">
     <a href="/add-user">
-        <div class="button">Ajouter un utilisateur</div>
+        <div class="button">Nouvel utilisateur</div>
     </a>
     <a href="/partition">
-        <div class="button">Voir toutes les partitions</div>
+        <div class="button">Voir les partitions</div>
+    </a>
+    <a href="/admin/logs">
+        <div class="button">Voir les logs</div>
     </a>
 </div>
 <div class="x-scrollable">

partitioncloud/templates/admin/logs.html

@@ -0,0 +1,10 @@
+{% set scripts=["scripts/logs.js"] %}
+{% extends 'base.html' %}
+
+{% block header %}
+<h1>{% block title %}Logs{% endblock %}</h1>
+{% endblock %}
+
+{% block content %}
+<iframe type="text/plain" id="logs-embed" src="/admin/logs.txt" frameborder="0" width="100%" height="100%"></iframe>
+{% endblock %}

partitioncloud/templates/base.html

@@ -5,8 +5,8 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
   <meta http-equiv="content-type" content="text/html; charset=UTF-8">
   <title>{% block title %}{% endblock %} - PartitionCloud</title>
-  <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
-  <link rel="stylesheet" href="{{ url_for('static', filename='mobile.css') }}">
+  <link rel="stylesheet" href="{{ url_for('static', filename='style/style.css') }}">
+  <link rel="stylesheet" href="{{ url_for('static', filename='style/mobile.css') }}">
   <link rel="icon" type="image/png" href="{{ url_for('static', filename='icons/512.png') }}" />
   <link rel="apple-touch-icon" href="{{ url_for('static', filename='icons/512.png') }}">
   <link rel="manifest" href="{{ url_for('static', filename='manifest.webmanifest') }}" />
@@ -185,5 +185,8 @@
     <div id="footer"><a href="https://github.com/partitioncloud/partitioncloud-server">PartitionCloud</a> {{ version }}</div>
   </div>
 </body>
-<script src="{{ url_for('static', filename='main.js') }}"></script>
+<script src="{{ url_for('static', filename='scripts/main.js') }}"></script>
+{% for script in scripts %}
+  <script src="{{ url_for('static', filename=script) }}"></script>
+{% endfor %}
 </html>