Improve the default website somewhat

5 files changed, 120 insertions, 29 deletions

diff --git a/src/web_server.rs b/src/web_server.rs
index 01233f2..8ee740c 100644
--- a/src/web_server.rs
+++ b/src/web_server.rs
@@ -3,7 +3,7 @@ use std::time::Duration;
 
 use actix::{Addr, SyncArbiter};
 use actix_web::{
-    get, http::header, middleware::Logger, post, web, App, HttpResponse, HttpServer, Responder,
+    get, middleware::Logger, post, web, App, HttpServer, Responder,
 };
 use askama::actix_web::TemplateIntoResponse;
 use askama::Template;
@@ -91,8 +91,8 @@ async fn get_bot(
     front: FrontEnd,
 ) -> impl Responder {
     match front {
+        FrontEnd::Default => default::get_bot(bot, name.into_inner()).await,
         FrontEnd::Tmtu => tmtu::get_bot(bot, name.into_inner()).await,
-        FrontEnd::Default => Ok(HttpResponse::Found().header(header::LOCATION, "/").finish()),
     }
 }
 
diff --git a/src/web_server/default.rs b/src/web_server/default.rs
index b3c8291..ec86182 100644
--- a/src/web_server/default.rs
+++ b/src/web_server/default.rs
@@ -1,24 +1,41 @@
 use actix::Addr;
-use actix_web::{web, Error, HttpResponse};
+use actix_web::{http::header, web, Error, HttpResponse};
 use askama::actix_web::TemplateIntoResponse;
 use askama::Template;
 
-use crate::web_server::{filters, BotData, BotDataListRequest, BotExecutor};
+use crate::web_server::{filters, BotData, BotDataRequest, BotExecutor, BotNameListRequest};
 
 #[derive(Template)]
 #[template(path = "index.htm")]
 struct OverviewTemplate<'a> {
-    bots: &'a [BotData],
+    bot_names: &'a [String],
+    bot: Option<&'a BotData>,
 }
 
 pub async fn index(bot: web::Data<Addr<BotExecutor>>) -> Result<HttpResponse, Error> {
-    let bot_datas = match bot.send(BotDataListRequest).await.unwrap() {
-        Ok(data) => data,
-        Err(_) => Vec::with_capacity(0),
-    };
+    let bot_names = bot.send(BotNameListRequest).await.unwrap().unwrap();
 
     OverviewTemplate {
-        bots: &bot_datas[..],
+        bot_names: &bot_names,
+        bot: None,
     }
     .into_response()
 }
+
+pub async fn get_bot(
+    bot: web::Data<Addr<BotExecutor>>,
+    name: String,
+) -> Result<HttpResponse, Error> {
+    let bot_names = bot.send(BotNameListRequest).await.unwrap().unwrap();
+
+    if let Some(bot) = bot.send(BotDataRequest(name)).await.unwrap() {
+        OverviewTemplate {
+            bot_names: &bot_names,
+            bot: Some(&bot),
+        }
+        .into_response()
+    } else {
+        // TODO to 404 or not to 404
+        Ok(HttpResponse::Found().header(header::LOCATION, "/").finish())
+    }
+}
diff --git a/web_server/static/style.css b/web_server/static/style.css
index 09a985c..7d2ba89 100644
--- a/web_server/static/style.css
+++ b/web_server/static/style.css
@@ -38,6 +38,48 @@ a:hover {
   color: #ccc;
 }
 
+.thumbnail {
+  display: block;
+  max-height: 256px;
+  max-width: 512px;
+}
+
+/*
+ * Playlist table
+ */
+
+td {
+  padding-right: 16px;
+  padding-top: 1px;
+  padding-bottom: : 1px;
+}
+
+td, th {
+  vertical-align:top;
+}
+
+.tableheader td {
+  color: #918f8f;
+  border-bottom: 1px solid #3f4077;
+}
+
+.stat {
+  text-align: right;
+  white-space: nowrap;
+  padding-left: 8px
+}
+
+.tracktable {
+    border-left: 1px solid #3f4077;
+}
+
+.tracktable tr:hover {
+    background-color: #163037;
+}
+
+/*
+ * API Docs
+ */
 pre {
   font-size: 0.9rem;
   font-family: monospace;
diff --git a/web_server/templates/index.htm b/web_server/templates/index.htm
index eed31f3..fc1f8e1 100644
--- a/web_server/templates/index.htm
+++ b/web_server/templates/index.htm
@@ -13,24 +13,63 @@
   <a href="/docs/api">API</a>
 </nav>
 
-<ul>
-  {% for bot in bots %}
+<nav>
+  <ul>
+      {% 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 %}
+  </ul>
+</nav>
+{% match bot %}
+  {% when Some with (bot) %}
     <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" %}
+        <h3>Currently playing:</h3>
+        {% match current.thumbnail %}
+          {% when Some with (thumbnail) %}
+            <img src="{{ thumbnail }}" class="thumbnail">
+          {% when None %}
+        {% endmatch %}
+        <a href="{{ current.webpage_url }}">{{ current.title }}</a>
+        <span>({{ current.duration|fmt_duration }})</span>
       {% when None %}
     {% endmatch %}
 
-    {% for item in bot.playlist %}
-      <li>
-        {% include "song.htm" %}
-      </li>
-    {% endfor %}
-  {% endfor %}
-</ul>
+    <h3>Playlist</h3>
+    <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>
+    </ul>
+  {% when None %}
+  {% endmatch %}
 {% endblock %}
diff --git a/web_server/templates/song.htm b/web_server/templates/song.htm
deleted file mode 100644
index 072567a..0000000
--- a/web_server/templates/song.htm
+++ /dev/null
@@ -1,7 +0,0 @@
-<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 %}