Move from old git to gittea

src/app/pages/modus/focus/focus.component.ts

@@ -0,0 +1,101 @@
+import {Component, OnDestroy, OnInit, Renderer2} from "@angular/core";
+import {IonBreadcrumb, IonBreadcrumbs, IonButton, IonContent, IonIcon, IonProgressBar} from "@ionic/angular/standalone";
+import {TushaPageComponent} from "../../../tusha/tusha-page/tusha-page.component";
+import {FocusState} from "./focus-state";
+
+@Component({
+  templateUrl: 'focus.component.html',
+  styleUrls: ['focus.component.css'],
+  standalone: true,
+  imports: [IonBreadcrumbs, IonBreadcrumb, IonIcon, TushaPageComponent, IonProgressBar, IonContent, IonButton]
+})
+export class FocusPage implements OnInit, OnDestroy {
+  duration: number = 0.5; // default duration in minutes
+  minutes: number = 25;
+  minutesText: string = '';
+  seconds: number = 0;
+  secondsText: string = '';
+  private interval: any;
+  private startTime: number | null = null;
+  state: FocusState = FocusState.STOPPED;
+
+
+  pathD: string = 'M100 10 A90 90 0 1 1 0 0';
+
+  dashOffset = 0;
+
+  constructor(private renderer: Renderer2) {}
+
+  ngOnInit() {
+    this.updateTimeDisplay(this.duration * 60, 0, 1);
+  }
+
+  ngOnDestroy() {
+    if (this.interval) {
+      clearInterval(this.interval);
+    }
+  }
+
+  startTimer(duration: number) {
+    this.duration = duration;
+    if (this.interval) {
+      clearInterval(this.interval);
+    }
+
+    this.startTime = Date.now();
+    this.interval = setInterval(() => this.update(), 1000);
+  }
+
+  private update() {
+    const elapsed = Math.round((Date.now() - (this.startTime as number)) / 1000); // in seconden
+    let progress = elapsed / (this.duration * 60);
+
+    if (progress >= 1) {
+      console.log('timer reader');
+      progress = 1;
+      clearInterval(this.interval);
+    }
+
+    const path1 = document.getElementById('1stPath') as unknown as SVGPathElement;
+
+    const totalLength1 = path1.getTotalLength();
+
+    // path1.style.strokeDasharray = `${totalLength1}`;
+    // path1.style.strokeDashoffset = `${totalLength1 - totalLength1 * this.progress}`;
+    //
+    // path2.style.strokeDasharray = `${totalLength2}`;
+    // path2.style.strokeDashoffset = `${totalLength2 - totalLength2 * this.progress}`;
+
+    this.renderer.setStyle(
+      document.documentElement,
+      '--progress',
+      progress.toString()
+    );
+
+    this.updateTimeDisplay(this.duration * 60 - elapsed, elapsed, 1 - progress);
+  }
+
+  private updateTimeDisplay(timeLeft: number, elapsed: number, percentage: number) {
+    const theta = 2 * Math.PI * (percentage - 0.25);
+    const circleEndX = 100 + 90 * Math.cos(theta);
+    const circleEndY = 100 + 90 * Math.sin(theta);
+    this.pathD = 'M100 10 A90 90 0 ' + (percentage > 0.5 ? '1' : '0') + ' 1 ' + circleEndX + ' ' + circleEndY;
+
+    const twoNumbers = (n: number) => n < 10 && n >= 0 ? '0' + n.toString() : n.toString();
+    this.minutes = Math.max(Math.floor(timeLeft / 60), 0);
+    this.seconds = Math.max(Math.floor(timeLeft % 60), 0);
+    this.minutesText = twoNumbers(this.minutes);
+    this.secondsText = twoNumbers(this.seconds);
+
+    const progress = -1 * (elapsed / (this.duration * 60));
+    this.dashOffset = elapsed;
+  }
+
+  startWhereWeAre() {
+    this.startTimer(25);
+  }
+
+  stopTimer() {
+    clearInterval(this.interval);
+  }
+}