|
1 | 1 | <script lang="ts"> |
2 | | - import { onMount } from "svelte"; |
3 | | - import Socials from "../socials/Socials.svelte"; |
| 2 | + import { onMount } from "svelte"; |
| 3 | + import Socials from "../socials/Socials.svelte"; |
4 | 4 |
|
5 | | - // Roles |
6 | | - const typingInterval: number = 50; |
| 5 | + // Roles |
| 6 | + const typingInterval: number = 50; |
7 | 7 |
|
8 | | - function addCharacter(str1: string, str2: string) { |
9 | | - // str1: incomplete string, add a character after this |
10 | | - // str2: complete string, add a character from this |
| 8 | + function addCharacter(str1: string, str2: string) { |
| 9 | + // str1: incomplete string, add a character after this |
| 10 | + // str2: complete string, add a character from this |
11 | 11 |
|
12 | | - let str1Length = str1.length; |
13 | | - let str2Length = str2.length; |
| 12 | + let str1Length = str1.length; |
| 13 | + let str2Length = str2.length; |
14 | 14 |
|
15 | | - if (str1Length < str2Length) { |
16 | | - return str1 + str2[str1Length]; |
17 | | - } else { |
18 | | - return str1; |
19 | | - } |
20 | | - } |
| 15 | + if (str1Length < str2Length) { |
| 16 | + return str1 + str2[str1Length]; |
| 17 | + } else { |
| 18 | + return str1; |
| 19 | + } |
| 20 | + } |
21 | 21 |
|
22 | | - function sleep(ms: number) { |
23 | | - return new Promise((resolve) => setTimeout(resolve, ms)); |
24 | | - } |
| 22 | + function sleep(ms: number) { |
| 23 | + return new Promise((resolve) => setTimeout(resolve, ms)); |
| 24 | + } |
25 | 25 |
|
26 | | - // Greeting |
27 | | - let date = new Date(); |
28 | | - let hour = date.getHours(); |
| 26 | + // Greeting |
| 27 | + let date = new Date(); |
| 28 | + let hour = date.getHours(); |
29 | 29 |
|
30 | | - let greeting: string = ""; |
| 30 | + let greeting: string = ""; |
31 | 31 |
|
32 | | - if (hour >= 0 && hour < 12) { |
33 | | - greeting = "morning"; |
34 | | - } else if (hour >= 12 && hour < 18) { |
35 | | - greeting = "afternoon"; |
36 | | - } else if (hour >= 18) { |
37 | | - greeting = "evening"; |
38 | | - } |
| 32 | + if (hour >= 0 && hour < 12) { |
| 33 | + greeting = "morning"; |
| 34 | + } else if (hour >= 12 && hour < 18) { |
| 35 | + greeting = "afternoon"; |
| 36 | + } else if (hour >= 18) { |
| 37 | + greeting = "evening"; |
| 38 | + } |
39 | 39 |
|
40 | | - let greetingState: string = $state(""); |
41 | | - let greetingPulse: HTMLElement; |
| 40 | + let greetingState: string = $state(""); |
| 41 | + let greetingPulse: HTMLElement; |
42 | 42 |
|
43 | | - async function animateGreeting(greeting: string) { |
44 | | - for (let i = 0; i < greeting.length; i++) { |
45 | | - greetingState = addCharacter(greetingState, greeting); |
| 43 | + async function animateGreeting(greeting: string) { |
| 44 | + for (let i = 0; i < greeting.length; i++) { |
| 45 | + greetingState = addCharacter(greetingState, greeting); |
46 | 46 |
|
47 | | - if (i === greeting.length - 1) { |
48 | | - greetingPulse.classList.remove("animate-pulse"); |
49 | | - greetingPulse.classList.add("hidden"); |
50 | | - } |
| 47 | + if (i === greeting.length - 1 && greetingPulse) { |
| 48 | + greetingPulse.classList.remove("animate-pulse"); |
| 49 | + greetingPulse.classList.add("hidden"); |
| 50 | + } |
51 | 51 |
|
52 | | - await sleep(typingInterval); |
53 | | - } |
54 | | - } |
| 52 | + await sleep(typingInterval); |
| 53 | + } |
| 54 | + } |
55 | 55 |
|
56 | | - // after window finish loading, call animateRoles() |
57 | | - onMount(async () => { |
58 | | - await sleep(500); |
59 | | - animateGreeting(greeting); |
60 | | - }); |
| 56 | + // after window finish loading, call animateRoles() |
| 57 | + onMount(async () => { |
| 58 | + await sleep(500); |
| 59 | + animateGreeting(greeting); |
| 60 | + }); |
61 | 61 | </script> |
62 | 62 |
|
63 | 63 | <span> |
64 | | - Good {greetingState}<span |
65 | | - bind:this={greetingPulse} |
66 | | - class="animate-pulse font-extralight">|</span |
67 | | - ></span |
| 64 | + Good {greetingState}<span |
| 65 | + bind:this={greetingPulse} |
| 66 | + class="animate-pulse font-extralight">|</span |
| 67 | + ></span |
68 | 68 | > |
0 commit comments