From cdbaef4bab307795b3b77a2d7be2cd5251f7d0e0 Mon Sep 17 00:00:00 2001
From: Juliusz Chroboczek <jch@irif.fr>
Date: Wed, 31 Aug 2022 17:04:02 +0200
Subject: [PATCH] Check for group existence on landing page.

---
 static/index.html   |  2 ++
 static/mainpage.css |  6 ++++++
 static/mainpage.js  | 43 ++++++++++++++++++++++++++++++++++++++++---
 3 files changed, 48 insertions(+), 3 deletions(-)

diff --git a/static/index.html b/static/index.html
index e5d9d7f7..b4e06c09 100644
--- a/static/index.html
+++ b/static/index.html
@@ -20,6 +20,8 @@ <h1 id="title" class="navbar-brand">Galène</h1>
         <input id="group" type="text" name="group" class="form-control form-control-inline"/>
         <input type="submit" value="Join" class="btn btn-default btn-large"/><br/>
       </form>
+
+      <p id="errormessage"></p>
   
       <div id="public-groups" class="groups">
         <h2>Public groups</h2>
diff --git a/static/mainpage.css b/static/mainpage.css
index 4c38e1c0..d94bc7be 100644
--- a/static/mainpage.css
+++ b/static/mainpage.css
@@ -4,6 +4,12 @@ body {
     flex-direction: column;
 }
 
+#errormessage {
+    color: red;
+    font-weight: bold;
+    height: 12px;
+}
+
 .groups {
 }
 
diff --git a/static/mainpage.js b/static/mainpage.js
index bc68a406..540a1c23 100644
--- a/static/mainpage.js
+++ b/static/mainpage.js
@@ -20,13 +20,50 @@
 
 'use strict';
 
-document.getElementById('groupform').onsubmit = function(e) {
+document.getElementById('groupform').onsubmit = async function(e) {
     e.preventDefault();
+    clearError();
     let group = document.getElementById('group').value.trim();
-    if(group !== '')
-        location.href = '/group/' + group + '/';
+    if(group === '')
+        return;
+    let url = '/group/' + group + '/';
+    try {
+        let resp = await fetch(url, {
+            method: 'HEAD',
+        });
+        if(!resp.ok) {
+            if(resp.status === 404)
+                displayError('No such group');
+            else
+                displayError(`The server said: ${resp.status} ${resp.statusText}`);
+            return;
+        }
+    } catch(e) {
+        displayError(`Coudln't connect: ${e.toString()}`);
+    }
+    location.href = url;
 };
 
+var clearErrorTimeout = null;
+
+function displayError(message) {
+    clearError();
+    let p = document.getElementById('errormessage');
+    p.textContent = message;
+    clearErrorTimeout = setTimeout(() => {
+        let p = document.getElementById('errormessage');
+        p.textContent = '';
+        clearErrorTimeout = null;
+    }, 2500);
+}
+
+function clearError() {
+    if(clearErrorTimeout != null) {
+        clearTimeout(clearErrorTimeout);
+        clearErrorTimeout = null;
+    }
+}
+
 async function listPublicGroups() {
     let div = document.getElementById('public-groups');
     let table = document.getElementById('public-groups-table');