Move web server related files into a folder

author: Jokler <jokler@protonmail.com> 2020-02-22 18:53:13 +0100
committer: Jokler <jokler@protonmail.com> 2020-02-22 23:20:10 +0100
commit: 326cfa543c6263818aad7dec4a869bc8139ec14c (patch)
tree: bc55a0e79107a93bc3e605a0cae32926dc4c52fc /web_server
parent: b9edd85baae9ee483a2d403c641801adc585d26d (diff)
download: pokebot-326cfa543c6263818aad7dec4a869bc8139ec14c.tar.gz
pokebot-326cfa543c6263818aad7dec4a869bc8139ec14c.zip
7 files changed, 392 insertions, 0 deletions
diff --git a/web_server/static/fonts/.gitkeep b/web_server/static/fonts/.gitkeep
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/web_server/static/fonts/.gitkeep
diff --git a/web_server/static/style.css b/web_server/static/style.css
new file mode 100644
index 0000000..09a985c
--- /dev/null
+++ b/web_server/static/style.css
@@ -0,0 +1,63 @@
+@font-face {
+  font-family: 'roboto-regular';
+  src: url('fonts/Roboto-Regular.ttf') format('truetype');
+}
+
+@font-face {
+  font-family: 'roboto-light';
+  src: url('fonts/Roboto-Light.ttf') format('truetype');
+}
+
+@font-face {
+  font-family: 'roboto-bold';
+  src: url('fonts/Roboto-Bold.ttf') format('truetype');
+}
+
+body {
+  background-color: #151515;
+}
+
+main {
+  margin: auto;
+  max-width: 800px;
+  padding: 1em;
+  background-color: #202020;
+  color: #eee;
+  font-family: 'roboto-regular', Arial;
+}
+
+nav > a {
+  font-size: 1.4rem;
+}
+
+a, a:visited {
+  color: #eee;
+}
+
+a:hover {
+  color: #ccc;
+}
+
+pre {
+  font-size: 0.9rem;
+  font-family: monospace;
+  background-color: #151515;
+  overflow: auto;
+  padding: 1em;
+}
+
+.code-background {
+  background-color: #151515;
+}
+
+.code-normal {
+  color: #c0c5ce;
+}
+
+.code-string {
+  color:#a3be8c;
+}
+
+.code-number {
+  color: #d08770;
+}
diff --git a/web_server/templates/base.htm b/web_server/templates/base.htm
new file mode 100644
index 0000000..b8b2f49
--- /dev/null
+++ b/web_server/templates/base.htm
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta http-equiv="X-UA-Compatible" content="ie=edge">
+    <link href="/static/style.css" rel="stylesheet">
+    <title>{% block title %}{{ title }} - PokeBot{% endblock %}</title>
+  </head>
+  <body>
+    <main>
+      {% block content %}{% endblock %}
+    </main>
+  </body>
+</html>
diff --git a/web_server/templates/docs/api.htm b/web_server/templates/docs/api.htm
new file mode 100644
index 0000000..a973272
--- /dev/null
+++ b/web_server/templates/docs/api.htm
@@ -0,0 +1,126 @@
+{% extends "base.htm" %}
+
+{% block title %}API Documentation{% endblock %}
+
+{% block content %}
+<h1>API Documentation</h1>
+<nav>
+  <a href="/">Bots</a>
+  <a href="/docs/api">API</a>
+</nav>
+
+<h2>Bot list</h2>
+<p>Show a list of all bots.</p>
+
+<p><b>URL</b>: <span class="code-background">/api/bots</span></p>
+<p><b>Method</b>: <span class="code-background">GET</span></p>
+<p><b>Auth required</b>: <span class="code-background">NO</span></p>
+
+<h3>Success Response</h3>
+
+<p><b>Code</b>: <span class="code-background">200 OK</span></p>
+
+<h3>Content example</h3>
+
+<!-- Generated with syntect and adjusted -->
+<pre>
+<span class="code-normal">[
+</span><span class="code-normal">  {
+</span><span class="code-normal">    &quot;</span><span class="code-string">name</span><span class="code-normal">&quot;: &quot;</span><span class="code-string">MusicBot</span><span class="code-normal">&quot;,
+</span><span class="code-normal">    &quot;</span><span class="code-string">state</span><span class="code-normal">&quot;: &quot;</span><span class="code-string">Playing</span><span class="code-normal">&quot;,
+</span><span class="code-normal">    &quot;</span><span class="code-string">volume</span><span class="code-normal">&quot;: </span><span class="code-number">0.5</span><span class="code-normal">,
+</span><span class="code-normal">    &quot;</span><span class="code-string">position</span><span class="code-normal">&quot;: {
+</span><span class="code-normal">      &quot;</span><span class="code-string">secs</span><span class="code-normal">&quot;: </span><span class="code-number">10</span><span class="code-normal">,
+</span><span class="code-normal">      &quot;</span><span class="code-string">nanos</span><span class="code-normal">&quot;: </span><span class="code-number">63573687
+</span><span class="code-normal">    },
+</span><span class="code-normal">    &quot;</span><span class="code-string">currently_playing</span><span class="code-normal">&quot;: {
+</span><span class="code-normal">      &quot;</span><span class="code-string">url</span><span class="code-normal">&quot;: &quot;</span><span class="code-string">&lt;temp_url&gt;</span><span class="code-normal">&quot;,
+</span><span class="code-normal">      &quot;</span><span class="code-string">webpage_url</span><span class="code-normal">&quot;: &quot;</span><span class="code-string">https://www.youtube.com/watch?v=dQw4w9WgXcQ</span><span class="code-normal">&quot;,
+</span><span class="code-normal">      &quot;</span><span class="code-string">title</span><span class="code-normal">&quot;: &quot;</span><span class="code-string">Rick Astley - Never Gonna Give You Up (Video)</span><span class="code-normal">&quot;,
+</span><span class="code-normal">      &quot;</span><span class="code-string">thumbnail</span><span class="code-normal">&quot;: &quot;</span><span class="code-string">https://i.ytimg.com/vi/dQw4w9WgXcQ/maxresdefault.jpg</span><span class="code-normal">&quot;,
+</span><span class="code-normal">      &quot;</span><span class="code-string">duration</span><span class="code-normal">&quot;: {
+</span><span class="code-normal">        &quot;</span><span class="code-string">secs</span><span class="code-normal">&quot;: </span><span class="code-number">212</span><span class="code-normal">,
+</span><span class="code-normal">        &quot;</span><span class="code-string">nanos</span><span class="code-normal">&quot;: </span><span class="code-number">0
+</span><span class="code-normal">      }
+</span><span class="code-normal">    },
+</span><span class="code-normal">    &quot;</span><span class="code-string">playlist</span><span class="code-normal">&quot;: [
+</span><span class="code-normal">      {
+</span><span class="code-normal">        &quot;</span><span class="code-string">url</span><span class="code-normal">&quot;: &quot;</span><span class="code-string">&lt;temp_url&gt;</span><span class="code-normal">&quot;,
+</span><span class="code-normal">        &quot;</span><span class="code-string">webpage_url</span><span class="code-normal">&quot;: &quot;</span><span class="code-string">https://www.youtube.com/watch?v=dQw4w9WgXcQ</span><span class="code-normal">&quot;,
+</span><span class="code-normal">        &quot;</span><span class="code-string">title</span><span class="code-normal">&quot;: &quot;</span><span class="code-string">Rick Astley - Never Gonna Give You Up (Video)</span><span class="code-normal">&quot;,
+</span><span class="code-normal">        &quot;</span><span class="code-string">thumbnail</span><span class="code-normal">&quot;: &quot;</span><span class="code-string">https://i.ytimg.com/vi/dQw4w9WgXcQ/maxresdefault.jpg</span><span class="code-normal">&quot;,
+</span><span class="code-normal">        &quot;</span><span class="code-string">duration</span><span class="code-normal">&quot;: {
+</span><span class="code-normal">          &quot;</span><span class="code-string">secs</span><span class="code-normal">&quot;: </span><span class="code-number">212</span><span class="code-normal">,
+</span><span class="code-normal">          &quot;</span><span class="code-string">nanos</span><span class="code-normal">&quot;: </span><span class="code-number">0
+</span><span class="code-normal">        }
+</span><span class="code-normal">      }
+</span><span class="code-normal">    ]
+</span><span class="code-normal">  }
+</span><span class="code-normal">]
+</span></pre>
+
+
+<h2>Show Bot</h2>
+<p>Show a specific bot.</p>
+
+<p><b>URL</b>: <span class="code-background">/api/bots/:botname</span></p>
+<p><b>Method</b>: <span class="code-background">GET</span></p>
+<p><b>Auth required</b>: <span class="code-background">NO</span></p>
+
+<h3>Success Response</h3>
+<p><b>Code</b>: <span class="code-background">200 OK</span></p>
+
+<h3>Content example</h3>
+
+<!-- Generated with syntect and adjusted -->
+<pre>
+<span class="code-normal">{
+</span><span class="code-normal">  &quot;</span><span class="code-string">name</span><span class="code-normal">&quot;: &quot;</span><span class="code-string">MusicBot</span><span class="code-normal">&quot;,
+</span><span class="code-normal">  &quot;</span><span class="code-string">state</span><span class="code-normal">&quot;: &quot;</span><span class="code-string">Playing</span><span class="code-normal">&quot;,
+</span><span class="code-normal">  &quot;</span><span class="code-string">volume</span><span class="code-normal">&quot;: </span><span class="code-number">0.5</span><span class="code-normal">,
+</span><span class="code-normal">  &quot;</span><span class="code-string">position</span><span class="code-normal">&quot;: {
+</span><span class="code-normal">    &quot;</span><span class="code-string">secs</span><span class="code-normal">&quot;: </span><span class="code-number">142</span><span class="code-normal">,
+</span><span class="code-normal">    &quot;</span><span class="code-string">nanos</span><span class="code-normal">&quot;: </span><span class="code-number">690911766
+</span><span class="code-normal">  },
+</span><span class="code-normal">  &quot;</span><span class="code-string">currently_playing</span><span class="code-normal">&quot;: {
+</span><span class="code-normal">    &quot;</span><span class="code-string">url</span><span class="code-normal">&quot;: &quot;</span><span class="code-string">&lt;temp_url&gt;</span><span class="code-normal">&quot;,
+</span><span class="code-normal">    &quot;</span><span class="code-string">webpage_url</span><span class="code-normal">&quot;: &quot;</span><span class="code-string">https://www.youtube.com/watch?v=dQw4w9WgXcQ</span><span class="code-normal">&quot;,
+</span><span class="code-normal">    &quot;</span><span class="code-string">title</span><span class="code-normal">&quot;: &quot;</span><span class="code-string">Rick Astley - Never Gonna Give You Up (Video)</span><span class="code-normal">&quot;,
+</span><span class="code-normal">    &quot;</span><span class="code-string">thumbnail</span><span class="code-normal">&quot;: &quot;</span><span class="code-string">https://i.ytimg.com/vi/dQw4w9WgXcQ/maxresdefault.jpg</span><span class="code-normal">&quot;,
+</span><span class="code-normal">    &quot;</span><span class="code-string">duration</span><span class="code-normal">&quot;: {
+</span><span class="code-normal">      &quot;</span><span class="code-string">secs</span><span class="code-normal">&quot;: </span><span class="code-number">212</span><span class="code-normal">,
+</span><span class="code-normal">      &quot;</span><span class="code-string">nanos</span><span class="code-normal">&quot;: </span><span class="code-number">0
+</span><span class="code-normal">    }
+</span><span class="code-normal">  },
+</span><span class="code-normal">  &quot;</span><span class="code-string">playlist</span><span class="code-normal">&quot;: [
+</span><span class="code-normal">    {
+</span><span class="code-normal">      &quot;</span><span class="code-string">url</span><span class="code-normal">&quot;: &quot;</span><span class="code-string">&lt;temp_url&gt;</span><span class="code-normal">&quot;,
+</span><span class="code-normal">      &quot;</span><span class="code-string">webpage_url</span><span class="code-normal">&quot;: &quot;</span><span class="code-string">https://www.youtube.com/watch?v=dQw4w9WgXcQ</span><span class="code-normal">&quot;,
+</span><span class="code-normal">      &quot;</span><span class="code-string">title</span><span class="code-normal">&quot;: &quot;</span><span class="code-string">Rick Astley - Never Gonna Give You Up (Video)</span><span class="code-normal">&quot;,
+</span><span class="code-normal">      &quot;</span><span class="code-string">thumbnail</span><span class="code-normal">&quot;: &quot;</span><span class="code-string">https://i.ytimg.com/vi/dQw4w9WgXcQ/maxresdefault.jpg</span><span class="code-normal">&quot;,
+</span><span class="code-normal">      &quot;</span><span class="code-string">duration</span><span class="code-normal">&quot;: {
+</span><span class="code-normal">        &quot;</span><span class="code-string">secs</span><span class="code-normal">&quot;: </span><span class="code-number">212</span><span class="code-normal">,
+</span><span class="code-normal">        &quot;</span><span class="code-string">nanos</span><span class="code-normal">&quot;: </span><span class="code-number">0
+</span><span class="code-normal">      }
+</span><span class="code-normal">    }
+</span><span class="code-normal">  ]
+</span><span class="code-normal">}
+</span></pre>
+
+<h3>Error Response</h3>
+
+<p><b>Condition</b>: If ':botname' is not connected to TeamSpeak.</p>
+
+<p><b>Code</b>: <span class="code-background">404 NOT FOUND</span></p>
+
+<b>Content</b>:
+
+<!-- Generated with syntect and adjusted -->
+<pre>
+<span class="code-normal">{
+</span><span class="code-normal">  &quot;</span><span class="code-string">error</span><span class="code-normal">&quot;: &quot;</span><span class="code-string">Not Found</span><span class="code-normal">&quot;,
+</span><span class="code-normal">  &quot;</span><span class="code-string">description</span><span class="code-normal">&quot;: &quot;</span><span class="code-string">The requested resource was not found</span><span class="code-normal">&quot;
+</span><span class="code-normal">}
+</span></pre>
+
+{% endblock %}
diff --git a/web_server/templates/index.htm b/web_server/templates/index.htm
new file mode 100644
index 0000000..eed31f3
--- /dev/null
+++ b/web_server/templates/index.htm
@@ -0,0 +1,36 @@
+{% extends "base.htm" %}
+
+{% block title %}Overview{% endblock %}
+
+{% block content %}
+<h1>Bots</h1>
+<form action="/front-end" method="POST">
+  <input type="hidden" placeholder="Enter front end" name="front-end" value="tmtu">
+  <button type="submit">tmtu-mode</button>
+</form>
+<nav>
+  <a href="/">Bots</a>
+  <a href="/docs/api">API</a>
+</nav>
+
+<ul>
+  {% for bot in bots %}
+    <h2>{{ bot.name }}</h1>
+    <div>State: {{ bot.state }}</div>
+    <div>Volume: {{ bot.volume * 100.0 }}%</div>
+    {% match bot.currently_playing %}
+      {% when Some with (current) %}
+        <span>Currently playing:</span>
+        {% let item = current %}
+        {% include "song.htm" %}
+      {% when None %}
+    {% endmatch %}
+
+    {% for item in bot.playlist %}
+      <li>
+        {% include "song.htm" %}
+      </li>
+    {% endfor %}
+  {% endfor %}
+</ul>
+{% endblock %}
diff --git a/web_server/templates/song.htm b/web_server/templates/song.htm
new file mode 100644
index 0000000..072567a
--- /dev/null
+++ b/web_server/templates/song.htm
@@ -0,0 +1,7 @@
+<a href="{{ item.webpage_url }}">{{ item.title }}</a>
+<span>({{ item.duration|fmt_duration }})</span>
+{% match item.thumbnail %}
+  {% when Some with (thumbnail) %}
+    <img src="{{ thumbnail }}" height="128">
+  {% when None %}
+{% endmatch %}
diff --git a/web_server/templates/tmtu/index.htm b/web_server/templates/tmtu/index.htm
new file mode 100644
index 0000000..785e653
--- /dev/null
+++ b/web_server/templates/tmtu/index.htm
@@ -0,0 +1,145 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <title>tmtu mode</title>
+    <style type="text/css">
+      body {
+        margin: 16px;
+      }
+      td {
+        padding-right: 16px;
+        padding-top: 1px;
+        padding-bottom: : 1px;
+      }
+      td, th {
+        vertical-align:top;
+      }
+      .tableheader td {
+        color: gray;
+        border-bottom: 1px solid gray;
+      }
+      .stat {
+        color: gray;
+        text-align: right;
+        white-space: nowrap;
+        padding-left: 8px
+      }
+      .tracktable {
+        border-left: 1px solid gray;
+      }
+      .tracktable tr:hover {
+        background-color: #E0E0E0;
+      }
+      .bottable tr:hover {
+        background-color: #E0E0E0;
+      }
+      #test:hover {
+        background: 2px solid red;
+      }
+      a {
+        color: teal;
+      }
+      a:hover {
+        color: red;
+      }
+      a[visited] {
+        color: navy
+      }
+      .addedby {
+        color: darkorange;
+      }
+      .botname {
+      }
+      .selected {
+        font-weight: 700;
+      }
+      .playing {
+        background: PaleGreen;
+      }
+    </style>
+  </head>
+  <body>
+    <table>
+      <tr>
+        <td colspan="2">
+          <h1>PokeBot</h1>
+          <p>A web interface for inspecting currently playing audio in PokeBot. Select an instance of the bot to view it's playlist and history.</p>
+          <nav style="display: inline-block;">
+            <ol>
+                {% let bot_name %}
+                {% match bot %}
+                  {% when Some with (bot) %}
+                    {% let bot_name = bot.name.clone() %}
+                  {% when None %}
+                    {% let bot_name = "".to_owned() %}
+                {% endmatch %}
+              {% for name in bot_names %}
+                {% if name.clone() == bot_name %}
+                  <li><a href="/bot/{{ name }}" class="botname selected">{{ name }}</a></li>
+                {% else %}
+                  <li><a href="/bot/{{ name }}" class="botname">{{ name }}</a></li>
+                {% endif %}
+              {% endfor %}
+            </ol>
+          </nav>
+        </td>
+      </tr>
+      {% match bot %}
+        {% when Some with (bot) %}
+          <tr>
+            <td colspan="2">
+              <h2>Status</h2>
+              <div class="{{ bot.state|lower }}" style="padding: 5px;">
+                {% match bot.currently_playing %}
+                  {% when Some with (current) %}
+                  <p>Currently playing: <a href="{{ current.webpage_url }}">{{ current.title }}</a></p>
+                  <p><strong>{{ bot.position|fmt_duration }} / {{ current.duration|fmt_duration }}</strong>
+                    {% match current.duration %}
+                      {% when Some with (duration) %}
+                        {% let position %}
+                        {% match bot.position %}
+                          {% when Some with (pos) %}
+                            {% let position = pos.as_secs_f64() %}
+                          {% when None %}
+                            {% let position = 0.0 %}
+                        {% endmatch %}
+                        {% let progress = position / duration.as_secs_f64() %}
+                        {% let percent = progress * 100.0 %}
+                        <progress value="{{ percent }}" max="100" title="test"></progress></p>
+                      {% when None %}
+                        <progress value="0" max="100" title="test"></progress></p>
+                    {% endmatch %}
+                  {% when None %}
+                {% endmatch %}
+              </div>
+            </td>
+          </tr>
+          <tr>
+            <td>
+              <h2>Playlist</h2>
+              <table class="tracktable" cellspacing="0" cellpadding="0">
+                <tr class="tableheader">
+                  <td class="stat">#</td>
+                  <td>track</td>
+                  <td>length</td>
+                  <td>added by</td>
+                </tr>
+                {% for item in bot.playlist %}
+                  <tr>
+                    <td class="stat">{{ loop.index }}</td>
+                    <td><a href="{{ item.webpage_url }}">{{ item.title }}</a></td>
+                    <td>
+                      {% let duration = item.duration %}
+                      {{ duration|fmt_duration }}
+                    </td>
+                    <td>{{ item.added_by }}</td>
+                  </tr>
+                {% endfor %}
+              </table>
+            </td>
+          </tr>
+        {% when None %}
+        {% endmatch %}
+    </table>
+  </body>
+</html>
author	Jokler <jokler@protonmail.com>	2020-02-22 18:53:13 +0100
committer	Jokler <jokler@protonmail.com>	2020-02-22 23:20:10 +0100
commit	326cfa543c6263818aad7dec4a869bc8139ec14c (patch)
tree	bc55a0e79107a93bc3e605a0cae32926dc4c52fc /web_server
parent	b9edd85baae9ee483a2d403c641801adc585d26d (diff)
download	pokebot-326cfa543c6263818aad7dec4a869bc8139ec14c.tar.gz pokebot-326cfa543c6263818aad7dec4a869bc8139ec14c.zip