diff --git a/PersonalWebsite/Components/TerminalCommands.razor b/PersonalWebsite/Components/TerminalCommands.razor
index 5cce430..f075098 100644
--- a/PersonalWebsite/Components/TerminalCommands.razor
+++ b/PersonalWebsite/Components/TerminalCommands.razor
@@ -1,16 +1,34 @@
-@for (int i = 0; i <= ExecutedCommandCount - 1; i++)
+@if (CurrentState is State.Waiting)
{
-
+
}
-
-@if (!IsAnimating && ExecutedCommandCount != Commands.Length)
+else
{
-
+ for (int i = 0; i <= ExecutedCommandCount - 1; i++)
+ {
+
+ }
+
+ @if (ShowCursor)
+ {
+
>
+ }
+
+ @if (IsTyping)
+ {
+
+ }
}
@code {
- private bool IsAnimating { get; set; } = false;
+ private State CurrentState { get; set; } = State.Waiting;
+
+ private bool IsTyping { get; set; }
+ private bool ShowCursor => HasNext() && !IsTyping;
+
private int ExecutedCommandCount { get; set; } = 0;
[Parameter]
@@ -19,26 +37,38 @@
[Parameter]
public EventCallback OnComplete { get; set; }
- private void Start()
+ private async Task OnCommandCompleted()
{
- IsAnimating = true;
- ExecutedCommandCount++;
- }
-
- private async Task AnimateNextCommand()
- {
- IsAnimating = false;
+ IsTyping = false;
StateHasChanged();
await Task.Delay(600);
- if (ExecutedCommandCount == Commands.Length)
+ if (!HasNext())
{
await OnComplete.InvokeAsync();
return;
}
- IsAnimating = true;
+ EnterNextCommand();
+ }
+
+ private bool HasNext()
+ {
+ return ExecutedCommandCount < Commands.Length;
+ }
+
+ private void EnterNextCommand()
+ {
+ IsTyping = true;
ExecutedCommandCount++;
}
+
+ private void Start()
+ {
+ CurrentState = State.Running;
+ EnterNextCommand();
+ }
+
+ private enum State { Waiting, Running, Completed }
}
diff --git a/PersonalWebsite/wwwroot/sfx/keyboard-typing.mp3 b/PersonalWebsite/wwwroot/sfx/keyboard-typing.mp3
new file mode 100644
index 0000000..4494290
Binary files /dev/null and b/PersonalWebsite/wwwroot/sfx/keyboard-typing.mp3 differ