бэта сайта, убрал мусор, чуть-чуть допилил код

2023-04-27 16:27:23 +07:00
parent 9aca8ad10e
commit ccd320141e
12 changed files with 237 additions and 198 deletions
@@ -0,0 +1,20 @@
+.player-container {
+  width: 100%;
+  height: 50px;
+  background-color: #d54242;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+#audio-player {
+  width: 80%;
+}
+
+#audio-controls {
+  display: flex;
+}
+
+#audio-controls button {
+  margin-right: 10px;
+}
@@ -0,0 +1,64 @@
+class AudioPlayer {
+    constructor(options) {
+        this.container = options.container;
+        this.audioFile = options.audioFile;
+        this.audio = new Audio(this.audioFile);
+        this.isPlaying = false;
+
+        this.playButton = null;
+        this.pauseButton = null;
+
+        this.render();
+    }
+
+    render() {
+        const containerElement = document.querySelector(this.container);
+
+        const audioPlayerElement = document.createElement('div');
+        audioPlayerElement.id = 'audio-player';
+
+        const audioControlsElement = document.createElement('div');
+        audioControlsElement.id = 'audio-controls';
+
+        this.playButton = document.createElement('button');
+        this.playButton.innerHTML = '<i class="fa fa-play"></i>';
+        this.playButton.addEventListener('click', () => {
+            if (!this.isPlaying) {
+                this.play();
+            }
+        });
+
+        this.pauseButton = document.createElement('button');
+        this.pauseButton.innerHTML = '<i class="fa fa-pause"></i>';
+        this.pauseButton.addEventListener('click', () => {
+            if (this.isPlaying) {
+                this.pause();
+            }
+        });
+
+        audioControlsElement.appendChild(this.playButton);
+        audioControlsElement.appendChild(this.pauseButton);
+
+        audioPlayerElement.appendChild(audioControlsElement);
+
+       containerElement.appendChild(audioPlayerElement);
+    }
+
+    play() {
+       if (!this.isPlaying) {
+           this.audio.play();
+           this.isPlaying = true;
+           this.playButton.style.display = 'none';
+           this.pauseButton.style.display = 'inline-block';
+       }
+    }
+
+    pause() {
+        if (this.isPlaying) {
+            this.audio.pause();
+            this.isPlaying = false;
+            this.playButton.style.display = 'inline-block';
+            this.pauseButton.style.display = 'none';
+        }
+    }
+}
@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <title>Login</title>
+</head>
+<body>
+    <div class="container">
+        <h1>Login</h1>
+        <form method="post" action="/login">
+            <label for="password">Password:</label>
+            <input type="password" name="password" id="password">
+            <button type="submit">Login</button>
+        </form>
+    </div>
+</body>
+</html>
@@ -0,0 +1,39 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <!-- Audio Player -->
+  <script src="https://kit.fontawesome.com/025ae7f87a.js" crossorigin="anonymous"></script>
+  <link href="{{ url_for('static', path='/audio-player/css/player.css') }}" rel="stylesheet">
+  <script src="{{ url_for('static', path='/audio-player/js/player.js') }}"></script>
+
+</head>
+
+<body>
+  <div class="container">
+    <div class="text-file">
+      {% for lo in log %}
+        <div>
+            <div class="player-container" id="player-container-{{ loop.index }}"></div>
+            <script>
+              new AudioPlayer({
+                container: '#player-container-{{ loop.index }}',
+                audioFile: '{{ lo.audio_file }}'
+              });
+            </script>
+          {% if lo.text %}
+            {% for line in lo.text %}
+              {{ line }}<br>
+            {% endfor %}
+          {% else %}
+            No text file found.
+          {% endif %}
+        </div>
+
+        {% endfor %}
+    </div>
+
+  </div>
+</body>
+
+</html>
@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <title>Logs</title>
+</head>
+<body>
+    <div class="container">
+        <h1>Logs</h1>
+
+        {% if logs %}
+            <ul class="logs-list">
+                {% for log in logs %}
+                    <li><a href="/logs/{{ log[0] }}">{{ log[1] }}</a></li>
+                {% endfor %}
+            </ul>
+
+        {% else %}
+            No logs found.
+        {% endif %}
+
+        {% if logged_in %}
+            Logged in as admin.
+        {% else %}
+            You need to be logged in to view this page.
+        {% endif %}
+
+    </div>
+
+</body>
+
+</html>