vcgit-forge/angular-challenges
1
0
Fork 0
mirror of https://github.com/Raghu-Ch/angular-challenges.git synced 2026-02-10 12:53:03 -05:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'main' into forms-control-value-accessor

Browse Source
This commit is contained in:
thomas
2023-12-16 11:23:00 +01:00
parent 941346e618 7e77b8a4a3
commit 42b8ebee3d
19 changed files with 762 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
apps/performance/christmas-web-worker/src/app/app.component.ts
View File

@@ -11,11 +11,11 @@ import { UnknownPersonComponent } from './unknown-person/unknown-person.componen
template: `
<unknown-person [step]="loadingPercentage()" class="relative grow" />
<button
class="border border-white rounded-md px-4 py-2 text-white w-fit self-center text-2xl my-3"
class="my-3 w-fit self-center rounded-md border border-white px-4 py-2 text-2xl text-white"
(click)="discover()">
Discover
</button>
<div class="text-white p-1">Progress: {{ loadingPercentage() }}%</div>
<div class="p-1 text-white">Progress: {{ loadingPercentage() }}%</div>
`,
host: {
class: `flex flex-col h-screen w-screen bg-[#1f75c0]`,

6
apps/performance/christmas-web-worker/src/app/heavy-calculation.service.ts
View File

@@ -6,14 +6,14 @@ export class HeavyCalculationService {
private loadingLength = signal(0);
loadingPercentage = computed(
() => (this.loadingLength() * 100) / this.finalLength
() => (this.loadingLength() * 100) / this.finalLength,
);
startLoading() {
this.randomHeavyCalculalationFunction();
this.randomHeavyCalculationFunction();
}
private randomHeavyCalculalationFunction() {
private randomHeavyCalculationFunction() {
for (let num = 2; num <= 10000000; num++) {
let randomFlag = true;
for (let i = 2; i <= Math.sqrt(num); i++) {

6
apps/performance/christmas-web-worker/src/app/unknown-person/unknown-person.component.ts
View File

@@ -4,16 +4,16 @@ import { Component, Input } from '@angular/core';
standalone: true,
template: `
<div
class="bg-black absolute inset-0 z-10 text-white text-center text-3xl"
class="absolute inset-0 z-10 bg-black text-center text-3xl text-white"
[style.height.%]="100 - step">
@if (step !== 100) {
<div
class="relative top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2">
class="relative left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2">
Who is here?
</div>
}
</div>
<div class="text-center text-white text-4xl">Happy Christmas !!!</div>
<div class="text-center text-4xl text-white">Happy Christmas !!!</div>
<div class="container">
<div class="santa">
<div class="hand-l"></div>