From 77520fb54ef67d22b77051cf7a11380b21a96a91 Mon Sep 17 00:00:00 2001
From: Constantin Simonis <constantin@simonis.lol>
Date: Thu, 9 Jan 2025 13:41:34 +0100
Subject: [PATCH 1/2] add loggin in animation

---
 src/app/app.routes.ts              |  1 +
 src/app/login/login.component.css  |  6 ++++++
 src/app/login/login.component.html |  2 +-
 src/app/login/login.component.ts   | 19 +++++++++++++++++--
 4 files changed, 25 insertions(+), 3 deletions(-)

diff --git a/src/app/app.routes.ts b/src/app/app.routes.ts
index 9c15317..50c4588 100644
--- a/src/app/app.routes.ts
+++ b/src/app/app.routes.ts
@@ -5,6 +5,7 @@ import {HomeComponent} from "./home/home.component";
 
 export const routes: Routes = [
   {path: 'login', component: LoginComponent},
+  {path: 'test', component: LoginComponent},
   {path: '', component: HomeComponent, canActivate: [AuthGuardService]},
   {path: '**', redirectTo: ''}
 ];
diff --git a/src/app/login/login.component.css b/src/app/login/login.component.css
index e69de29..52267f3 100644
--- a/src/app/login/login.component.css
+++ b/src/app/login/login.component.css
@@ -0,0 +1,6 @@
+.dot-loader {
+  font-size: 1.5rem;
+  font-weight: bold;
+  color: #555;
+  text-align: center;
+}
diff --git a/src/app/login/login.component.html b/src/app/login/login.component.html
index 147cfc4..5de9dba 100644
--- a/src/app/login/login.component.html
+++ b/src/app/login/login.component.html
@@ -1 +1 @@
-<p>login works!</p>
+<div class="dot-loader">Logging in<span>{{ dots }}</span></div>
diff --git a/src/app/login/login.component.ts b/src/app/login/login.component.ts
index b32d924..efa3330 100644
--- a/src/app/login/login.component.ts
+++ b/src/app/login/login.component.ts
@@ -1,4 +1,5 @@
-import { Component } from '@angular/core';
+import {Component, OnDestroy, OnInit} from '@angular/core';
+import {interval, Subscription} from "rxjs";
 
 @Component({
   selector: 'app-login',
@@ -7,6 +8,20 @@ import { Component } from '@angular/core';
   standalone: true,
   styleUrl: './login.component.css'
 })
-export class LoginComponent {
+export class LoginComponent implements OnInit, OnDestroy{
+  dots: string = '';
+  private maxDots: number = 4; // Maximum number of dots
+  private intervalSub!: Subscription;
 
+  ngOnInit(): void {
+    this.intervalSub = interval(500).subscribe(() => {
+      this.dots = this.dots.length < this.maxDots ? this.dots + '.' : '';
+    });
+  }
+
+  ngOnDestroy(): void {
+    if (this.intervalSub) {
+      this.intervalSub.unsubscribe();
+    }
+  }
 }
-- 
2.47.2


From 8361de77183a7d453b5b78fca9a898d2d5023215 Mon Sep 17 00:00:00 2001
From: Constantin Simonis <constantin@simonis.lol>
Date: Thu, 9 Jan 2025 13:42:36 +0100
Subject: [PATCH 2/2] whoops

---
 src/app/app.routes.ts | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/app/app.routes.ts b/src/app/app.routes.ts
index 50c4588..9c15317 100644
--- a/src/app/app.routes.ts
+++ b/src/app/app.routes.ts
@@ -5,7 +5,6 @@ import {HomeComponent} from "./home/home.component";
 
 export const routes: Routes = [
   {path: 'login', component: LoginComponent},
-  {path: 'test', component: LoginComponent},
   {path: '', component: HomeComponent, canActivate: [AuthGuardService]},
   {path: '**', redirectTo: ''}
 ];
-- 
2.47.2