WIP Svelte

atsebayt/src/routes/auth.svelte

@@ -0,0 +1,71 @@
+<script context="module">
+ import { session } from '$app/stores';
+
+ export function load() {
+     if (session.id) {
+         return { redirect: '/', status: 302 };
+     }
+
+     return { };
+ }
+</script>
+
+<script>
+ import { goto } from '$app/navigation';
+
+ let auth = { username: "", password: "" };
+ let pleaseWait = false;
+
+ function logmein() {
+     pleaseWait = true;
+     fetch('api/auth', {
+	 method: 'POST',
+	 body: JSON.stringify(auth),
+     })
+         .then((response) => {
+             response.json().then((auth) => {
+	         pleaseWait = false;
+                 $session = auth;
+	         goto(".");
+             })
+         })
+         .catch((response) => {
+	     pleaseWait = false;
+	     if (response.data)
+	         addToast({
+	             variant: "danger",
+	             title: "Connexion impossible",
+	             msg: (response.data ? response.data.errmsg : "Impossible de contacter le serveur"),
+	         });
+         });
+ }
+</script>
+
+<div class="row">
+    <form class="col" on:submit|preventDefault={logmein}>
+        <h2>Accès à votre compte</h2>
+        <div class="mb-3">
+            <label for="login" class="form-label">CRI login</label>
+            <input class="form-control" id="login" bind:value={auth.username} placeholder="Entrer votre login" autofocus>
+        </div>
+        <div class="mb-3">
+            <label for="password" class="form-label">Mot de passe</label>
+            <input type="password" class="form-control" id="password" bind:value={auth.password} placeholder="Mot de passe">
+        </div>
+        <button type="submit" class="btn btn-info">
+            {#if pleaseWait}
+                <span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
+            {/if}
+            Me connecter
+        </button>
+    </form>
+
+    <div class="col">
+        <h2>OpenId Connect</h2>
+        <div class="text-center">
+            <a href="auth/CRI" class="btn btn-primary" target="_self">
+	        Me connecter avec mon compte CRI
+            </a>
+        </div>
+    </div>
+</div>